| 1 | /** |
| 2 | * Solarized Light theme for reveal.js. |
| 3 | * Author: Achim Staebler |
| 4 | */ |
| 5 | |
| 6 | // Load utils |
| 7 | @use 'sass:color'; |
| 8 | @use 'template/mixins' as mixins; |
| 9 | |
| 10 | // Solarized colors by Ethan Schoonover |
| 11 | $base03: #002b36; |
| 12 | $base02: #073642; |
| 13 | $base01: #586e75; |
| 14 | $base00: #657b83; |
| 15 | $base0: #839496; |
| 16 | $base1: #93a1a1; |
| 17 | $base2: #eee8d5; |
| 18 | $base3: #fdf6e3; |
| 19 | $yellow: #b58900; |
| 20 | $orange: #cb4b16; |
| 21 | $red: #dc322f; |
| 22 | $magenta: #d33682; |
| 23 | $violet: #6c71c4; |
| 24 | $blue: #268bd2; |
| 25 | $cyan: #2aa198; |
| 26 | $green: #859900; |
| 27 | |
| 28 | $active-color: $blue; |
| 29 | |
| 30 | // Inject theme variables (with some overrides) |
| 31 | @use 'template/settings' with ( |
| 32 | $background-color: $base3, |
| 33 | |
| 34 | $main-color: $base00, |
| 35 | $heading-color: $base01, |
| 36 | |
| 37 | $link-color: $active-color, |
| 38 | $link-color-hover: color.scale($active-color, $lightness: 20%), |
| 39 | $selection-color: #fff, |
| 40 | $selection-background-color: $magenta, |
| 41 | |
| 42 | $overlay-element-bg-color: '0 0 0', |
| 43 | $overlay-element-fg-color: '240 240 240' |
| 44 | ); |
| 45 | |
| 46 | // Inject the theme template |
| 47 | @use 'template/theme'; |
| 48 | |
| 49 | // Include theme-specific fonts |
| 50 | @import url('./fonts/league-gothic/league-gothic.css'); |
| 51 | @import url('https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic'); |
| 52 | |
| 53 | // Change text when the background is inverted |
| 54 | @include mixins.dark-bg-text-color(#fff); |
| 55 |