From c051eb3debd542e052ddbf9aa0f2dc0c2880f000 Mon Sep 17 00:00:00 2001 From: copyleftie Date: Mon, 27 May 2019 18:08:29 -0400 Subject: [PATCH] feat: plus Sam theme with sepia'd images --- src/routes/_static/themes.js | 6 ++++ src/scss/themes/sam-sepia.scss | 62 ++++++++++++++++++++++++++++++++++ 2 files changed, 68 insertions(+) create mode 100644 src/scss/themes/sam-sepia.scss diff --git a/src/routes/_static/themes.js b/src/routes/_static/themes.js index a101329..2d27731 100644 --- a/src/routes/_static/themes.js +++ b/src/routes/_static/themes.js @@ -47,6 +47,12 @@ const themes = [ dark: false, color: '#ffffea' }, + { + name: 'sam-sepia', + label: 'Sam (sepia)', + dark: false, + color: '#ffffea', + }, { name: 'ozark', label: 'Ozark', diff --git a/src/scss/themes/sam-sepia.scss b/src/scss/themes/sam-sepia.scss new file mode 100644 index 0000000..dfded59 --- /dev/null +++ b/src/scss/themes/sam-sepia.scss @@ -0,0 +1,62 @@ +$main-theme-color: #99994C; +$body-bg-color: #FFFFFF; +$main-bg-color: #FFFFEA; +$main-text-color: #000000; +$border-color: #99994C; +$secondary-text-color: #444444; +$anchor-color: #444400; +$toast-border: #99994C; +$toast-bg: #444400; +$focus-outline: #99994C; +$compose-background: lighten($main-theme-color, 32%); +@import "_base.scss"; + +$scrollbar-face: #FFFFEA; +$scrollbar-face-hover: #FFFFEA; +$scrollbar-face-active: #FFFFEA; +$scrollbar-track: #99994C; +@import "_scrollbars.scss"; + +:root { + --deemphasized-text-color: #666666; + + /* idea is navbar as Sam's command window */ + --nav-bg: #EAFFFF; + --nav-border: #88CCCC; + --nav-active-bg: #9EEEEE; + --nav-a-selected-bg: #9EEEEE; + --nav-a-selected-active-bg: #9EEEEE; + --nav-text-color: #000000; + --nav-text-color-hover: #000000; + --nav-a-bg-hover: #9EEEEE; + --nav-a-selected-border: #88CCCC; + --nav-a-border-hover: #88CCCC; + + --button-bg: #FFFFD1; + --button-bg-active: #FFFFE9; + --button-bg-hover: #FFFFE9; + --button-primary-bg: #FFFFD1; + --button-primary-bg-active: #FFFFE9; + --button-primary-bg-hover: #FFFFE9; + + --settings-list-item-text: #{$anchor-color}; +} + +a, a.main-nav-link.svelte-my25xk, .settings-list-item { + text-decoration: underline; +} +a.mention.u-url, a:hover, a:active, ::selection { + background: #EEEE9E; +} +a.mention.u-url:hover, a.mention.u-url:active { + background: #444400; + color: #EEEE9E; +} +a.status-author-name, a.status-header-author { + text-decoration: none; + border-bottom: solid 1px #444400; +} + +img { + filter: sepia(100%); +}