future.scss 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. @import '../variables';
  2. @import '../override-bootstrap-variables';
  3. $primary: rgba(11, 79, 104, 0.616);
  4. $themecolor: #16282d;
  5. $accentcolor: #66eddf;
  6. html[light],
  7. html[dark] {
  8. // Background colors
  9. $bgcolor-global: $themecolor;
  10. $bgcolor-inline-code: #1f1f22; //optional
  11. $bgcolor-card: darken($themecolor, 5%);
  12. // Font colors
  13. $color-global: #95ABBA;
  14. $color-reversal: #00fff5;
  15. $color-header: #00fff5;
  16. $color-link: #00fff5;
  17. $color-link-hover: lighten($color-link, 20%);
  18. $color-link-wiki: darken($themecolor, 5%);
  19. $color-link-wiki-hover: darken($color-link-wiki, 5%);
  20. $color-link-nabvar: $color-reversal;
  21. $color-inline-code: #c7254e; // optional
  22. $color-search: #050a0b;
  23. // List Group colors
  24. $color-list: $color-global;
  25. $bgcolor-list: transparent;
  26. $color-list-active: $color-reversal;
  27. $bgcolor-list-active: $primary;
  28. $color-list-hover: $color-reversal;
  29. // Navbar
  30. $bgcolor-navbar: #01181a;
  31. $border-color-navbar-gradient-left: #545fff;
  32. $border-color-navbar-gradient-right: #00a6e5;
  33. $border-image-navbar: linear-gradient(90deg, #6cfff9 0%, #0034c1 45%, #6cfff9 100%);
  34. // Logo colors
  35. $bgcolor-logo: darken($themecolor, 10%);
  36. $fillcolor-logo-mark: #dedede;
  37. // Sidebar
  38. $bgcolor-sidebar: #052e2f;
  39. $color-sidebar-context: $color-reversal;
  40. $bgcolor-sidebar-context: $bgcolor-navbar;
  41. // Icon colors
  42. $color-editor-icons: $color-global;
  43. // Border colors
  44. $border-color-theme: #407483;
  45. $bordercolor-inline-code: #4d4d4d; // optional
  46. // Dropdown colors
  47. $bgcolor-dropdown-link-active: $primary;
  48. $color-dropdown-link-active: $color-reversal;
  49. $color-dropdown-link-hover: $color-global;
  50. // admin theme box
  51. $color-theme-color-box: lighten($primary, 20%);
  52. // alert
  53. $color-alert: $color-reversal;
  54. // badge
  55. $color-badge: $color-reversal;
  56. @import 'apply-colors';
  57. @import 'apply-colors-dark';
  58. // headers
  59. @for $i from 1 through 6 {
  60. h#{$i} {
  61. color: $color-header;
  62. }
  63. }
  64. // Navs {
  65. .nav-tabs {
  66. border-bottom: $border-color-theme 1px solid;
  67. .nav-link {
  68. &:hover {
  69. border-color: darken($border-color-theme, 10%);
  70. border-bottom: none;
  71. }
  72. &.active {
  73. color: $color-link;
  74. background-color: transparent;
  75. border-color: $border-color-theme;
  76. }
  77. }
  78. }
  79. // Search Top
  80. .search-top {
  81. .input-group-prepend .dropdown-toggle {
  82. color: #0e2329;
  83. background-color: $color-search;
  84. border-color: $color-search;
  85. &:hover {
  86. background-color: #050a0b;
  87. color: $color-search;
  88. }
  89. }
  90. input {
  91. background-color: #eceded;
  92. }
  93. i {
  94. color: #949494;
  95. }
  96. }
  97. .wiki {
  98. pre {}
  99. li {
  100. a {
  101. color: #00fff5;
  102. border-bottom: solid 1px #00fff5;
  103. }
  104. }
  105. }
  106. .grw-page-path-nav i {
  107. color: #00fff5;
  108. }
  109. }