tesses50
/
freetube
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added "Black" theme and modified handling of link colors

This commit is contained in:
Airradda 2020-06-21 01:17:01 -05:00
parent 8d3a31676f
commit a3d048e3ed
2 changed files with 36 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/renderer/components/theme-settings/theme-settings.js
View File

@ -21,11 +21,13 @@ export default Vue.extend({
currentSecColor: '', currentSecColor: '',
baseThemeNames: [ baseThemeNames: [
'Light', 'Light',
'Dark' 'Dark',
'Black'
], ],
baseThemeValues: [ baseThemeValues: [
'light', 'light',
'dark' 'dark',
'black'
], ],
colorNames: [ colorNames: [
'Red', 'Red',

32
src/renderer/themes.css
View File

@ -6,12 +6,15 @@
--primary-shadow-color: rgba(232, 232, 232, 1); --primary-shadow-color: rgba(232, 232, 232, 1);
--title-color: #3f7ac6; --title-color: #3f7ac6;
--bg-color: #f1f1f1; --bg-color: #f1f1f1;
--link-color: var(--primary-color);
--link-visited-color: var(--accent-color-light);
--card-bg-color: #FFFFFF; --card-bg-color: #FFFFFF;
--secondary-card-bg-color: #eeeeee; --secondary-card-bg-color: #eeeeee;
--side-nav-color: #FFFFFF; --side-nav-color: #FFFFFF;
--side-nav-hover-color: #e0e0e0; --side-nav-hover-color: #e0e0e0;
--side-nav-active-color: #757575; --side-nav-active-color: #757575;
--search-bar-color: #f5f5f5; --search-bar-color: #f5f5f5;
--instance-menu-color: var(--search-bar-color);
--logo-icon: url("~../../_icons/iconColorSmall.png"); --logo-icon: url("~../../_icons/iconColorSmall.png");
--logo-text: url("~../../_icons/textColorSmall.png"); --logo-text: url("~../../_icons/textColorSmall.png");
} }
@ -25,16 +28,39 @@
--primary-shadow-color: rgba(0, 0, 0, 0.75); --primary-shadow-color: rgba(0, 0, 0, 0.75);
--title-color: #EEEEEE; --title-color: #EEEEEE;
--bg-color: #212121; --bg-color: #212121;
--link-color: var(--primary-color);
--link-visited-color: var(--accent-color-light);
--card-bg-color: #303030; --card-bg-color: #303030;
--secondary-card-bg-color: rgba(0, 0, 0, 0.75); --secondary-card-bg-color: rgba(0, 0, 0, 0.75);
--side-nav-color: #262626; --side-nav-color: #262626;
--side-nav-hover-color: #212121; --side-nav-hover-color: #212121;
--side-nav-active-color: #303030; --side-nav-active-color: #303030;
--search-bar-color: #262626; --search-bar-color: #262626;
--instance-menu-color: var(--search-bar-color);
--logo-icon: url("~../../_icons/iconColorSmall.png"); --logo-icon: url("~../../_icons/iconColorSmall.png");
--logo-text: url("~../../_icons/textColorSmall.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 { .gray {
--primary-text-color: #EEEEEE; --primary-text-color: #EEEEEE;
@ -400,3 +426,9 @@ body {
color: var(--primary-text-color); color: var(--primary-text-color);
background-color: var(--bg-color); background-color: var(--bg-color);
} }
a:link {
color: var(--link-color);
}
a:visited {
color: var(--link-visited-color);
}