From a3d048e3ed9b958aff84de591a0b7c1658263894 Mon Sep 17 00:00:00 2001 From: Airradda Date: Sun, 21 Jun 2020 01:17:01 -0500 Subject: [PATCH 1/4] Added "Black" theme and modified handling of link colors --- .../theme-settings/theme-settings.js | 6 ++-- src/renderer/themes.css | 32 +++++++++++++++++++ 2 files changed, 36 insertions(+), 2 deletions(-) diff --git a/src/renderer/components/theme-settings/theme-settings.js b/src/renderer/components/theme-settings/theme-settings.js index d543aeff..7b080638 100644 --- a/src/renderer/components/theme-settings/theme-settings.js +++ b/src/renderer/components/theme-settings/theme-settings.js @@ -21,11 +21,13 @@ export default Vue.extend({ currentSecColor: '', baseThemeNames: [ 'Light', - 'Dark' + 'Dark', + 'Black' ], baseThemeValues: [ 'light', - 'dark' + 'dark', + 'black' ], colorNames: [ 'Red', diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 6e082cd3..226e468f 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -6,12 +6,15 @@ --primary-shadow-color: rgba(232, 232, 232, 1); --title-color: #3f7ac6; --bg-color: #f1f1f1; + --link-color: var(--primary-color); + --link-visited-color: var(--accent-color-light); --card-bg-color: #FFFFFF; --secondary-card-bg-color: #eeeeee; --side-nav-color: #FFFFFF; --side-nav-hover-color: #e0e0e0; --side-nav-active-color: #757575; --search-bar-color: #f5f5f5; + --instance-menu-color: var(--search-bar-color); --logo-icon: url("~../../_icons/iconColorSmall.png"); --logo-text: url("~../../_icons/textColorSmall.png"); } @@ -25,16 +28,39 @@ --primary-shadow-color: rgba(0, 0, 0, 0.75); --title-color: #EEEEEE; --bg-color: #212121; + --link-color: var(--primary-color); + --link-visited-color: var(--accent-color-light); --card-bg-color: #303030; --secondary-card-bg-color: rgba(0, 0, 0, 0.75); --side-nav-color: #262626; --side-nav-hover-color: #212121; --side-nav-active-color: #303030; --search-bar-color: #262626; + --instance-menu-color: var(--search-bar-color); --logo-icon: url("~../../_icons/iconColorSmall.png"); --logo-text: url("~../../_icons/textColorSmall.png"); } +.black { + --primary-text-color: #EEEEEE; + --secondary-text-color: #ddd; + --tertiary-text-color: #EEEEEE; + --primary-input-color: rgba(0, 0, 0, 0.50); + --primary-shadow-color: rgba(0, 0, 0, 0.75); + --title-color: #EEEEEEE; + --bg-color: #000000; + --link-color: var(--primary-color); + --link-visited-color: var(--accent-color-light); + --card-bg-color: #000000; + --secondary-card-bg-color: rgba(0, 0, 0, 0.75); + --side-nav-color: #000000; + --side-nav-hover-color: #212121; + --side-nav-active-color: #303030; + --search-bar-color: #262626; + --instance-menu-color: var(--search-bar-color); + --logo-icon: url("~../../_icons/iconColorSmall.png"); + --logo-text: url("~../../_icons/textColorSmall.png"); +} .gray { --primary-text-color: #EEEEEE; @@ -400,3 +426,9 @@ body { color: var(--primary-text-color); background-color: var(--bg-color); } +a:link { + color: var(--link-color); +} +a:visited { + color: var(--link-visited-color); +} From f8a6985b204322e1eb983e3430752ac0eac4522b Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 02:25:07 -0500 Subject: [PATCH 2/4] Added colored scrollbar --- src/renderer/themes.css | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 226e468f..3eba037b 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -432,3 +432,14 @@ a:link { a:visited { color: var(--link-visited-color); } +::-webkit-scrollbar { + width: 10px; +} +::-webkit-scrollbar-thumb { + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); + background: var(--primary-color); + border-radius: 10px; +} +::-webkit-scrollbar-thumb:hover { + background: var(--primary-color-active); +} From 38408942fe72c7d0fea9f3cbccd7879adabe1eff Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 13:24:39 -0500 Subject: [PATCH 3/4] Added new color values for visited links --- src/renderer/themes.css | 28 ++++++++++++++++++++++------ 1 file changed, 22 insertions(+), 6 deletions(-) diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 3eba037b..8f39540b 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -6,8 +6,8 @@ --primary-shadow-color: rgba(232, 232, 232, 1); --title-color: #3f7ac6; --bg-color: #f1f1f1; - --link-color: var(--primary-color); - --link-visited-color: var(--accent-color-light); + --link-color: var(--accent-color); + --link-visited-color: var(--accent-color-visited); --card-bg-color: #FFFFFF; --secondary-card-bg-color: #eeeeee; --side-nav-color: #FFFFFF; @@ -28,8 +28,8 @@ --primary-shadow-color: rgba(0, 0, 0, 0.75); --title-color: #EEEEEE; --bg-color: #212121; - --link-color: var(--primary-color); - --link-visited-color: var(--accent-color-light); + --link-color: var(--accent-color); + --link-visited-color: var(--accent-color-visited); --card-bg-color: #303030; --secondary-card-bg-color: rgba(0, 0, 0, 0.75); --side-nav-color: #262626; @@ -49,8 +49,8 @@ --primary-shadow-color: rgba(0, 0, 0, 0.75); --title-color: #EEEEEEE; --bg-color: #000000; - --link-color: var(--primary-color); - --link-visited-color: var(--accent-color-light); + --link-color: var(--accent-color); + --link-visited-color: var(--accent-color-visited); --card-bg-color: #000000; --secondary-card-bg-color: rgba(0, 0, 0, 0.75); --side-nav-color: #000000; @@ -229,6 +229,7 @@ --accent-color-hover: #e53935; --accent-color-active: #c62828; --accent-color-light: #ef9a9a; + --accent-color-visited: #b71c1c; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(244,67,54,0.04); --accent-color-opacity2: rgba(244,67,54,0.12); @@ -241,6 +242,7 @@ --accent-color-hover: #D81B60; --accent-color-active: #AD1457; --accent-color-light: #F48FB1; + --accent-color-visited: #880E4F; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(233,30,99,0.04); --accent-color-opacity2: rgba(233,30,99,0.12); @@ -253,6 +255,7 @@ --accent-color-hover: #8E24AA; --accent-color-active: #6A1B9A; --accent-color-light: #CE93D8; + --accent-color-visited: #4A148C; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(156,39,176,0.04); --accent-color-opacity2: rgba(156,39,176,0.12); @@ -265,6 +268,7 @@ --accent-color-hover: #5E35B1; --accent-color-active: #4527A0; --accent-color-light: #B39DDB; + --accent-color-visited: #311B92; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(103,58,183,0.04); --accent-color-opacity2: rgba(103,58,183,0.12); @@ -277,6 +281,7 @@ --accent-color-hover: #3949AB; --accent-color-active: #283593; --accent-color-light: #9FA8DA; + --accent-color-visited: #1A237E; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(63,81,181,0.04); --accent-color-opacity2: rgba(63,81,181,0.12); @@ -289,6 +294,7 @@ --accent-color-hover: #1E88E5; --accent-color-active: #1565C0; --accent-color-light: #90CAF9; + --accent-color-visited: #0D47A1; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(33,150,243,0.04); --accent-color-opacity2: rgba(33,150,243,0.12); @@ -301,6 +307,7 @@ --accent-color-hover: #039BE5; --accent-color-active: #0277BD; --accent-color-light: #81D4FA; + --accent-color-visited: #01579B; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(3,169,244,0.04); --accent-color-opacity2: rgba(3,169,244,0.12); @@ -313,6 +320,7 @@ --accent-color-hover: #00ACC1; --accent-color-active: #00838F; --accent-color-light: #80DEEA; + --accent-color-visited: #006064; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(0,188,212,0.04); --accent-color-opacity2: rgba(0,188,212,0.12); @@ -325,6 +333,7 @@ --accent-color-hover: #00897B; --accent-color-active: #00695C; --accent-color-light: #80CBC4; + --accent-color-visited: #004D40; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(0,150,136,0.04); --accent-color-opacity2: rgba(0,150,136,0.12); @@ -337,6 +346,7 @@ --accent-color-hover: #43A047; --accent-color-active: #2E7D32; --accent-color-light: #A5D6A7; + --accent-color-visited: #1B5E20; --text-with-accent-color: #FFFFFF; --accent-color-opacity1: rgba(76,175,80,0.04); --accent-color-opacity2: rgba(76,175,80,0.12); @@ -349,6 +359,7 @@ --accent-color-hover: #7CB342; --accent-color-active: #558B2F; --accent-color-light: #C5E1A5; + --accent-color-visited: #33691E; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(139,195,74,0.04); --accent-color-opacity2: rgba(139,195,74,0.12); @@ -361,6 +372,7 @@ --accent-color-hover: #C0CA33; --accent-color-active: #9E9D24; --accent-color-light: #E6EE9C; + --accent-color-visited: #827717; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(205,220,57,0.04); --accent-color-opacity2: rgba(205,220,57,0.12); @@ -373,6 +385,7 @@ --accent-color-hover: #FDD835; --accent-color-active: #F9A825; --accent-color-light: #FFF59D; + --accent-color-visited: #F57F17; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(255,235,59,0.04); --accent-color-opacity2: rgba(255,235,59,0.12); @@ -385,6 +398,7 @@ --accent-color-hover: #FFB300; --accent-color-active: #FF8F00; --accent-color-light: #FFE082; + --accent-color-visited: #FF6F00; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(255,193,7,0.04); --accent-color-opacity2: rgba(255,193,7,0.12); @@ -397,6 +411,7 @@ --accent-color-hover: #FB8C00; --accent-color-active: #EF6C00; --accent-color-light: #FFCC80; + --accent-color-visited: #E65100; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(255,152,0,0.04); --accent-color-opacity2: rgba(255,152,0,0.12); @@ -409,6 +424,7 @@ --accent-color-hover: #F4511E; --accent-color-active: #D84315; --accent-color-light: #FFAB91; + --accent-color-visited: #BF360C; --text-with-accent-color: #000000; --accent-color-opacity1: rgba(255,87,34,0.04); --accent-color-opacity2: rgba(255,87,34,0.12); From 6846126813f90c147a51529cf5f25c448aec2752 Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 20:31:59 -0500 Subject: [PATCH 4/4] Removed accidential scrollbar changes --- src/renderer/themes.css | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 8f39540b..df2320d9 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -448,14 +448,3 @@ a:link { a:visited { color: var(--link-visited-color); } -::-webkit-scrollbar { - width: 10px; -} -::-webkit-scrollbar-thumb { - -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); - background: var(--primary-color); - border-radius: 10px; -} -::-webkit-scrollbar-thumb:hover { - background: var(--primary-color-active); -}