2 files changed, 19 insertions, 0 deletions

diff --git a/tpl/objects/navbar.pug b/tpl/objects/navbar.pug
index 889d6ad..6248e28 100644
--- a/tpl/objects/navbar.pug
+++ b/tpl/objects/navbar.pug
@@ -8,6 +8,9 @@ mixin navbar
             'o-navbar': true,
             'o-navbar--quiet': attributes.quiet,
         }
+        if (attributes.theme) {
+            classes['o-navbar--' + attributes.theme] = true
+        }
         if (attributes.class) {
             classes[attributes.class] = true;
         }
diff --git a/tpl/views/navbar.pug b/tpl/views/navbar.pug
index 1ca49b9..9272796 100644
--- a/tpl/views/navbar.pug
+++ b/tpl/views/navbar.pug
@@ -23,3 +23,19 @@ mixin view-navbar
                 +navbar-item(icon="image")= 'Home'
                 +navbar-item(icon="video" selected=true)= 'Art'
                 +navbar-item(icon="user")= 'Emojis'
+
+        each theme in ['static-black', 'static-white']
+            -
+                const bg = theme.startsWith('static-black') ? 500 : 1000;
+
+            .c-box(style=`background-color: var(--colors--blue-static--${bg});`)
+                +navbar(theme=theme)
+                    +navbar-item(icon="image")= 'Home'
+                    +navbar-item(icon="video" selected=true)= 'Art'
+                    +navbar-item(icon="user")= 'Emojis'
+
+            .c-box(style=`background-color: var(--colors--blue-static--${bg});`)
+                +navbar(quiet=true theme=theme)
+                    +navbar-item(icon="image")= 'Home'
+                    +navbar-item(icon="video" selected=true)= 'Art'
+                    +navbar-item(icon="user")= 'Emojis'