diff options
Diffstat (limited to 'source/stylesheets/_variables.scss')
| -rw-r--r-- | source/stylesheets/_variables.scss | 79 |
1 files changed, 79 insertions, 0 deletions
diff --git a/source/stylesheets/_variables.scss b/source/stylesheets/_variables.scss index 9093f23..c254708 100644 --- a/source/stylesheets/_variables.scss +++ b/source/stylesheets/_variables.scss @@ -20,6 +20,29 @@ $headings-color: #fff; $text-muted: $gray-light; +//== Components +// +//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). + +$padding-base-vertical: 8px; +$padding-base-horizontal: 12px; + +$padding-large-vertical: 14px; +$padding-large-horizontal: 16px; + +$padding-small-vertical: 5px; +$padding-small-horizontal: 10px; + +$padding-xs-vertical: 1px; +$padding-xs-horizontal: 5px; + +$line-height-large: 1.33; +$line-height-small: 1.5; + +$border-radius-base: 4px; +$border-radius-large: 6px; +$border-radius-small: 3px; + //** Global color for active items (e.g., navs or dropdowns). $component-active-color: #fff; //** Global background color for active items (e.g., navs or dropdowns). @@ -60,3 +83,59 @@ $dropdown-header-color: $text-muted; // Note: Deprecated $dropdown-caret-color as of v3.1.0 $dropdown-caret-color: #000; + +//== Form states and alerts +// +//## Define colors for form feedback states and, by default, alerts. + +$state-success-text: #fff; +$state-success-bg: $brand-success; +$state-success-border: darken(adjust-hue($state-success-bg, -10deg), 5%); + +$state-info-text: #fff; +$state-info-bg: $brand-info; +$state-info-border: darken(adjust-hue($state-info-bg, -10deg), 7%); + +$state-warning-text: #fff; +$state-warning-bg: $brand-warning; +$state-warning-border: darken(adjust-hue($state-warning-bg, -10deg), 3%); + +$state-danger-text: #fff; +$state-danger-bg: $brand-danger; +$state-danger-border: darken(adjust-hue($state-danger-bg, -10deg), 3%); + +//== Panels +// +//## + +$panel-bg: $gray-darker; +$panel-body-padding: 15px; +$panel-border-radius: $border-radius-base; + +//** Border color for elements within panels +$panel-inner-border: $gray-dark; +$panel-default-heading-bg: lighten($gray-darker, 10%); +$panel-footer-bg: $panel-default-heading-bg; + +$panel-default-text: $text-color; +$panel-default-border: $panel-inner-border; + +$panel-primary-text: #fff; +$panel-primary-border: $brand-primary; +$panel-primary-heading-bg: $brand-primary; + +$panel-success-text: $state-success-text; +$panel-success-border: $state-success-border; +$panel-success-heading-bg: $state-success-bg; + +$panel-info-text: $state-info-text; +$panel-info-border: $state-info-border; +$panel-info-heading-bg: $state-info-bg; + +$panel-warning-text: $state-warning-text; +$panel-warning-border: $state-warning-border; +$panel-warning-heading-bg: $state-warning-bg; + +$panel-danger-text: $state-danger-text; +$panel-danger-border: $state-danger-border; +$panel-danger-heading-bg: $state-danger-bg; |