default.scss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. @import '../variables';
  2. @import '../override-bootstrap-variables';
  3. // == Define Bootstrap theme colors
  4. //
  5. // colors for overriding bootstrap $theme-colors
  6. // $secondary: #;
  7. // $info: #;
  8. // $success: #;
  9. // $warning: #;
  10. // $danger: #;
  11. // $light: #;
  12. // $dark: #;
  13. //== Light Mode
  14. //
  15. html:not([dark]) {
  16. $primary: #112744;
  17. // Background colors
  18. $bgcolor-global: white;
  19. $bgcolor-navbar: #334455;
  20. $bgcolor-inline-code: #f9f2f4;
  21. $bgcolor-card: #f5f5f5;
  22. // Font colors
  23. $color-global: #333333;
  24. $color-reversal: #eeeeee;
  25. // $color-header: #2b2b2b;
  26. $color-link: lighten($primary, 20%);
  27. $color-link-hover: lighten($color-link, 20%);
  28. $color-link-wiki: lighten($primary, 20%);
  29. $color-link-wiki-hover: lighten($color-link-wiki, 20%);
  30. $color-inline-code: #c7254e;
  31. // Logo colors
  32. $fillcolor-logo-mark: lighten(desaturate($bgcolor-navbar, 10%), 15%);
  33. // Border colors
  34. $border-color-theme: #ccc; // former: `$navbar-border: #ccc;`
  35. @import 'apply-colors';
  36. @import 'apply-colors-light';
  37. }
  38. //== Dark Mode
  39. //
  40. html[dark] {
  41. $primary: #d65a31;
  42. $basecolor: #222831;
  43. // Background colors
  44. $bgcolor-global: $basecolor;
  45. $bgcolor-navbar: #151515;
  46. $bgcolor-inline-code: darken($basecolor, 5%);
  47. $bgcolor-card: darken($basecolor, 5%);
  48. // Font colors
  49. $color-global: #eeeeee;
  50. $color-reversal: #333333;
  51. // $color-header: desaturate($primary, 20%);
  52. $color-link: $primary;
  53. $color-link-hover: lighten($color-link, 10%);
  54. $color-link-wiki: lighten($basecolor, 50%);
  55. $color-link-wiki-hover: darken($color-link-wiki, 5%);
  56. $color-inline-code: #c7254e;
  57. // Logo colors
  58. $fillcolor-logo-mark: #444;
  59. // Border colors
  60. $border-color-theme: black; // former: `$navbar-border: #ccc;`
  61. @import 'apply-colors';
  62. @import 'apply-colors-dark';
  63. }