_override-bootstrap-variables.scss 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. //
  2. // Variables
  3. // --------------------------------------------------
  4. //== Colors
  5. //
  6. $primary: $growi-blue !default;
  7. $secondary: #6c757d !default;
  8. $info: #009fbb !default;
  9. $success: #00bb83 !default;
  10. $warning: #ffa32b !default;
  11. $danger: #ff0a54 !default;
  12. $light: #e4e7ea !default;
  13. $dark: #343a40 !default;
  14. $gray-50: lighten($light, 7%) !default;
  15. $gray-100: lighten($light, 4%) !default;
  16. $gray-200: $light !default;
  17. $gray-300: darken($light, 5%) !default;
  18. $gray-400: darken($light, 20%) !default;
  19. $gray-500: darken($light, 30%) !default;
  20. $gray-550: lighten($dark, 15%) !default;
  21. $gray-600: lighten($dark, 10%) !default;
  22. $gray-700: lighten($dark, 5%) !default;
  23. $gray-800: $dark !default;
  24. $gray-900: darken($dark, 5%) !default;
  25. $grays: (
  26. '50': $gray-50,
  27. ) !default;
  28. $red: #ff0a54 !default;
  29. // Options
  30. //
  31. // Quickly modify global styling by enabling or disabling optional features.
  32. $enable-shadows: true;
  33. // Grid breakpoints
  34. //
  35. // Define the minimum dimensions at which your layout will change,
  36. // adapting to different screen sizes, for use in media queries.
  37. $grid-breakpoints: (
  38. xs: 0,
  39. sm: 576px,
  40. md: 768px,
  41. lg: 992px,
  42. xl: 1200px,
  43. 2xl: 1480px,
  44. );
  45. // Grid containers
  46. //
  47. // Define the maximum width of `.container` for different screen sizes.
  48. $container-max-widths: (
  49. sm: 540px,
  50. md: 720px,
  51. lg: 960px,
  52. xl: 1140px,
  53. 2xl: 1320px,
  54. );
  55. //== Typography
  56. //
  57. //## Font, line-height, and color for body text, headings, and more.
  58. $font-family-sans-serif: Lato, -apple-system, BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  59. $font-family-serif: Georgia, 'Times New Roman', Times, serif;
  60. $font-family-monospace: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
  61. $font-family-base: $font-family-sans-serif;
  62. $font-size-root: 14px;
  63. $line-height-base: 1.42857;
  64. $blockquote-small-color: $gray-500;
  65. //== Components
  66. //
  67. $border-radius: 4px;
  68. $border-radius-sm: 0;
  69. $border-radius-lg: 8px;
  70. // Buttons
  71. //
  72. // For each of Bootstrap's buttons, define text, background, and border color.
  73. $btn-link-disabled-color: $gray-500;
  74. $btn-focus-box-shadow: none;
  75. $btn-active-box-shadow: none;
  76. //== Forms
  77. //
  78. $input-border-color: $gray-300;
  79. $input-placeholder-color: $gray-500;
  80. $custom-control-indicator-border-color: $gray-400;
  81. $custom-control-label-disabled-color: $gray-500;
  82. $custom-select-disabled-color: $gray-500;
  83. $custom-range-thumb-disabled-bg: $gray-400;
  84. //== Navs
  85. $nav-link-padding-y: 0.75rem;
  86. $nav-link-padding-x: 1rem;
  87. $nav-link-disabled-color: $gray-500;
  88. //== Navbar
  89. $navbar-padding-y: 0;
  90. $navbar-brand-padding-y: 0;
  91. $navbar-nav-link-padding-x: 1rem;
  92. //== Dropdowns
  93. $dropdown-border-radius: $border-radius-lg;
  94. $dropdown-link-disabled-color: $gray-500;
  95. $dropdown-header-color: $gray-500;
  96. $dropdown-box-shadow: 0 0.5rem 0.7rem rgba(black, 0.1);
  97. //== Popovers
  98. $popover-border-radius: $border-radius;
  99. $popover-box-shadow: 0 0.5rem 0.7rem rgba(black, 0.1);
  100. //== Pagination
  101. $pagination-disabled-color: $gray-500;
  102. //== Cards
  103. $card-spacer-y: 7px;
  104. $card-spacer-x: 15px;
  105. //== Toasts
  106. $toast-header-color: $gray-500;
  107. //== Modals
  108. $modal-content-border-width: 0;
  109. $modal-content-border-radius: $border-radius-lg;
  110. $modal-header-padding-y: 0.75rem;
  111. $modal-header-padding-x: 1rem;
  112. //== Alerts
  113. $alert-bg-level: -2;
  114. $alert-border-level: 0;
  115. $alert-color-level: -10;
  116. //== Progress bar
  117. $progress-height: 4px;
  118. $progress-bg: $gray-100;
  119. $progress-box-shadow: none;
  120. //== List group
  121. $list-group-disabled-color: $gray-500;
  122. //== Figures
  123. $figure-caption-color: $gray-500;
  124. //== Breadcrumbs
  125. $breadcrumb-divider-color: $gray-500;
  126. $breadcrumb-active-color: $gray-500;
  127. //== Code
  128. $pre-color: dummyinvalildcolor; // disable pre color specification with invalid value
  129. //== Custom Checkbox
  130. $custom-checkbox-indicator-border-radius: 0px;
  131. $custom-control-indicator-focus-box-shadow: none;
  132. $custom-control-indicator-size: 1.2rem;