From 034a0fe06752cbb38f550cf2a2748c822ac8452a Mon Sep 17 00:00:00 2001
From: chr <chr@cybre.space>
Date: Sun, 19 Aug 2018 02:17:20 +0000
Subject: [PATCH 1/4] Cybre theme

---
 inline-script.js          |  3 ++-
 routes/_static/themes.js  |  6 +++++-
 scss/themes/_offline.scss |  1 +
 scss/themes/cybre.scss    | 19 +++++++++++++++++++
 4 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 scss/themes/cybre.scss

diff --git a/inline-script.js b/inline-script.js
index dffe370b..31b25a2d 100644
--- a/inline-script.js
+++ b/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',
diff --git a/routes/_static/themes.js b/routes/_static/themes.js
index 1d04699a..6f10d38d 100644
--- a/routes/_static/themes.js
+++ b/routes/_static/themes.js
@@ -1,7 +1,11 @@
 const themes = [
+  {
+    name: 'cybre',
+    label: 'Cybre (default)'
+  },
   {
     name: 'default',
-    label: 'Royal (default)'
+    label: 'Royal'
   },
   {
     name: 'scarlet',
diff --git a/scss/themes/_offline.scss b/scss/themes/_offline.scss
index 20da9961..cb1521a0 100644
--- a/scss/themes/_offline.scss
+++ b/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,
diff --git a/scss/themes/cybre.scss b/scss/themes/cybre.scss
new file mode 100644
index 00000000..a936b01f
--- /dev/null
+++ b/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();
+}

From 9ee658a803cc531be79a46ddece9a905e373ccff Mon Sep 17 00:00:00 2001
From: chr <chr@chronal.net>
Date: Sat, 18 Aug 2018 20:00:48 -0700
Subject: [PATCH 2/4] Update cybre theme

---
 scss/themes/cybre.scss | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/scss/themes/cybre.scss b/scss/themes/cybre.scss
index a936b01f..02b1b2b5 100644
--- a/scss/themes/cybre.scss
+++ b/scss/themes/cybre.scss
@@ -16,4 +16,12 @@ $compose-background: darken($main-theme-color, 12%);
 body.theme-cybre {
   @include baseTheme();
   @include darkTheme();
+
+  --anchor-text: #{$secondary-text-color};
+  --settings-list-item-text: #{$main-text-color};
+  --settings-list-item-text-hover: #{$main-text-color};
+
+  --action-button-fill-color-pressed: #{darken($secondary-text-color, 7%)};
+  --action-button-fill-color-pressed-hover: #{darken($secondary-text-color, 2%)};
+  --action-button-fill-color-pressed-active: #{darken($secondary-text-color, 15%)};
 }

From 8149e270ea8a7da2c49fdb58016d740b2b96ae96 Mon Sep 17 00:00:00 2001
From: chr <chr@chronal.net>
Date: Sat, 18 Aug 2018 20:07:43 -0700
Subject: [PATCH 3/4] Actually make cybre theme default

---
 inline-script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/inline-script.js b/inline-script.js
index 31b25a2d..fce50b6f 100644
--- a/inline-script.js
+++ b/inline-script.js
@@ -18,7 +18,7 @@ window.__themeColors = {
 if (localStorage.store_currentInstance && localStorage.store_instanceThemes) {
   let safeParse = (str) => str === 'undefined' ? undefined : JSON.parse(str)
   let theme = safeParse(localStorage.store_instanceThemes)[safeParse(localStorage.store_currentInstance)]
-  if (theme && theme !== 'default') {
+  if (theme && theme !== 'cybre') {
     document.body.classList.add(`theme-${theme}`)
     let link = document.createElement('link')
     link.rel = 'stylesheet'

From 2234ed3144921064e240aad18415c0c8f793b11f Mon Sep 17 00:00:00 2001
From: chr <chr@chronal.net>
Date: Sat, 18 Aug 2018 22:04:57 -0700
Subject: [PATCH 4/4] Make cybre theme the default, but actually

---
 inline-script.js          |  6 +++---
 routes/_static/themes.js  |  4 ++--
 scss/themes/_default.scss | 32 +++++++++++++++++++++-----------
 scss/themes/cybre.scss    | 27 ---------------------------
 scss/themes/royal.scss    | 17 +++++++++++++++++
 5 files changed, 43 insertions(+), 43 deletions(-)
 delete mode 100644 scss/themes/cybre.scss
 create mode 100644 scss/themes/royal.scss

diff --git a/inline-script.js b/inline-script.js
index fce50b6f..c34b92ef 100644
--- a/inline-script.js
+++ b/inline-script.js
@@ -2,8 +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': 'cybre',
-  cybre: '#1ea21e',
+  'default': '#1ea21e',
+  royal: 'royalblue',
   scarlet: '#e04e41',
   seafoam: '#177380',
   hotpants: 'hotpink',
@@ -18,7 +18,7 @@ window.__themeColors = {
 if (localStorage.store_currentInstance && localStorage.store_instanceThemes) {
   let safeParse = (str) => str === 'undefined' ? undefined : JSON.parse(str)
   let theme = safeParse(localStorage.store_instanceThemes)[safeParse(localStorage.store_currentInstance)]
-  if (theme && theme !== 'cybre') {
+  if (theme && theme !== 'default') {
     document.body.classList.add(`theme-${theme}`)
     let link = document.createElement('link')
     link.rel = 'stylesheet'
diff --git a/routes/_static/themes.js b/routes/_static/themes.js
index 6f10d38d..f6760dc3 100644
--- a/routes/_static/themes.js
+++ b/routes/_static/themes.js
@@ -1,10 +1,10 @@
 const themes = [
   {
-    name: 'cybre',
+    name: 'default',
     label: 'Cybre (default)'
   },
   {
-    name: 'default',
+    name: 'royal',
     label: 'Royal'
   },
   {
diff --git a/scss/themes/_default.scss b/scss/themes/_default.scss
index e36c9cdc..5e7cf8e2 100644
--- a/scss/themes/_default.scss
+++ b/scss/themes/_default.scss
@@ -1,17 +1,27 @@
-$main-theme-color: royalblue;
-$body-bg-color: lighten($main-theme-color, 38%);
-$anchor-color: $main-theme-color;
-$main-text-color: #333;
-$border-color: #dadada;
-$main-bg-color: white;
-$secondary-text-color: white;
-$toast-border: #fafafa;
-$toast-bg: #333;
-$focus-outline: lighten($main-theme-color, 30%);
-$compose-background: lighten($main-theme-color, 32%);
+$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 {
   @include baseTheme();
+  @include darkTheme();
+
+  --anchor-text: #{$secondary-text-color};
+  --settings-list-item-text: #{$main-text-color};
+  --settings-list-item-text-hover: #{$main-text-color};
+
+  --action-button-fill-color-pressed: #{darken($secondary-text-color, 7%)};
+  --action-button-fill-color-pressed-hover: #{darken($secondary-text-color, 2%)};
+  --action-button-fill-color-pressed-active: #{darken($secondary-text-color, 15%)};
 }
diff --git a/scss/themes/cybre.scss b/scss/themes/cybre.scss
deleted file mode 100644
index 02b1b2b5..00000000
--- a/scss/themes/cybre.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-$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();
-
-  --anchor-text: #{$secondary-text-color};
-  --settings-list-item-text: #{$main-text-color};
-  --settings-list-item-text-hover: #{$main-text-color};
-
-  --action-button-fill-color-pressed: #{darken($secondary-text-color, 7%)};
-  --action-button-fill-color-pressed-hover: #{darken($secondary-text-color, 2%)};
-  --action-button-fill-color-pressed-active: #{darken($secondary-text-color, 15%)};
-}
diff --git a/scss/themes/royal.scss b/scss/themes/royal.scss
new file mode 100644
index 00000000..e36c9cdc
--- /dev/null
+++ b/scss/themes/royal.scss
@@ -0,0 +1,17 @@
+$main-theme-color: royalblue;
+$body-bg-color: lighten($main-theme-color, 38%);
+$anchor-color: $main-theme-color;
+$main-text-color: #333;
+$border-color: #dadada;
+$main-bg-color: white;
+$secondary-text-color: white;
+$toast-border: #fafafa;
+$toast-bg: #333;
+$focus-outline: lighten($main-theme-color, 30%);
+$compose-background: lighten($main-theme-color, 32%);
+
+@import "_base.scss";
+
+body {
+  @include baseTheme();
+}