Cybre theme

inline-script.js

@@ -2,7 +2,8 @@
 // To allow CSP to work correctly, we also calculate a sha256 hash during
 // the build process and write it to inline-script-checksum.json.
 window.__themeColors = {
-  'default': 'royalblue',
+  'default': 'cybre',
+  cybre: '#1ea21e',
   scarlet: '#e04e41',
   seafoam: '#177380',
   hotpants: 'hotpink',

routes/_static/themes.js

@@ -1,7 +1,11 @@
 const themes = [
+  {
+    name: 'cybre',
+    label: 'Cybre (default)'
+  },
   {
     name: 'default',
-    label: 'Royal (default)'
+    label: 'Royal'
   },
   {
     name: 'scarlet',

scss/themes/_offline.scss

@@ -13,6 +13,7 @@ $compose-background: lighten($main-theme-color, 17%);
 @import "_base.scss";
 
 body.offline,
+body.theme-cybre.offline,
 body.theme-hotpants.offline,
 body.theme-majesty.offline,
 body.theme-oaken.offline,

scss/themes/cybre.scss

@@ -0,0 +1,19 @@
+$main-theme-color: #2c2c2c;
+$body-bg-color: #181818;
+$main-bg-color: #222;
+$anchor-color: lighten($main-theme-color, 20%);
+$main-text-color: #fafaff;
+$border-color: lighten($main-bg-color, 16%);
+$secondary-text-color: #1ea21e;
+$toast-border: $main-theme-color;
+$toast-bg: lighten($body-bg-color, 4%);
+$focus-outline: darken($main-theme-color, 10%);
+$compose-background: darken($main-theme-color, 12%);
+
+@import "_base.scss";
+@import "_dark.scss";
+
+body.theme-cybre {
+  @include baseTheme();
+  @include darkTheme();
+}