diff options
Diffstat (limited to 'theme_zap/static/src/scss')
| -rw-r--r-- | theme_zap/static/src/scss/bootstrap_overridden.scss | 143 | ||||
| -rw-r--r-- | theme_zap/static/src/scss/primary_variables.scss | 270 |
2 files changed, 413 insertions, 0 deletions
diff --git a/theme_zap/static/src/scss/bootstrap_overridden.scss b/theme_zap/static/src/scss/bootstrap_overridden.scss new file mode 100644 index 0000000..b432f58 --- /dev/null +++ b/theme_zap/static/src/scss/bootstrap_overridden.scss @@ -0,0 +1,143 @@ +//------------------------------------------------------------------------------// +// TODO ideally this should be done in primary variables if it was possible. +//------------------------------------------------------------------------------// + +// Headings +@if o-website-value('headings-font-number') == 1 { + // Roboto + $o-theme-headings-font-weight: 500; +} +@else if o-website-value('headings-font-number') == 4 { + // Lato + $o-theme-headings-font-weight: 300; +} +@else if o-website-value('headings-font-number') == 5 { + // Advent Pro + $o-theme-h1-font-size-multiplier: 4; + $o-theme-h2-font-size-multiplier: 3.5; + $o-theme-headings-font-weight: 600; +} +@else if o-website-value('headings-font-number') == 6 { + // Oswald + $o-theme-h1-font-size-multiplier: 4; + $o-theme-h2-font-size-multiplier: 3.5; +} + +// Body +@if o-website-value('font-number') == 1 { + // Roboto + $o-theme-font-weight-bold: 500; +} +@else if o-website-value('font-number') == 4 { + // Lato + $o-theme-font-weight-light: 300; + $o-theme-font-weight-bold: 600; +} +@else if o-website-value('font-number') == 5 { + // Advent Pro + $o-theme-font-weight-bold: 600; +} +@else if o-website-value('font-number') == 6 { + // Oswald + $o-theme-font-weight-light: 200; + $o-theme-font-weight-normal: 300; + $o-theme-font-weight-bold: 400; +} +@else if o-website-value('font-number') == 8 { + // Open Sans + $o-theme-font-weight-bold: 600; +} +@else if o-website-value('font-number') == 10 { + // Montserrat Alternates + $o-theme-font-weight-bold: 600; +} + +// Buttons +@if o-website-value('buttons-font-number') == 1 { + // Roboto + $o-theme-btn-font-weight: 500; +} +@else if o-website-value('buttons-font-number') == 5 { + // Advent Pro + $o-theme-btn-font-weight: 600; +} +@else if o-website-value('buttons-font-number') == 6 { + // Oswald + $o-theme-btn-font-weight: 200; +} +@else if o-website-value('buttons-font-number') == 8 { + // Open Sans + $o-theme-btn-font-weight: 600; +} +@else if o-website-value('buttons-font-number') == 10 { + // Montserrat Alternates + $o-theme-btn-font-weight: 600; +} + +//------------------------------------------------------------------------------// +// Bootstrap +//------------------------------------------------------------------------------// + +// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. +$yiq-contrasted-threshold: 200 !default; + +// Options +// +// Quickly modify global styling by enabling or disabling optional features. + +$enable-shadows: true; + +// Spacing +// +// Control the default styling of most Bootstrap elements by modifying these +// variables. Mostly focused on spacing. +// You can add more entries to the $spacers map, should you need more variation. + +$spacer: 1.25rem !default; + +// Components +// +// Define common padding and border radius sizes and more. + +$border-radius: .125rem !default; +$border-radius-lg: .25rem !default; +$border-radius-sm: 0 !default; + +// Badges + +$badge-border-radius: 10rem !default; +$badge-padding-y: .5em !default; +$badge-padding-x: 1rem !default; + +// Typography +// +// Font, line-height, and color for body text, headings, and more. + +$font-size-lg: o-website-value('font-size-base') * $o-theme-font-size-lg-multiplier !default; +$font-size-sm: o-website-value('font-size-base') * $o-theme-font-size-sm-multiplier !default; + +$font-weight-light: $o-theme-font-weight-light !default; +$font-weight-normal: $o-theme-font-weight-normal !default; +$font-weight-bold: $o-theme-font-weight-bold !default; + +$headings-font-weight: $o-theme-headings-font-weight !default; + +// Buttons + Forms +// +// Shared variables that are reassigned to `$input-` and `$btn-` specific variables. + +$input-btn-focus-width: 0 !default; +$input-focus-border-color: o-color('primary') !default; + +$btn-font-weight: $o-theme-btn-font-weight !default; +$btn-box-shadow: none !default; + +$input-color: o-color('o-cc1-text') !default; +$input-placeholder-color: o-color('500') !default; + +// Cards + +$card-spacer-y: 1rem !default; +$card-spacer-x: 1.75rem !default; +$card-border-width: 0 !default; +$card-border-radius: $border-radius-lg !default; diff --git a/theme_zap/static/src/scss/primary_variables.scss b/theme_zap/static/src/scss/primary_variables.scss new file mode 100644 index 0000000..4746180 --- /dev/null +++ b/theme_zap/static/src/scss/primary_variables.scss @@ -0,0 +1,270 @@ +//------------------------------------------------------------------------------// +// Presets +//------------------------------------------------------------------------------// + +$o-website-values-palettes: ( + ( + // Header + 'header-template': 'hamburger', + 'logo-height': 2.75rem, + 'fixed-logo-height': 2rem, + 'header-links-style': 'fill', + + 'header-font-size': (14 / 16) * 1rem, + 'font-size-base': (14 / 16) * 1rem, + 'hambuger-type': 'off-canvas', + 'hamburger-position': 'right', + + // Font + 'font': 'Roboto', + 'headings-font': 'Montserrat Alternates', + 'navbar-font': 'Roboto', + 'buttons-font': 'Montserrat Alternates', + 'btn-ripple': true, + + // Footer + 'footer-template': 'links', + ), +); + +//------------------------------------------------------------------------------// +// Fonts +//------------------------------------------------------------------------------// + +$o-theme-font-configs: ( + 'Roboto': ( + 'family': ('Roboto', sans-serif), + 'url': 'Roboto:300,300i,400,400i,500,500i', + ), + 'Roboto Slab': ( + 'family': ('Roboto Slab', serif), + 'url': 'Roboto+Slab:300,300i,400,400i,700,700i', + ), + 'Dosis': ( + 'family': ('Dosis', sans-serif), + 'url': 'Dosis:300,300i,400,400i,700,700i', + ), + 'Lato': ( + 'family': ('Lato', sans-serif), + 'url': 'Lato:300,300i,400,400i,700,700i', + ), + 'Advent Pro': ( + 'family': ('Advent Pro', sans-serif), + 'url': 'Advent+Pro:300,300i,400,400i,600,600i', + 'base': ( + 'font-size-base': 1.125rem, + ), + ), + 'Oswald': ( + 'family': ('Oswald', sans-serif), + 'url': 'Oswald:300,300i,400,400i,700,700i', + 'properties': ( + 'base': ( + 'font-size-base': 1.25rem, + ), + ) + ), + 'Oxygen': ( + 'family': ('Oxygen', sans-serif), + 'url': 'Oxygen:300,300i,400,400i,700,700i', + ), + 'Open Sans': ( + 'family': ('Open Sans', sans-serif), + 'url': 'Open+Sans:300,300i,400,400i,600,600i', + ), + 'Merriweather': ( + 'family': ('Merriweather', serif), + 'url': 'Merriweather:300,300i,400,400i,700,700i', + ), + 'Montserrat Alternates': ( + 'family': ('Montserrat Alternates', sans-serif), + 'url': 'Montserrat+Alternates:300,300i,400,400i,600,600i', + ), + 'Nunito': ( + 'family': ('Nunito', sans-serif), + 'url': 'Nunito:300,300i,400,400i,700,700i', + ), +); + +// Headings + +$o-theme-h1-font-size-multiplier: 3; +$o-theme-h2-font-size-multiplier: 2.5; +$o-theme-h3-font-size-multiplier: 2; +$o-theme-h4-font-size-multiplier: 1.75; +$o-theme-h5-font-size-multiplier: 1.5; +$o-theme-h6-font-size-multiplier: 1.25; + +$o-theme-headings-font-weight: 400; + +// Texts + +$o-theme-font-size-lg-multiplier: 1.25; +$o-theme-font-size-sm-multiplier: .875; + +$o-theme-font-weight-light: 300; +$o-theme-font-weight-normal: 400; +$o-theme-font-weight-bold: 700; + +// Buttons + +$o-theme-btn-font-weight: 400; + +//------------------------------------------------------------------------------// +// Colors +//------------------------------------------------------------------------------// + +$o-color-palettes: ( + ( // Palette 1 + 'o-color-1': #337ab7, + 'o-color-2': #5cb85c, + 'o-color-3': #eceef1, + 'o-color-4': #ffffff, + 'o-color-5': #1d2127, + + 'o-cc1-text': 'o-color-5', + 'o-cc3-link': 'o-color-4', + 'o-cc4-link': 'o-color-4', + 'o-cc5-headings': 'o-color-1', + + 'menu': 2, + 'footer': 2, + 'copyright': 4, + ), + ( // Palette 2 + 'o-color-1': #ed8c2b, + 'o-color-2': #a8c545, + 'o-color-3': #8e3557, + 'o-color-4': #efecca, + 'o-color-5': #35203b, + + 'o-cc1-bg': #ffffff, + 'o-cc1-text': #1d2127, + 'o-cc3-link': 'o-color-4', + 'o-cc3-btn-primary': 'o-color-5', + 'o-cc4-link': 'o-color-4', + + 'menu': 5, + 'footer': 5, + 'copyright': 4, + ), + ( // Palette 3 + 'o-color-1': #79bd8f, + 'o-color-2': #046380, + 'o-color-3': #beeb9f, + 'o-color-4': #ffffff, + 'o-color-5': #000000, + + 'o-cc1-text': #222222, + 'o-cc2-headings': 'o-color-2', + 'o-cc2-link': 'o-color-2', + 'o-cc4-link': 'o-color-4', + 'o-cc5-headings': 'o-color-3', + 'o-cc5-link': 'o-color-3', + + 'menu': 1, + 'footer': 5, + 'copyright': 4, + ), + ( // Palette 4 + 'o-color-1': #00b3c5, + 'o-color-2': #d72d3c, + 'o-color-3': #ebeef1, + 'o-color-4': #ffffff, + 'o-color-5': #000000, + + 'o-cc1-text': #1d2127, + 'o-cc2-headings': 'o-cc1-text', + 'o-cc3-link': 'o-color-4', + 'o-cc4-link': 'o-color-4', + + 'menu': 2, + 'footer': 2, + 'copyright': 4, + ), + ( // Palette 5 + 'o-color-1': #413659, + 'o-color-2': #c9de55, + 'o-color-3': #bdd4de, + 'o-color-4': #ffffff, + 'o-color-5': #14212b, + + 'o-cc1-text': 'o-color-5', + 'o-cc2-btn-secondary': 'o-color-4', + 'o-cc3-btn-secondary': 'o-color-4', + 'o-cc4-btn-primary': 'o-color-2', + 'o-cc4-btn-secondary': 'o-color-4', + 'o-cc4-link': 'o-color-3', + 'o-cc5-headings': 'o-color-2', + 'o-cc5-btn-primary': 'o-color-4', + 'o-cc5-btn-secondary': 'o-color-2', + 'o-cc5-link': 'o-color-3', + + 'menu': 2, + 'footer': 2, + 'copyright': 4, + ), + ( // Palette 6 + 'o-color-1': #F25244, + 'o-color-2': #45858C, + 'o-color-3': #e8f1ff, + 'o-color-4': #ffffff, + 'o-color-5': #000000, + + 'o-cc1-text': #323a49, + 'o-cc2-headings': 'o-cc1-text', + 'o-cc3-link': 'o-color-4', + 'o-cc3-btn-primary': 'o-color-5', + 'o-cc4-link': 'o-color-4', + + 'menu': 2, + 'footer': 5, + 'copyright': 4, + ), +); + +// Compatibility +$o-theme-color-palettes: ( + ( + 'alpha': #337ab7, + 'beta': #5cb85c, + 'gamma': #5bc0de, + 'delta': #f0ad4e, + 'epsilon': #d9534f, + ), + ( + 'alpha': #ed8c2b, + 'beta': #cf4a30, + 'gamma': #911146, + 'delta': #35203b, + 'epsilon': #88a825, + ), + ( + 'alpha': #79bd8f, + 'beta': #00a388, + 'gamma': #046380, + 'delta': #4bb5c1, + 'epsilon': #beeb9f, + ), + ( + 'alpha': #16c6cc, + 'beta': #d72d3C, + 'gamma': #ff6d3b, + 'delta': #ffb733, + 'epsilon': #ffd55c, + ), + ( + 'alpha': #14212b, + 'beta': #e6e2af, + 'gamma': #c9de55, + 'delta': #962d3e, + 'epsilon': #413659, + ), + ( + 'alpha': #ee592f, + 'beta': #59c1b0, + 'gamma': #1fa58d, + 'delta': #f8c63b, + 'epsilon': #dcb038, + ), +); |