add Extensions category to navbar (PR #84)

Author: mojavelinux

src/css/header.css

@@ -78,7 +78,7 @@ body {
   font-size: inherit;
   line-height: 1.5;
   padding: 0.25rem;
-  width: 10ex; /* width required to make input flexible */
+  width: 7ex; /* width required to make input flexible */
   height: -webkit-fit-content; /* fix for Safari */
   flex: auto;
 }

src/partials/header-content.hbs

@@ -40,13 +40,32 @@
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'asciidoctor::index.adoc')}}}">Asciidoctor <small>Ruby</small></a>
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'asciidoctor.js::index.adoc')}}}">Asciidoctor.js <small>JavaScript</small></a>
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'asciidoctorj::index.adoc')}}}">AsciidoctorJ <small>Java</small></a>
-            <hr class="navbar-divider">
+          </div>
+        </div>
+        <div class="navbar-item has-dropdown is-hoverable">
+          <div class="navbar-link">Extensions</div>
+          <div class="navbar-dropdown">
             <div class="navbar-item">Add-on Converters</div>
             {{!--
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'pdf-converter::index.adoc')}}}">PDF</a>
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'epub3-converter::index.adoc')}}}">EPUB3</a>
             --}}
             <a class="navbar-item" href="{{{relativize (resolvePageURL 'reveal.js-converter::index.adoc')}}}">reveal.js <small>Ruby, JavaScript</small></a>
+            <hr class="navbar-divider">
+            <div class="navbar-item">Extended Syntax</div>
+            {{#with (resolvePageURL 'diagram-extension::index.adoc')}}
+            <a class="navbar-item" href="{{{relativize this}}}">Asciidoctor Diagram <small>Ruby</small></a>
+            {{/with}}
+            {{!--
+            {{#with (resolvePageURL 'kroki-extension::index.adoc')}}
+            <a class="navbar-item" href="{{{relativize this}}}">Asciidoctor Kroki <small>JavaScript</small></a>
+            {{/with}}
+            <a class="navbar-item" href="#">Asciidoctor Chart</a>
+            <a class="navbar-item" href="#">Asciidoctor bibtex</a>
+            <div class="navbar-item">Feature Adapters</div>
+            <a class="navbar-item" href="#">Asciidoctor Mathematical <small>stem</small></a>
+            <a class="navbar-item" href="#">Asciidoctor Prism <small>source highlighter</small></a>
+            --}}
           </div>
         </div>
         <div class="navbar-item has-dropdown is-hoverable">
@@ -71,20 +90,6 @@
             <a class="navbar-item" href="https://intellij-asciidoc-plugin.ahus1.de/docs" target="_blank" rel="noopener">IntelliJ Plugin</a>
           </div>
         </div>
-        {{!--
-        <div class="navbar-item has-dropdown is-hoverable">
-          <div class="navbar-link">Extensions</div>
-          <div class="navbar-dropdown is-right">
-            <div class="navbar-item">Syntax</div>
-            <a class="navbar-item" href="#">Asciidoctor Diagram</a>
-            <a class="navbar-item" href="#">Asciidoctor Chart</a>
-            <a class="navbar-item" href="#">Asciidoctor bibtex</a>
-            <div class="navbar-item">Adapters</div>
-            <a class="navbar-item" href="#">Asciidoctor Mathematical <small>stem</small></a>
-            <a class="navbar-item" href="#">Asciidoctor Prism <small>source highlighter</small></a>
-          </div>
-        </div>
-        --}}
         <a class="navbar-item" href="https://github.com/asciidoctor" target="_blank" rel="noopener">
           <span class="icon"><img src="{{{uiRootPath}}}/img/octicons-16.svg#view-mark-github"></span>
         </a>