Changeset View
Changeset View
Standalone View
Standalone View
common/static/common/styles/studio/_variables.scss
| Show First 20 Lines • Show All 106 Lines • ▼ Show 20 Lines | $theme-colors: map-merge(("primary": $primary, | ||||
| "gray": $gray, | "gray": $gray, | ||||
| "navigation": $navigation-gray, | "navigation": $navigation-gray, | ||||
| "highlight": $highlight-white, | "highlight": $highlight-white, | ||||
| "darkhighlight": $highlight-black, | "darkhighlight": $highlight-black, | ||||
| "highlight-strong": $highlight-white-strong, | "highlight-strong": $highlight-white-strong, | ||||
| "darkhighlight-strong": $highlight-black-strong, | "darkhighlight-strong": $highlight-black-strong, | ||||
| "highlight-xstrong": $highlight-white-xstrong, | "highlight-xstrong": $highlight-white-xstrong, | ||||
| "darkhighlight-xstrong": $highlight-black-xstrong, | "darkhighlight-xstrong": $highlight-black-xstrong, | ||||
| "highlight-xxstrong": $highlight-white-xxstrong, | |||||
| "darkhighlight-xxstrong": $highlight-black-xxstrong, | |||||
| "light": $light, | "light": $light, | ||||
| "dark": $dark, | "dark": $dark, | ||||
| "transparent": $transparent, | "transparent": $transparent, | ||||
| "input": $input-gray, | "input": $input-gray, | ||||
| "beginner": $green, | "beginner": $green, | ||||
| "intermediate": $blue, | "intermediate": $blue, | ||||
| "advanced": $red, | "advanced": $red, | ||||
| ), | ), | ||||
| ▲ Show 20 Lines • Show All 268 Lines • ▼ Show 20 Lines | |||||
| $profile-size: 34px; // Same height as inputs | $profile-size: 34px; // Same height as inputs | ||||
| $profile-nav-padding: .3125rem; | $profile-nav-padding: .3125rem; | ||||
| // Tables | // Tables | ||||
| // | // | ||||
| // Customizes the `.table` component with basic values, each used across all table variations. | // Customizes the `.table` component with basic values, each used across all table variations. | ||||
| $table-cell-padding: 0.75rem !default; | $table-cell-padding: $spacer !default; | ||||
| $table-cell-padding-sm: 0.625rem 0 !default; | $table-cell-padding-sm: $spacer / 2 0 !default; | ||||
| $table-color: $body-color !default; | $table-color: $body-color !default; | ||||
| $table-bg: null !default; | $table-bg: null !default; | ||||
| $table-accent-bg: rgba($black, 0.05) !default; | $table-accent-bg: rgba($black, 0.05) !default; | ||||
| $table-hover-color: $table-color !default; | $table-hover-color: $table-color !default; | ||||
| $table-hover-bg: rgba($black, 0.075) !default; | $table-hover-bg: rgba($black, 0.075) !default; | ||||
| $table-active-bg: $table-hover-bg !default; | $table-active-bg: $table-hover-bg !default; | ||||
| ▲ Show 20 Lines • Show All 226 Lines • ▼ Show 20 Lines | |||||
| $custom-select-padding-x: $input-padding-x !default; | $custom-select-padding-x: $input-padding-x !default; | ||||
| $custom-select-font-family: $input-font-family !default; | $custom-select-font-family: $input-font-family !default; | ||||
| $custom-select-font-size: $input-font-size !default; | $custom-select-font-size: $input-font-size !default; | ||||
| $custom-select-height: $input-height !default; | $custom-select-height: $input-height !default; | ||||
| $custom-select-indicator-padding: 1.5rem !default; // Extra padding to account for the presence of the background-image based indicator | $custom-select-indicator-padding: 1.5rem !default; // Extra padding to account for the presence of the background-image based indicator | ||||
| $custom-select-font-weight: $input-font-weight !default; | $custom-select-font-weight: $input-font-weight !default; | ||||
| $custom-select-line-height: $input-line-height !default; | $custom-select-line-height: $input-line-height !default; | ||||
| $custom-select-color: $input-color !default; | $custom-select-color: $input-color !default; | ||||
| $custom-select-disabled-color: $gray-600 !default; | $custom-select-disabled-color: $input-color !default; | ||||
| $custom-select-bg: $input-bg !default; | $custom-select-bg: $input-bg !default; | ||||
| $custom-select-disabled-bg: rgba($input-bg, .5) !default; | $custom-select-disabled-bg: $input-bg !default; | ||||
| $custom-select-bg-size: 1.5rem !default; // In pixels because image dimensions | $custom-select-bg-size: 1.5rem !default; // In pixels because image dimensions | ||||
| $custom-select-indicator-color: $body-color !default; | $custom-select-indicator-color: $body-color !default; | ||||
| $custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path fill='#{$custom-select-indicator-color}' d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>") !default; | $custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path fill='#{$custom-select-indicator-color}' d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>") !default; | ||||
| $custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon) | $custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon) | ||||
| $custom-select-feedback-icon-padding-right: add(1em * 0.75, | $custom-select-feedback-icon-padding-right: add(1em * 0.75, | ||||
| (2 * $custom-select-padding-y * 0.75) + $custom-select-padding-x + $custom-select-indicator-padding) !default; | (2 * $custom-select-padding-y * 0.75) + $custom-select-padding-x + $custom-select-indicator-padding) !default; | ||||
| $custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default; | $custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default; | ||||
| ▲ Show 20 Lines • Show All 385 Lines • ▼ Show 20 Lines | |||||
| $alert-padding-y: 0.75rem !default; | $alert-padding-y: 0.75rem !default; | ||||
| $alert-padding-x: 1.25rem !default; | $alert-padding-x: 1.25rem !default; | ||||
| $alert-margin-bottom: $spacer / 2 !default; | $alert-margin-bottom: $spacer / 2 !default; | ||||
| $alert-border-radius: $border-radius !default; | $alert-border-radius: $border-radius !default; | ||||
| $alert-link-font-weight: $font-weight-bold !default; | $alert-link-font-weight: $font-weight-bold !default; | ||||
| $alert-border-width: $border-width !default; | $alert-border-width: $border-width !default; | ||||
| $alert-padding-sm-y: .5rem; | |||||
| $alert-padding-sm-x: .75rem; | |||||
| $alert-bg-level: -10 !default; | $alert-bg-level: -10 !default; | ||||
| $alert-border-level: -9 !default; | $alert-border-level: -9 !default; | ||||
| $alert-color-level: 6 !default; | $alert-color-level: 6 !default; | ||||
| // Progress bars | // Progress bars | ||||
| $progress-height: 0.25rem !default; | $progress-height: 0.25rem !default; | ||||
| $progress-font-size: $font-size-base * 0.75 !default; | $progress-font-size: $font-size-base * 0.75 !default; | ||||
| ▲ Show 20 Lines • Show All 148 Lines • Show Last 20 Lines | |||||