Merge pull request #143 from cherryblossom000/menu-bar

fix menu bar (again)

Author: tgdwyer

_config.yml

@@ -25,7 +25,7 @@ google_analytics: UA-159840333-1
 # Build settings
 markdown: kramdown
 #theme: minima
-remote_theme: jekyll/minima
+remote_theme: jekyll/minima@0b7ca6b
 
 plugins:
   - jekyll-feed

_includes/footer.html

@@ -1,37 +1,38 @@
+<link id="fa-stylesheet" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@latest/css/all.min.css">
 <footer class="site-footer h-card">
     <data class="u-url" href="{{ "/" | relative_url }}"></data>
-  
+
     <div class="wrapper">
-  
-      <div class="footer-col-wrapper">
-        <div class="footer-col">
-          <!-- <p class="feed-subscribe">
-            <a href="{{ 'feed.xml' | relative_url }}">
-              <svg class="svg-icon orange">
-                <use xlink:href="{{ 'assets/minima-social-icons.svg#rss' | relative_url }}"></use>
-              </svg><span>Subscribe</span>
-            </a>
-          </p> -->
-        {%- if site.author %}
-          <ul class="contact-list">
-            {% if site.author.name -%}
-              <li class="p-name">{{ site.author.name | escape }}</li>
-            {% endif -%}
-            {% if site.author.email -%}
-              <li><a class="u-email" href="mailto:{{ site.author.email }}">{{ site.author.email }}</a></li>
+
+        <div class="footer-col-wrapper">
+            <div class="footer-col">
+                <!-- <p class="feed-subscribe">
+                <a href="{{ 'feed.xml' | relative_url }}">
+                    <svg class="svg-icon orange">
+                        <use xlink:href="{{ 'assets/minima-social-icons.svg#rss' | relative_url }}"></use>
+                    </svg><span>Subscribe</span>
+                </a>
+                </p> -->
+                {%- if site.author %}
+                <ul class="contact-list">
+                    {% if site.author.name -%}
+                    <li class="p-name">{{ site.author.name | escape }}</li>
+                    {% endif -%}
+                    {% if site.author.email -%}
+                    <li><a class="u-email" href="mailto:{{ site.author.email }}">{{ site.author.email }}</a></li>
+                    {%- endif %}
+                </ul>
             {%- endif %}
-          </ul>
-        {%- endif %}
         </div>
         <div class="footer-col">
-          <p>{{ site.description | escape }}</p>
+            <p>{{ site.description | escape }}</p>
         </div>
-      </div>
-  
-      <div class="social-links">
+    </div>
+
+    <div class="social-links">
         {%- include social.html -%}
-      </div>
-  
     </div>
-  
-  </footer>
+
+    </div>
+
+</footer>

_includes/header.html

@@ -12,29 +12,24 @@
             <input type="checkbox" id="nav-trigger" class="nav-trigger" />
             <label for="nav-trigger">
                 <span class="menu-icon">
-                    <svg viewBox="0 0 18 15" width="18px" height="15px">
-                    <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
-                    </svg>
                 </span>
             </label>
 
-            <div class="trigger">
-                <div id="nav-menu">
-                    {%- for path in page_paths -%}
-                        {%- assign my_page = site.pages | where: "path", path | first -%}
-                        {%- if my_page.title -%}
-                        <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
-                        {%- endif -%}
-                    {%- endfor -%}
-                    <!-- Radio Switch -->
-                    <div id="toggle-div" style="display: none;">
-                        <div class="solutions-toggle">
-                            <p class="page-link" style="margin-bottom: 0px;">Show Solutions?</p>
-                            <label class="switch" style="vertical-align: middle;">
-                                <input type="checkbox" id="toggle-switch">
-                                <span class="slider round"></span>
-                            </label>
-                        </div>
+            <div class="nav-items">
+                {%- for path in page_paths -%}
+                    {%- assign my_page = site.pages | where: "path", path | first -%}
+                    {%- if my_page.title -%}
+                    <a class="page-link nav-item" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
+                    {%- endif -%}
+                {%- endfor -%}
+                <!-- Radio Switch -->
+                <div id="toggle-div" style="display: none;">
+                    <div class="solutions-toggle">
+                        <p class="page-link" style="margin-bottom: 0px;">Show Solutions?</p>
+                        <label class="switch" style="vertical-align: middle;">
+                            <input type="checkbox" id="toggle-switch">
+                            <span class="slider round"></span>
+                        </label>
                     </div>
                 </div>
             </div>

_sass/minima/custom-styles.scss

@@ -150,7 +150,7 @@ input:checked + .slider:before {
   z-index: 1;
 }
 
-.site-nav .trigger {
+.nav-items {
   display: flex;
   align-items: center;
   justify-content: space-between; /* Adjust this as needed */
@@ -159,9 +159,15 @@ input:checked + .slider:before {
   box-sizing: border-box; /* Ensure padding is included in the width calculation */
 }
 
+#nav-items {
+  display: flex;
+  gap: 1em;
+}
+
 .solutions-toggle {
   display: flex;
   align-items: center;
+  gap: 0.5em;
 }
 
 .spoiler, .spoiler * {