variables.less 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. // SITE VARIABLES
  2. // --------------
  3. // Blues
  4. @blue-darker: #003366;
  5. @blue-dark: #005f9b; // Pantone 3015 C
  6. @blue: #009add; // Pantone 2925 C
  7. @blue-light: #b8dcf2;
  8. @blue-lighter: #f0f9ff;
  9. // Greens
  10. @green-darker: #41683b;
  11. @green-dark: #678943;
  12. @green: #95bf52;
  13. @green-light: #ddefbd;
  14. @green-lighter: #f3f9e8;
  15. // Reds
  16. @red-darker: #702222;
  17. @red-dark: #ba4a4a;
  18. @red: #dd7373;
  19. @red-light: #f2adb1;
  20. @red-lighter: #fff0f0;
  21. // Yellows
  22. @yellow-darker: #6f4215;
  23. @yellow-dark: #db8400;
  24. @yellow: #f9e27d;
  25. @yellow-light: #fff5bd;
  26. @yellow-lighter: #fffcee;
  27. // Oranges
  28. @orange-darker: #8c3900;
  29. @orange-dark: #cc5d11;
  30. @orange: #f4914e;
  31. @orange-light: #ffd0a6;
  32. @orange-lighter: #fff4e6;
  33. // Purples
  34. @purple-darker: #4a226d;
  35. @purple-dark: #7457ad;
  36. @purple: #9780d6;
  37. @purple-light: #c3b8f4;
  38. @purple-lighter: #fbf5ff;
  39. @fa-green: #1616e5;
  40. @fa-green-dark: darken(@fa-green, 10%);
  41. @jumbotron-border: mix(@fa-green, @fa-green-dark, 75%);
  42. // BOOTSTRAP OVERRIDES
  43. // -------------------
  44. // Brand colors
  45. @brand-success: @fa-green;
  46. // Links
  47. @link-color: lighten(@fa-green, 5%);
  48. @link-hover-color: darken(@fa-green, 5%);
  49. // Typography
  50. @font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  51. @font-family-serif: museo-slab, Georgia, "Times New Roman", Times, serif;
  52. @headings-font-family: @font-family-serif;
  53. // Components
  54. @component-active-bg: @fa-green;
  55. // Labels
  56. @label-brand-bg: @fa-green;
  57. @label-dark-bg: @gray-dark;
  58. // Navbar
  59. @navbar-height: 40px;
  60. @navbar-inverse-brand-color: #fff;
  61. // Reset inverted navbar basics
  62. @navbar-inverse-color: mix(@fa-green, #fff, 50%);
  63. @navbar-inverse-bg: @fa-green;
  64. @navbar-inverse-border: @jumbotron-border;
  65. // Inverted navbar links
  66. @navbar-inverse-link-color: mix(@fa-green, #fff, 35%);
  67. @navbar-inverse-link-hover-color: #fff;
  68. @navbar-inverse-link-active-bg: @navbar-inverse-border;
  69. // Inverted navbar toggle
  70. @navbar-inverse-toggle-hover-bg: @jumbotron-color;
  71. @navbar-inverse-toggle-border-color: mix(@jumbotron-color, @fa-green, 75%);
  72. // Jumbotron
  73. @jumbotron-color: #fff;
  74. @jumbotron-bg: @fa-green;
  75. // Form states and alerts
  76. @state-success-text: @fa-green;
  77. @state-success-bg: mix(@fa-green, #fff, 6%);
  78. @state-success-border: darken(spin(@state-success-bg, -10), 5%);
  79. @state-info-text: mix(@blue-dark, @blue, 50%);
  80. @state-info-bg: @blue-lighter;
  81. @state-info-border: darken(spin(@state-info-bg, -10), 7%);
  82. @state-danger-text: @brand-danger;
  83. @state-danger-bg: mix(@state-danger-text,#fff,10%);
  84. @state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
  85. // Carousel
  86. @carousel-text-shadow: 0 1px 0 rgba(255,255,255,0.25);
  87. @carousel-control-color: @fa-green-dark;
  88. @carousel-control-font-size: 30px;
  89. // Code
  90. @pre-border-color: #eee;
  91. // Sections
  92. @section-emphasized-bg: #fff;
  93. //== Type
  94. //** Text muted color
  95. @text-muted: mix(@gray-light,@gray-lighter,50%);
  96. @alert-well-bg: @panel-default-heading-bg;
  97. @alert-well-text: @text-color;
  98. @alert-well-border: @panel-default-border;
  99. @alert-default-bg: transparent;
  100. @alert-default-text: @text-color;
  101. @alert-default-border: mix(#fff,@panel-default-border,40%);
  102. //@panel-default-text: @gray-dark;
  103. //@panel-default-border: @panel-default-heading-bg;
  104. //@panel-default-heading-bg: #f5f5f5;
  105. @panel-primary-text: #fff;
  106. @panel-primary-border: mix(#fff,@brand-primary,50%);
  107. @panel-primary-heading-bg: @brand-primary;
  108. @panel-success-text: #fff;
  109. @panel-success-border: mix(#fff,@brand-success,50%);
  110. @panel-success-heading-bg: @brand-success;
  111. @panel-info-text: #fff;
  112. @panel-info-border: mix(#fff,@brand-info,50%);
  113. @panel-info-heading-bg: @brand-info;
  114. @panel-warning-text: #fff;
  115. @panel-warning-border: mix(#fff,@brand-warning,50%);
  116. @panel-warning-heading-bg: @brand-warning;
  117. @panel-danger-text: #fff;
  118. @panel-danger-border: mix(#fff,@brand-danger,50%);
  119. @panel-danger-heading-bg: @brand-danger;