initial commit

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,
+    ),
+);