Merge pull request redhat-edge-computing#5 from danmacpherson/ui-improvements

Updating some of the menu UI

Author: danmacpherson

layouts/blog/single.html

@@ -8,7 +8,7 @@
             <a href="/blog/" class="pf-c-nav__link">
               <span class="pf-c-icon pf-m-md pf-m-inline">
                 <span class="pf-c-icon__content">
-                  <i class="fas fa-arrow-left" aria-hidden="true"></i>
+                  <i class="fas fa-angle-left" aria-hidden="true"></i>
                 </span>
               </span>
               <span style="padding-left: 10px;">Back to Blog</span>

layouts/partials/menu-contribute.html

@@ -1,10 +1,24 @@
+{{ $currentPage := . }}
 <div class="pf-c-nav">
   <ul class="pf-c-nav__list">
     {{ range .Site.Menus.contribute }}
-      <li class="pf-c-nav__item">
-        <a href="{{ .URL }}" class="pf-c-nav__link">
+      <li class="pf-c-nav__item pf-m-expanded">
+        <a href="{{ .URL }}" class="pf-c-nav__link {{ if ( $currentPage.IsMenuCurrent "contribute" . ) -}}pf-m-current{{- end -}}">
           {{- .Name -}}
         </a>
+        {{- if and (.HasChildren) (or ( $currentPage.IsMenuCurrent "contribute" . ) ( $currentPage.HasMenuCurrent "contribute" . )) -}}
+        <section class="pf-c-nav__subnav ">
+          <ul class="pf-c-nav__list">
+            {{- range .Children }}
+              <li class="pf-c-nav__item pf-m-expanded">
+                <a href="{{ .URL }}" class="pf-c-nav__link {{ if ( $currentPage.IsMenuCurrent "contribute" . ) -}}pf-m-current{{- end -}}">
+                  {{- .Name -}}
+                </a>
+              </li>
+            {{ end }}
+          </ul>
+        </section>
+        {{ end }}
       </li>
     {{ end }}
   </ul>

layouts/partials/menu-learn.html

@@ -1,10 +1,24 @@
+{{ $currentPage := . }}
 <div class="pf-c-nav">
   <ul class="pf-c-nav__list">
     {{ range .Site.Menus.learn }}
-      <li class="pf-c-nav__item">
-        <a href="{{ .URL }}" class="pf-c-nav__link">
+      <li class="pf-c-nav__item pf-m-expanded">
+        <a href="{{ .URL }}" class="pf-c-nav__link {{ if ( $currentPage.IsMenuCurrent "learn" . ) -}}pf-m-current{{- end -}}">
           {{- .Name -}}
         </a>
+        {{- if and (.HasChildren) (or ( $currentPage.IsMenuCurrent "learn" . ) ( $currentPage.HasMenuCurrent "learn" . )) -}}
+        <section class="pf-c-nav__subnav ">
+          <ul class="pf-c-nav__list">
+            {{- range .Children }}
+              <li class="pf-c-nav__item pf-m-expanded">
+                <a href="{{ .URL }}" class="pf-c-nav__link {{ if ( $currentPage.IsMenuCurrent "learn" . ) -}}pf-m-current{{- end -}}">
+                  {{- .Name -}}
+                </a>
+              </li>
+            {{ end }}
+          </ul>
+        </section>
+        {{ end }}
       </li>
     {{ end }}
   </ul>

layouts/partials/menu-patterns.html

@@ -1,37 +1,38 @@
+{{ $currentlink := .RelPermalink }}
 <div class="pf-c-nav">
   <ul class="pf-c-nav__list">
     <li class="pf-c-nav__item">
       <a href="/patterns/" class="pf-c-nav__link">
         <span class="pf-c-icon pf-m-md pf-m-inline">
           <span class="pf-c-icon__content">
-            <i class="fas fa-arrow-left" aria-hidden="true"></i>
+            <i class="fas fa-angle-left" aria-hidden="true"></i>
           </span>
         </span>
         <span style="padding-left: 10px;">Back to Patterns</span>
       </a>
     </li>
     {{ if .Page.IsNode }}
-      <li class="pf-c-nav__item">
-        <a href="{{ .Permalink }}" class="pf-c-nav__link">
+      <li class="pf-c-nav__item pf-m-expanded">
+        <a href="{{ .Permalink }}" class="pf-c-nav__link pf-m-current">
           {{- .Title -}}
         </a>
       </li>
       {{ range .Pages }}
-        <li class="pf-c-nav__item">
+        <li class="pf-c-nav__item pf-m-expanded">
           <a href="{{ .Permalink }}" class="pf-c-nav__link">
             {{- .Title -}}
           </a>
         </li>
       {{ end }}
     {{ else }}
-      <li class="pf-c-nav__item">
+      <li class="pf-c-nav__item pf-m-expanded">
         <a href="{{ .Parent.Permalink }}" class="pf-c-nav__link">
           {{- .Parent.Title -}}
         </a>
       </li>
       {{ range .Parent.Pages }}
-        <li class="pf-c-nav__item">
-          <a href="{{ .Permalink }}" class="pf-c-nav__link">
+        <li class="pf-c-nav__item pf-m-expanded">
+          <a href="{{ .Permalink }}" class="pf-c-nav__link {{ if (eq .RelPermalink $currentlink) }}pf-m-current{{ end }}">
             {{- .Title -}}
           </a>
         </li>