forked from cybrespace/pinafore
Make cybre theme the default, but actually
This commit is contained in:
parent
8149e270ea
commit
2234ed3144
|
@ -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'
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
const themes = [
|
||||
{
|
||||
name: 'cybre',
|
||||
name: 'default',
|
||||
label: 'Cybre (default)'
|
||||
},
|
||||
{
|
||||
name: 'default',
|
||||
name: 'royal',
|
||||
label: 'Royal'
|
||||
},
|
||||
{
|
||||
|
|
|
@ -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%)};
|
||||
}
|
||||
|
|
|
@ -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%)};
|
||||
}
|
|
@ -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();
|
||||
}
|
Loading…
Reference in New Issue