tyler.durden
/
dashy
mirror of https://github.com/Lissy93/dashy.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Specifies text highlight color, and adds variable

This commit is contained in:
Alicia Sykes 2021-06-15 13:08:46 +01:00
parent 7c13d1d14c
commit 9af4af75ec
4 changed files with 21 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/theming.md
View File

@ -108,6 +108,8 @@ You can target specific elements on the UI with these variables. All are optiona
- `--config-settings-background` - The text color for text within the settings container. Defaults to `--background-darker` - `--config-settings-background` - The text color for text within the settings container. Defaults to `--background-darker`
- `--scroll-bar-color` - Color of the scroll bar thumb. Defaults to `--primary` - `--scroll-bar-color` - Color of the scroll bar thumb. Defaults to `--primary`
- `--scroll-bar-background` Color of the scroll bar blank space. Defaults to `--background-darker` - `--scroll-bar-background` Color of the scroll bar blank space. Defaults to `--background-darker`
- `--highlight-background` Fill color for text highlighting. Defaults to `--primary`
- `--highlight-color` Text color for selected/ highlighted text. Defaults to `--background`
- `--toast-background` - Background color for the toast info popup. Defaults to `--primary` - `--toast-background` - Background color for the toast info popup. Defaults to `--primary`
- `--toast-color` - Text, icon and border color in the toast info popup. Defaults to `--background` - `--toast-color` - Text, icon and border color in the toast info popup. Defaults to `--background`
- `--welcome-popup-background` - Background for the info pop-up shown on first load. Defaults to `--background-darker` - `--welcome-popup-background` - Background for the info pop-up shown on first load. Defaults to `--background-darker`

6
src/styles/color-palette.scss
View File

@ -77,10 +77,14 @@
--toast-color: var(--background); --toast-color: var(--background);
--scroll-bar-color: var(--primary); --scroll-bar-color: var(--primary);
--scroll-bar-background: var(--background-darker); --scroll-bar-background: var(--background-darker);
--highlight-color: var(--background);
--highlight-background: var(--primary);
--loading-screen-color: var(--primary); --loading-screen-color: var(--primary);
--loading-screen-background: var(--background); --loading-screen-background: var(--background);
--login-form-color: var(--primary); --login-form-color: var(--primary);
--login-form-background: var(--background); --login-form-background: var(--background);
--login-form-background-secondary: var(--background-darker); --login-form-background-secondary: var(--background-darker);
--about-page-color: var(--white);
--about-page-background: #0b1021;
--about-page-accent: var(--primary);
} }

1
src/styles/global-styles.scss
View File

@ -7,6 +7,7 @@ html {
transition: all 1s; transition: all 1s;
margin-top: -3px; margin-top: -3px;
@extend .scroll-bar; @extend .scroll-bar;
@extend .highlight;
box-sizing: border-box; box-sizing: border-box;
input[type=button], button, a { input[type=button], button, a {
cursor: pointer; cursor: pointer;

13
src/styles/style-helpers.scss
View File

@ -15,6 +15,19 @@
} }
} }
/* Custom highlight color */
.highlight {
::selection {
background-color: var(--highlight-background);
color: var(--highlight-color);
}
::-moz-selection, ::-o-selection, ::-ms-selection, ::-webkit-selection {
background-color: var(--highlight-background);
color: var(--highlight-color);
}
}
/* Single-style helpers */ /* Single-style helpers */
.bold { font-weight: bold; } .bold { font-weight: bold; }
.light { font-weight: lighter; } .light { font-weight: lighter; }