diff options
Diffstat (limited to 'templates/page.html')
| -rw-r--r-- | templates/page.html | 272 |
1 files changed, 160 insertions, 112 deletions
diff --git a/templates/page.html b/templates/page.html index d10adbc..eb7d141 100644 --- a/templates/page.html +++ b/templates/page.html @@ -10,7 +10,6 @@ <a href="{{ config.base_url}}">{{ config.title }}</a> </div> <nav class="site-nav hide-in-mobile"> - {% for menu_item in config.extra.hermit_menu %} <a href="{{ config.base_url ~ menu_item.link }}">{{ menu_item.name }}</a> {% endfor %} @@ -21,16 +20,8 @@ {{ macros::render_social_icons() }} </span> <button id="menu-btn" class="hdr-btn" title="Menu"> - <svg - xmlns="http://www.w3.org/2000/svg" - width="24" - height="24" - viewBox="0 0 24 24" - fill="none" - stroke="currentColor" - stroke-width="2" - stroke-linecap="round" - stroke-linejoin="round" + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu"> <line x1="3" y1="12" x2="21" y2="12"></line> <line x1="3" y1="6" x2="21" y2="6"></line> @@ -40,10 +31,13 @@ </div> </div> </header> + <div id="mobile-menu" class="animated fast"> <ul> {% for menu_item in config.extra.hermit_menu %} - <li><a href="{{ config.base_url ~ menu_item.link }}">{{ menu_item.name }}</a></li> + <li> + <a href="{{ config.base_url ~ menu_item.link }}">{{ menu_item.name }}</a> + </li> {% endfor %} </ul> </div> @@ -54,116 +48,170 @@ {% block main %} <main class="site-main section-inner animated fadeIn faster"> <article class="thin"> - <header class="post-header"> - <div class="post-meta"> - {% if page.date %} - <span>{{ page.date | date(format="%b %d, %Y")}}</span> - <small> - {{ macros::read_time(words=page.word_count) }}</small> - {% endif %} - {% if page.extra.toc %} - <button id="toc-btn" class="hdr-btn desktop-only-ib"> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" - viewBox="0 0 24 24" fill="none" stroke="currentColor" - stroke-width="2" stroke-linecap="round" stroke-linejoin="round" - class="feather feather-list"> - <line x1="8" y1="6" x2="21" y2="6"></line> - <line x1="8" y1="12" x2="21" y2="12"></line> - <line x1="8" y1="18" x2="21" y2="18"></line> - <line x1="3" y1="6" x2="3" y2="6"></line> - <line x1="3" y1="12" x2="3" y2="12"></line> - <line x1="3" y1="18" x2="3" y2="18"></line> - </svg><span> ToC</span> - </button> - {% endif %} - </div> - <h1>{{ page.title }}</h1> - </header> - - <div class="content"> - {{ page.content | safe }} - </div> - - <hr class="post-end"> - <footer class="post-info"> - {% if page.taxonomies and page.taxonomies.tags %} - <p> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag meta-icon"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path><line x1="7" y1="7" x2="7" y2="7"></line></svg> - {% for k, tags in page.taxonomies %} - {% for t in tags %} - <span class="tag"><a href="{{get_taxonomy_url(kind="tags", name=t)}}">{{t}}</a></span> - {% endfor %} - {% endfor %} - </p> - {% endif %} - <p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>{{ page.word_count}} Words</p> - {% if page.date %} - <p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>{{ page.date }}</p> - {% endif %} - </footer> + <header class="post-header"> + <div class="post-meta"> + + {% if page.date %} + <span>{{ page.date | date(format="%b %d, %Y")}}</span> + <small> - {{ macros::read_time(words=page.word_count) }}</small> + {% endif %} + + {% if page.extra.toc %} + <button id="toc-btn" class="hdr-btn desktop-only-ib"> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-list"> + <line x1="8" y1="6" x2="21" y2="6"></line> + <line x1="8" y1="12" x2="21" y2="12"></line> + <line x1="8" y1="18" x2="21" y2="18"></line> + <line x1="3" y1="6" x2="3" y2="6"></line> + <line x1="3" y1="12" x2="3" y2="12"></line> + <line x1="3" y1="18" x2="3" y2="18"></line> + </svg> + <span> ToC</span> + </button> + {% endif %} + + </div> + <h1>{{ page.title }}</h1> + </header> + + <div class="content"> + {{ page.content | safe }} + </div> + + <hr class="post-end"> + + <footer class="post-info"> + + {% if page.taxonomies and page.taxonomies.tags %} + <p> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-tag meta-icon"> + <path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path> + <line x1="7" y1="7" x2="7" y2="7"></line> + </svg> + + {% for k, tags in page.taxonomies %} + {% for t in tags %} + <span class="tag"> + <a href="{{get_taxonomy_url(kind="tags", name=t)}}">{{t}}</a> + </span> + {% endfor %} + {% endfor %} + </p> + {% endif %} + + <p> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-file-text"> + <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path> + <polyline points="14 2 14 8 20 8"></polyline> + <line x1="16" y1="13" x2="8" y2="13"></line> + <line x1="16" y1="17" x2="8" y2="17"></line> + <polyline points="10 9 9 9 8 9"></polyline> + </svg> + + {{ page.word_count }} Words + </p> + + {% if page.date %} + <p> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-calendar"> + <rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect> + <line x1="16" y1="2" x2="16" y2="6"></line> + <line x1="8" y1="2" x2="8" y2="6"></line> + <line x1="3" y1="10" x2="21" y2="10"></line> + </svg> + + {{ page.date }} + </p> + {% endif %} + + </footer> </article> - {% if page.extra.toc %} - <aside id="toc"> - <div id="TableOfContents"> - <div class="toc-title">Table of Contents</div> + + {% if page.extra.toc %} + <aside id="toc"> + <div id="TableOfContents"> + <div class="toc-title">Table of Contents</div> + <ul> + {% for h1 in page.toc %} + <li> + <a href="{{h1.permalink | safe}}">{{ h1.title }}</a> + {% if h1.children %} <ul> - {% for h1 in page.toc %} - <li> - <a href="{{h1.permalink | safe}}">{{ h1.title }}</a> - {% if h1.children %} - <ul> - {% for h2 in h1.children %} - <li> - <a href="{{h2.permalink | safe}}">{{ h2.title }}</a> - </li> - {% endfor %} - </ul> - {% endif %} - </li> - {% endfor %} + {% for h2 in h1.children %} + <li> + <a href="{{h2.permalink | safe}}">{{ h2.title }}</a> + </li> + {% endfor %} </ul> - </div> + {% endif %} + </li> + {% endfor %} + </ul> + </div> </aside> {% endif %} <div class="post-nav thin"> - {% if page.extra.later %} - <a class="next-post" href="{{ page.extra.later.permalink }}"> - <span class="post-nav-label"> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"> - <line x1="19" y1="12" x2="5" y2="12"></line> - <polyline points="12 19 5 12 12 5"></polyline> - </svg> Newer</span><br> - <span>{{ page.extra.later.title }}</span> - </a> - {% endif %} - {% if page.extra.earlier %} - <a class="prev-post" href="{{ page.extra.earlier.permalink }}"> - <span class="post-nav-label">Older <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span><br> - <span>{{ page.extra.earlier.title }}</span> - </a> - {% endif %} + + {% if page.extra.later %} + <a class="next-post" href="{{ page.extra.later.permalink }}"> + <span class="post-nav-label"> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-arrow-left"> + <line x1="19" y1="12" x2="5" y2="12"></line> + <polyline points="12 19 5 12 12 5"></polyline> + </svg> + Newer + </span> + <br> + <span>{{ page.extra.later.title }}</span> + </a> + {% endif %} + + {% if page.extra.earlier %} + <a class="prev-post" href="{{ page.extra.earlier.permalink }}"> + <span class="post-nav-label"> + Older + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" + stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" + class="feather feather-arrow-right"> + <line x1="5" y1="12" x2="19" y2="12"></line> + <polyline points="12 5 19 12 12 19"></polyline> + </svg> + </span> + <br> + <span>{{ page.extra.earlier.title }}</span> + </a> + {% endif %} + </div> - {% if config.extra.disqus.enable and not page.extra.disable_comments%} - <div id="disqus_thread" class="thin"></div> - <script> - /** - * RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS. - * LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables */ - - (function() { // DON'T EDIT BELOW THIS LINE - var disqus_config = function () { - this.page.url = "{{ page.permalink }}"; // Replace PAGE_URL with your page's canonical URL variable - this.page.identifier = "{{ page.permalink }}"; // Replace PAGE_IDENTIFIER with your page's unique identifier variable - }; - var d = document, s = d.createElement('script'); - s.src = 'https://{{config.extra.disqus.shortname}}.disqus.com/embed.js'; - s.setAttribute('data-timestamp', +new Date()); - (d.head || d.body).appendChild(s); - })(); - </script> - <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript> + {% if config.extra.disqus.enable and not page.extra.disable_comments %} + <div id="disqus_thread"></div> + <script> + (function() { + var disqus_config = function () { + this.page.url = "{{ page.extra.permalink }}"; + this.page.identifier = "{{ page.extra.permalink }}"; + }; + var d = document, s = d.createElement('script'); + s.src = 'https://{{config.extra.disqus.shortname}}.disqus.com/embed.js'; + s.setAttribute('data-timestamp', + new Date()); + (d.head || d.body).appendChild(s); + })(); + </script> + <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript> {% endif %} + </main> {% endblock main %} |