Updated Styling with Custom CSS (markdown)

Ben Busby 2021-04-05 10:30:07 -04:00
parent 60fb170774
commit c781e81aeb

@ -5,33 +5,37 @@ Each Whoogle instance starts with the following variables applied for all pages:
```css
:root {
/* LIGHT THEME COLORS */
--whoogle-background: #fff;
--whoogle-accent: #685e79;
--whoogle-text: #000;
--whoogle-contrast-text: #fff;
--whoogle-logo: #685e79;
--whoogle-page-bg: #ffffff;
--whoogle-element-bg: #685e79;
--whoogle-text: #000000;
--whoogle-contrast-text: #ffffff;
--whoogle-secondary-text: #70757a;
--whoogle-result-bg: #fff;
--whoogle-result-bg: #ffffff;
--whoogle-result-title: #1967d2;
--whoogle-result-url: #0d652d;
--whoogle-result-visited: #4b11a8;
/* DARK THEME COLORS */
--whoogle-dark-background: #222;
--whoogle-dark-accent: #685e79;
--whoogle-dark-text: #fff;
--whoogle-dark-contrast-text: #000;
--whoogle-dark-secondary-text: #bbb;
--whoogle-dark-result-bg: #000;
--whoogle-dark-logo: #685e79;
--whoogle-dark-page-bg: #222222;
--whoogle-dark-element-bg: #685e79;
--whoogle-dark-text: #ffffff;
--whoogle-dark-contrast-text: #000000;
--whoogle-dark-secondary-text: #bbbbbb;
--whoogle-dark-result-bg: #000000;
--whoogle-dark-result-title: #1967d2;
--whoogle-dark-result-url: #4b11a8;
--whoogle-dark-result-visited: #bbbbff;
}
```
- `whoogle-background`
- The background color
- `whoogle-accent`
- The color of the logo, config menu, and occasional text
- `whoogle-page-bg`
- The page background color
- `whoogle-logo`
- The color of the logo
- `whoogle-element-bg`
- The background color of the config menu, search bar button, etc
- `whoogle-text`
- The foreground/text color
- `whoogle-contrast-text`