_variables.scss 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. //
  2. // Variables (based on Bootstrap Sass defaults)
  3. // --------------------------------------------------
  4. //== Colors
  5. //
  6. //## Gray and brand colors
  7. $gray-base: #000 !default;
  8. $gray-darker: lighten($gray-base, 13.5%) !default; // #222
  9. $gray-dark: lighten($gray-base, 20%) !default; // #333
  10. $gray: lighten($gray-base, 33.5%) !default; // #555
  11. $gray-light: lighten($gray-base, 46.7%) !default; // #777
  12. $gray-lighter: lighten($gray-base, 93.5%) !default; // #eee
  13. $brand-primary: darken(#428bca, 6.5%) !default; // #337ab7
  14. //== Scaffolding
  15. //
  16. //## Settings for some of the most global styles.
  17. //** Background color for `<body>`.
  18. $body-bg: #fff !default;
  19. //** Global text color on `<body>`.
  20. $text-color: $gray-base !default;
  21. //** Global textual link color.
  22. $link-color: $brand-primary !default;
  23. //** Link hover color set via `darken()` function.
  24. $link-hover-color: darken($link-color, 15%) !default;
  25. //** Link hover decoration.
  26. $link-hover-decoration: underline !default;
  27. //== Typography
  28. //
  29. //## Font, line-height, and color for body text, headings, and more.
  30. $font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
  31. $font-family-serif: Georgia, "Times New Roman", Times, serif !default;
  32. //** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
  33. $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
  34. $font-family-base: $font-family-sans-serif !default;
  35. $font-size-base: 14px !default;
  36. $font-size-large: ceil(($font-size-base * 1.25)) !default; // ~18px
  37. $font-size-small: ceil(($font-size-base * 0.85)) !default; // ~12px
  38. $font-size-h1: floor(($font-size-base * 2.6)) !default; // ~36px
  39. $font-size-h2: floor(($font-size-base * 2.15)) !default; // ~30px
  40. $font-size-h3: ceil(($font-size-base * 1.7)) !default; // ~24px
  41. $font-size-h4: ceil(($font-size-base * 1.25)) !default; // ~18px
  42. $font-size-h5: $font-size-base !default;
  43. $font-size-h6: ceil(($font-size-base * 0.85)) !default; // ~12px
  44. //** Unit-less `line-height` for use in components like buttons.
  45. $line-height-base: 1.428571429 !default; // 20/14
  46. //** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
  47. $line-height-computed: floor(($font-size-base * $line-height-base)) !default; // ~20px
  48. //** By default, this inherits from the `<body>`.
  49. $headings-font-family: inherit !default;
  50. $headings-font-weight: 500 !default;
  51. $headings-line-height: 1.1 !default;
  52. $headings-color: inherit !default;
  53. //== Components
  54. //
  55. //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
  56. $padding-base-vertical: 6px !default;
  57. $padding-base-horizontal: 12px !default;
  58. $padding-large-vertical: 10px !default;
  59. $padding-large-horizontal: 16px !default;
  60. $padding-small-vertical: 5px !default;
  61. $padding-small-horizontal: 10px !default;
  62. $padding-xs-vertical: 1px !default;
  63. $padding-xs-horizontal: 5px !default;
  64. $line-height-large: 1.3333333 !default; // extra decimals for Win 8.1 Chrome
  65. $line-height-small: 1.5 !default;
  66. $border-radius-base: 4px !default;
  67. $border-radius-large: 6px !default;
  68. $border-radius-small: 3px !default;
  69. //== Code
  70. //
  71. //##
  72. $code-color: $gray-light !default;
  73. $code-bg: transparent !default;
  74. $kbd-color: #fff !default;
  75. $kbd-bg: #333 !default;
  76. $pre-bg: #f5f5f5 !default;
  77. $pre-color: $gray-dark !default;
  78. $pre-border-color: #ccc !default;
  79. //== Type
  80. //
  81. //##
  82. //** Text muted color
  83. $text-muted: $gray-light !default;