_variables.scss 51.9 KB
Newer Older
1001
$tooltip-arrow-color:               $tooltip-bg !default;
Mark Otto's avatar
Mark Otto committed
1002

1003
1004
1005
1006
// Form tooltips must come after regular tooltips
$form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;
$form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;
$form-feedback-tooltip-font-size:     $tooltip-font-size !default;
1007
$form-feedback-tooltip-line-height:   null !default;
1008
1009
1010
$form-feedback-tooltip-opacity:       $tooltip-opacity !default;
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;

Mark Otto's avatar
Mark Otto committed
1011

Mark Otto's avatar
Mark Otto committed
1012
// Popovers
Mark Otto's avatar
Mark Otto committed
1013

1014
$popover-font-size:                 $font-size-sm !default;
XhmikosR's avatar
XhmikosR committed
1015
1016
1017
$popover-bg:                        $white !default;
$popover-max-width:                 276px !default;
$popover-border-width:              $border-width !default;
1018
$popover-border-color:              rgba($black, .2) !default;
1019
$popover-border-radius:             $border-radius-lg !default;
ysds's avatar
ysds committed
1020
$popover-inner-border-radius:       subtract($popover-border-radius, $popover-border-width) !default;
1021
$popover-box-shadow:                $box-shadow !default;
Mark Otto's avatar
Mark Otto committed
1022

XhmikosR's avatar
XhmikosR committed
1023
1024
$popover-header-bg:                 darken($popover-bg, 3%) !default;
$popover-header-color:              $headings-color !default;
1025
$popover-header-padding-y:          .5rem !default;
1026
$popover-header-padding-x:          $spacer !default;
Mark Otto's avatar
Mark Otto committed
1027

XhmikosR's avatar
XhmikosR committed
1028
$popover-body-color:                $body-color !default;
1029
1030
$popover-body-padding-y:            $spacer !default;
$popover-body-padding-x:            $spacer !default;
Mark Otto's avatar
Mark Otto committed
1031

1032
1033
$popover-arrow-width:               1rem !default;
$popover-arrow-height:              .5rem !default;
XhmikosR's avatar
XhmikosR committed
1034
$popover-arrow-color:               $popover-bg !default;
Mark Otto's avatar
Mark Otto committed
1035

XhmikosR's avatar
XhmikosR committed
1036
$popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;
Mark Otto's avatar
Mark Otto committed
1037
1038


Mark Otto's avatar
Mark Otto committed
1039
// Toasts
1040
1041
1042
1043
1044

$toast-max-width:                   350px !default;
$toast-padding-x:                   .75rem !default;
$toast-padding-y:                   .25rem !default;
$toast-font-size:                   .875rem !default;
1045
$toast-color:                       null !default;
1046
1047
1048
$toast-background-color:            rgba($white, .85) !default;
$toast-border-width:                1px !default;
$toast-border-color:                rgba(0, 0, 0, .1) !default;
1049
$toast-border-radius:               $border-radius !default;
1050
$toast-box-shadow:                  $box-shadow !default;
1051
1052
1053
1054

$toast-header-color:                $gray-600 !default;
$toast-header-background-color:     rgba($white, .85) !default;
$toast-header-border-color:         rgba(0, 0, 0, .05) !default;
Mark Otto's avatar
Mark Otto committed
1055
1056


Mark Otto's avatar
Mark Otto committed
1057
// Badges
Mark Otto's avatar
Mark Otto committed
1058

1059
$badge-font-size:                   .75em !default;
XhmikosR's avatar
XhmikosR committed
1060
$badge-font-weight:                 $font-weight-bold !default;
Mark Otto's avatar
Mark Otto committed
1061
$badge-color:                       $white !default;
XhmikosR's avatar
XhmikosR committed
1062
$badge-padding-y:                   .25em !default;
Mark Otto's avatar
Mark Otto committed
1063
$badge-padding-x:                   .5em !default;
XhmikosR's avatar
XhmikosR committed
1064
$badge-border-radius:               $border-radius !default;
1065

1066

Mark Otto's avatar
Mark Otto committed
1067
// Modals
Mark Otto's avatar
Mark Otto committed
1068

1069
// Padding applied to the modal body
1070
$modal-inner-padding:               $spacer !default;
Mark Otto's avatar
Mark Otto committed
1071

1072
1073
1074
// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
$modal-footer-margin-between:       .5rem !default;

1075
1076
$modal-dialog-margin:               .5rem !default;
$modal-dialog-margin-y-sm-up:       1.75rem !default;
1077

XhmikosR's avatar
XhmikosR committed
1078
$modal-title-line-height:           $line-height-base !default;
Mark Otto's avatar
Mark Otto committed
1079

1080
$modal-content-color:               null !default;
1081
1082
1083
1084
$modal-content-bg:                  $white !default;
$modal-content-border-color:        rgba($black, .2) !default;
$modal-content-border-width:        $border-width !default;
$modal-content-border-radius:       $border-radius-lg !default;
ysds's avatar
ysds committed
1085
$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;
1086
1087
$modal-content-box-shadow-xs:       $box-shadow-sm !default;
$modal-content-box-shadow-sm-up:    $box-shadow !default;
1088
1089
1090

