« get me outta code hell

hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
diff options
context:
space:
mode:
-rw-r--r--src/content/dependencies/generateAlbumSecondaryNav.js7
-rw-r--r--src/content/dependencies/generateSecondaryNav.js9
-rw-r--r--src/static/css/site.css4
3 files changed, 18 insertions, 2 deletions
diff --git a/src/content/dependencies/generateAlbumSecondaryNav.js b/src/content/dependencies/generateAlbumSecondaryNav.js
index 5a5ebbda..79a26b19 100644
--- a/src/content/dependencies/generateAlbumSecondaryNav.js
+++ b/src/content/dependencies/generateAlbumSecondaryNav.js
@@ -75,6 +75,11 @@ export default {
       validate: v => v.is('album', 'track'),
       default: 'album',
     },
+
+    alwaysVisible: {
+      type: 'boolean',
+      default: false,
+    },
   },
 
   generate(relations, slots, {html}) {
@@ -102,6 +107,8 @@ export default {
     ];
 
     return relations.secondaryNav.slots({
+      alwaysVisible: slots.alwaysVisible,
+
       class: [
         'album-secondary-nav',
 
diff --git a/src/content/dependencies/generateSecondaryNav.js b/src/content/dependencies/generateSecondaryNav.js
index e9aef66e..f4081e70 100644
--- a/src/content/dependencies/generateSecondaryNav.js
+++ b/src/content/dependencies/generateSecondaryNav.js
@@ -10,11 +10,20 @@ export default {
     class: {
       validate: v => v.anyOf(v.isString, v.sparseArrayOf(v.isString)),
     },
+
+    alwaysVisible: {
+      type: 'boolean',
+      default: false,
+    },
   },
 
   generate: (slots, {html}) =>
     html.tag('nav', {id: 'secondary-nav'},
       {[html.onlyIfContent]: true},
       {class: slots.class},
+
+      slots.alwaysVisible &&
+        {class: 'always-visible'},
+
       slots.content),
 };
diff --git a/src/static/css/site.css b/src/static/css/site.css
index b696e2ce..c37e912f 100644
--- a/src/static/css/site.css
+++ b/src/static/css/site.css
@@ -2951,8 +2951,8 @@ html[data-language-code="preview-en"][data-url-key="localized.home"] #content
 /* Layout - Wide (most computers) */
 
 @media (min-width: 900px) {
-  #page-container.showing-sidebar-left #secondary-nav,
-  #page-container.showing-sidebar-right #secondary-nav {
+  #page-container.showing-sidebar-left #secondary-nav:not(.always-visible),
+  #page-container.showing-sidebar-right #secondary-nav:not(.always-visible) {
     display: none;
   }
 }