solarized.scss 1.2 KB

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