$modal-backdrop-bg:                 $black !default;
$modal-backdrop-opacity:            .5 !default;
1091
$modal-header-border-color:         $border-color !default;
1092
1093
1094
$modal-footer-border-color:         $modal-header-border-color !default;
$modal-header-border-width:         $modal-content-border-width !default;
$modal-footer-border-width:         $modal-header-border-width !default;
1095
1096
$modal-header-padding-y:            $modal-inner-padding !default;
$modal-header-padding-x:            $modal-inner-padding !default;
1097
$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
Mark Otto's avatar
Mark Otto committed
1098

XhmikosR's avatar
XhmikosR committed
1099
$modal-sm:                          300px !default;
1100
1101
1102
$modal-md:                          500px !default;
$modal-lg:                          800px !default;
$modal-xl:                          1140px !default;
Mark Otto's avatar
Mark Otto committed
1103

1104
1105
$modal-fade-transform:              translate(0, -50px) !default;
$modal-show-transform:              none !default;
XhmikosR's avatar
XhmikosR committed
1106
$modal-transition:                  transform .3s ease-out !default;
1107
$modal-scale-transform:             scale(1.02) !default;
1108

Mark Otto's avatar
Mark Otto committed
1109

Mark Otto's avatar
Mark Otto committed
1110
// Alerts
Mark Otto's avatar
Mark Otto committed
1111
//
1112
// Define alert colors, border radius, and padding.
Mark Otto's avatar
Mark Otto committed
1113

1114
1115
$alert-padding-y:                   $spacer !default;
$alert-padding-x:                   $spacer !default;
XhmikosR's avatar
XhmikosR committed
1116
1117
1118
1119
$alert-margin-bottom:               1rem !default;
$alert-border-radius:               $border-radius !default;
$alert-link-font-weight:            $font-weight-bold !default;
$alert-border-width:                $border-width !default;
Mark Otto's avatar
Mark Otto committed
1120

1121
1122
$alert-bg-level:                    -10 !default;
$alert-border-level:                -9 !default;
Mark Otto's avatar
linting    
Mark Otto committed
1123
$alert-color-level:                 6 !default;
1124

Mark Otto's avatar
Mark Otto committed
1125

Mark Otto's avatar
Mark Otto committed
1126
// Progress bars
Mark Otto's avatar
Mark Otto committed
1127

1128
$progress-height:                   1rem !default;
1129
$progress-font-size:                $font-size-base * .75 !default;
1130
1131
$progress-bg:                       $gray-200 !default;
$progress-border-radius:            $border-radius !default;
1132
$progress-box-shadow:               $box-shadow-inset !default;
1133
$progress-bar-color:                $white !default;
1134
$progress-bar-bg:                   $primary !default;
1135
1136
$progress-bar-animation-timing:     1s linear infinite !default;
$progress-bar-transition:           width .6s ease !default;
Mark Otto's avatar
Mark Otto committed
1137

1138

Mark Otto's avatar
Mark Otto committed
1139
// List group
Mark Otto's avatar
Mark Otto committed
1140

1141
$list-group-color:                  null !default;
XhmikosR's avatar
XhmikosR committed
1142
$list-group-bg:                     $white !default;
1143
$list-group-border-color:           rgba($black, .125) !default;
XhmikosR's avatar
XhmikosR committed
1144
1145
$list-group-border-width:           $border-width !default;
$list-group-border-radius:          $border-radius !default;
Mark Otto's avatar
Mark Otto committed
1146

1147
1148
$list-group-item-padding-y:         $spacer / 2 !default;
$list-group-item-padding-x:         $spacer !default;
1149
1150
$list-group-item-bg-level:          -9 !default;
$list-group-item-color-level:       6 !default;
1151

XhmikosR's avatar
XhmikosR committed
1152
1153
1154
1155
$list-group-hover-bg:               $gray-100 !default;
$list-group-active-color:           $component-active-color !default;
$list-group-active-bg:              $component-active-bg !default;
$list-group-active-border-color:    $list-group-active-bg !default;
Mark Otto's avatar
Mark Otto committed
1156

XhmikosR's avatar
XhmikosR committed
1157
1158
$list-group-disabled-color:         $gray-600 !default;
$list-group-disabled-bg:            $list-group-bg !default;
Mark Otto's avatar
Mark Otto committed
1159

XhmikosR's avatar
XhmikosR committed
1160
1161
$list-group-action-color:           $gray-700 !default;
$list-group-action-hover-color:     $list-group-action-color !default;
Mark Otto's avatar
Mark Otto committed
1162

XhmikosR's avatar
XhmikosR committed
1163
1164
$list-group-action-active-color:    $body-color !default;
$list-group-action-active-bg:       $gray-200 !default;
1165

Mark Otto's avatar
Mark Otto committed
1166

Mark Otto's avatar
Mark Otto committed
1167
// Image thumbnails
Mark Otto's avatar
Mark Otto committed
1168

