_override-bootstrap.scss 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  1. // increase specificity with ':root' for GROWI theming
  2. :root {
  3. font-size: $font-size-root;
  4. > body {
  5. font-family: $font-family-sans-serif;
  6. }
  7. * {
  8. outline: none !important;
  9. }
  10. h1 {
  11. font-size: 36px;
  12. line-height: 48px;
  13. }
  14. h2 {
  15. font-size: 24px;
  16. line-height: 36px;
  17. }
  18. h3 {
  19. font-size: 21px;
  20. line-height: 30px;
  21. }
  22. h4 {
  23. font-size: 18px;
  24. line-height: 22px;
  25. }
  26. h5 {
  27. font-size: 16px;
  28. line-height: 18px;
  29. }
  30. h6 {
  31. font-size: 12px;
  32. line-height: 14px;
  33. }
  34. .small {
  35. font-size: 65%;
  36. line-height: 10px;
  37. }
  38. code {
  39. padding: 2px 4px;
  40. font-size: 90%;
  41. }
  42. // Navs
  43. .nav-tabs {
  44. .nav-item {
  45. margin-right: 0.15rem;
  46. a.active {
  47. cursor: default;
  48. }
  49. }
  50. }
  51. // Custom Control
  52. .custom-control {
  53. .custom-control-input,
  54. .custom-control-input + .custom-control-label {
  55. cursor: pointer;
  56. }
  57. }
  58. // card (substitute panel of bootstrap3)
  59. .card {
  60. margin-bottom: 20px;
  61. border-radius: $card-border-radius;
  62. }
  63. .card-header {
  64. font-weight: 700;
  65. text-transform: none;
  66. border-radius: $card-border-radius;
  67. }
  68. .card-header:first-child {
  69. border-radius: $card-border-radius;
  70. }
  71. // Well (substitute Well of bootstrap3)
  72. .card.well {
  73. min-height: 20px;
  74. padding: $card-spacer-y $card-spacer-x;
  75. border-radius: 3px;
  76. }
  77. // Dropdowns
  78. .dropdown {
  79. .dropdown-toggle.btn.disabled {
  80. cursor: not-allowed;
  81. }
  82. // hide caret
  83. .dropdown-toggle.dropdown-toggle-no-caret::after {
  84. content: none;
  85. }
  86. }
  87. // agile-admin style
  88. .dropdown-menu {
  89. padding-bottom: 8px;
  90. margin-top: 0px;
  91. border: 1px solid $border;
  92. border-radius: $radius;
  93. box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05) !important;
  94. }
  95. .dropdown-menu > li > a {
  96. width: 100%;
  97. padding: 9px 20px;
  98. }
  99. .dropdown-menu > li > a:focus,
  100. .dropdown-menu > li > a:hover {
  101. background: $extralight;
  102. }
  103. // btn-light (substitute for btn-default of bootstrap3) (agile-admin style)
  104. .btn-light,
  105. .btn-light.disabled {
  106. color: $bodytext;
  107. $this-color: $btn-default-bgcolor;
  108. background: $this-color;
  109. border: 1px solid $this-color;
  110. &:hover,
  111. &:focus,
  112. &.focus {
  113. color: $bodytext;
  114. background: $this-color;
  115. border: 1px solid $this-color;
  116. opacity: 0.8;
  117. }
  118. &:active &.active {
  119. box-shadow: none;
  120. }
  121. }
  122. .btn-light.btn-outline {
  123. background-color: transparent;
  124. &:hover,
  125. &:focus,
  126. &.focus {
  127. background: $btn-default-bgcolor;
  128. }
  129. }
  130. //Modals
  131. .modal-content {
  132. box-shadow: 0 0.3rem 1rem rgba(0, 0, 0, 0.1);
  133. }
  134. .modal-header {
  135. border-bottom: 1px solid #e5e5e5;
  136. }
  137. .modal-footer {
  138. border-top: 1px solid #e5e5e5;
  139. }
  140. // col-form-label (substitute for control-label of bootstrap3)
  141. .col-form-label {
  142. text-align: right;
  143. }
  144. // label
  145. label {
  146. font-weight: 700;
  147. }
  148. // disabled button (reproduction from bootstrap3.)
  149. // see https://cccabinet.jpn.org/bootstrap4/components/buttons#disabled-state
  150. .btn.disabled,
  151. .btn[disabled],
  152. fieldset[disabled] .btn {
  153. cursor: not-allowed;
  154. }
  155. // progress bar
  156. .progress {
  157. margin-bottom: 18px;
  158. overflow: hidden;
  159. }
  160. // badge
  161. .badge {
  162. letter-spacing: 0.05em;
  163. &.badge-warning {
  164. // badge-warning text is white color in bootstrap3
  165. color: white;
  166. }
  167. }
  168. }