XhmikosR's avatar
XhmikosR committed
1169
1170
1171
$thumbnail-padding:                 .25rem !default;
$thumbnail-bg:                      $body-bg !default;
$thumbnail-border-width:            $border-width !default;
1172
$thumbnail-border-color:            $gray-300 !default;
XhmikosR's avatar
XhmikosR committed
1173
$thumbnail-border-radius:           $border-radius !default;
1174
$thumbnail-box-shadow:              $box-shadow-sm !default;
Mark Otto's avatar
Mark Otto committed
1175
1176


Mark Otto's avatar
Mark Otto committed
1177
// Figures
1178

1179
$figure-caption-font-size:          $small-font-size !default;
XhmikosR's avatar
XhmikosR committed
1180
$figure-caption-color:              $gray-600 !default;
1181
1182


Mark Otto's avatar
Mark Otto committed
1183
// Breadcrumbs
Mark Otto's avatar
Mark Otto committed
1184

1185
$breadcrumb-font-size:              null !default;
1186
1187
$breadcrumb-padding-y:              $spacer / 2 !default;
$breadcrumb-padding-x:              $spacer !default;
1188
$breadcrumb-item-padding-x:         .5rem !default;
XhmikosR's avatar
XhmikosR committed
1189
1190
1191
1192
$breadcrumb-margin-bottom:          1rem !default;
$breadcrumb-bg:                     $gray-200 !default;
$breadcrumb-divider-color:          $gray-600 !default;
$breadcrumb-active-color:           $gray-600 !default;
1193
$breadcrumb-divider:                quote("/") !default;
1194
1195
$breadcrumb-border-radius:          $border-radius !default;

Mark Otto's avatar
Mark Otto committed
1196
// Carousel
Mark Otto's avatar
Mark Otto committed
1197

1198
1199
1200
$carousel-control-color:             $white !default;
$carousel-control-width:             15% !default;
$carousel-control-opacity:           .5 !default;
1201
1202
$carousel-control-hover-opacity:     .9 !default;
$carousel-control-transition:        opacity .15s ease !default;
Mark Otto's avatar
Mark Otto committed
1203

1204
1205
1206
1207
$carousel-indicator-width:           30px !default;
$carousel-indicator-height:          3px !default;
$carousel-indicator-hit-area-height: 10px !default;
$carousel-indicator-spacer:          3px !default;
1208
$carousel-indicator-opacity:         .5 !default;
1209
$carousel-indicator-active-bg:       $white !default;
1210
$carousel-indicator-active-opacity:  1 !default;
1211
$carousel-indicator-transition:      opacity .6s ease !default;
Mark Otto's avatar
Mark Otto committed
1212

1213
1214
$carousel-caption-width:             70% !default;
$carousel-caption-color:             $white !default;
leshasmp's avatar
leshasmp committed
1215
1216
$carousel-caption-padding-y:         1.25rem !default;
$carousel-caption-spacer:            1.25rem !default;
Mark Otto's avatar
Mark Otto committed
1217

1218
$carousel-control-icon-width:        20px !default;
1219

1220
1221
$carousel-control-prev-icon-bg:      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default;
$carousel-control-next-icon-bg:      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
1222

1223
$carousel-transition-duration:       .6s !default;
1224
$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
1225

Mark Otto's avatar
Mark Otto committed
1226

1227
1228
// Spinners

1229
1230
1231
1232
$spinner-width:           2rem !default;
$spinner-height:          $spinner-width !default;
$spinner-border-width:    .25em !default;
$spinner-animation-speed: .75s !default;
1233
1234
1235
1236
1237
1238

$spinner-width-sm:        1rem !default;
$spinner-height-sm:       $spinner-width-sm !default;
$spinner-border-width-sm: .2em !default;


Mark Otto's avatar
Mark Otto committed
1239
// Close
Mark Otto's avatar
Mark Otto committed
1240

XhmikosR's avatar
XhmikosR committed
1241
1242
1243
1244
$close-font-size:                   $font-size-base * 1.5 !default;
$close-font-weight:                 $font-weight-bold !default;
$close-color:                       $black !default;
$close-text-shadow:                 0 1px 0 $white !default;
Mark Otto's avatar
Mark Otto committed
1245

1246

Mark Otto's avatar
Mark Otto committed
1247
// Code
Mark Otto's avatar
Mark Otto committed
1248

1249
$code-font-size:                    $small-font-size !default;
1250
$code-color:                        $pink !default;
Mark Otto's avatar
Mark Otto committed
1251

1252
1253
1254
$kbd-padding-y:                     .2rem !default;
$kbd-padding-x:                     .4rem !default;
$kbd-font-size:                     $code-font-size !default;
XhmikosR's avatar
XhmikosR committed
1255
1256
$kbd-color:                         $white !default;
$kbd-bg:                            $gray-900 !default;
Mark Otto's avatar
Mark Otto committed
1257

Martijn Cuppens's avatar
Martijn Cuppens committed
1258
$pre-color:                         null !default;
For faster browsing, not all history is shown. View entire blame