spree_frontend 4.6.0 → 4.8.0

data/SECURITY.md

@@ -1 +1 @@
-Please see [Spree Guides Security section](https://dev-docs.spreecommerce.org/security/index).
+Please see [Spree Guides Security section](https://docs.spreecommerce.org/developer/security/quickstart).

data/app/assets/config/spree_frontend_manifest.js

@@ -1,5 +1,6 @@
+//= link_directory ../../javascript/spree/frontend .js
+
 //= link_tree ../images
 //
 //= link spree/frontend/all.js
 //= link spree/frontend/all.css
-//= link application.js

data/app/assets/javascripts/spree/frontend/{account.js → account.es6}

@@ -1,12 +1,9 @@
-Spree.fetchAccount = function () {
+const fetchAccount = () => {
   return $.ajax({
     url: Spree.localizedPathFor('account_link')
   }).done(function (data) {
-    Spree.accountFetched = true
     return $('#link-to-account').html(data)
   })
 }
 
-Spree.ready(function () {
-  if (!Spree.accountFetched) Spree.fetchAccount()
-})
+document.addEventListener("turbo:load", fetchAccount)

data/app/assets/javascripts/spree/frontend/{api_tokens.js → api_tokens.es6}

@@ -1,4 +1,4 @@
-Spree.fetchApiTokens = function () {
+const fetchApiTokens = () => {
   fetch(Spree.routes.api_tokens, {
     method: 'GET',
     credentials: 'same-origin'
@@ -8,13 +8,10 @@ Spree.fetchApiTokens = function () {
         response.json().then(function (json) {
           SpreeAPI.orderToken = json.order_token
           SpreeAPI.oauthToken = json.oauth_token
-          Spree.apiTokensFetched = true
         })
         break
     }
   })
 }
 
-Spree.ready(function () {
-  if (!Spree.apiTokensFetched) Spree.fetchApiTokens()
-})
+document.addEventListener("turbo:load", fetchApiTokens)

data/app/assets/javascripts/spree/frontend/cart.js

@@ -1,6 +1,6 @@
 //= require spree/frontend/coupon_manager
 
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   var formUpdateCart = $('form#update-cart')
 
   function buildEventTriggerObject(dataset, quantity) {

data/app/assets/javascripts/spree/frontend/checkout/address.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   Spree.onAddress = function() {
     if ($('#checkout_form_address').length) {
       Spree.updateState = function(region) {

data/app/assets/javascripts/spree/frontend/checkout/address_book.js

@@ -1,4 +1,4 @@
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   if ($('.select_address').length > 0) {
     $('input#order_use_billing').unbind('change');
 

data/app/assets/javascripts/spree/frontend/checkout/payment.js

@@ -4,7 +4,7 @@ var CARD_EXPIRATION_SELECTOR = '.cardExpiry'
 var CARD_CODE_SELECTOR = '.cardCode'
 
 //= require spree/frontend/coupon_manager
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   Spree.onPayment = function () {
     if ($('#checkout_form_payment').length) {
       if ($('#existing_cards').length) {

data/app/assets/javascripts/spree/frontend/checkout/shipment.js

@@ -60,7 +60,7 @@ ShippingTotalManager.prototype.bindEvent = function () {
   }.bind(this))
 }
 
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   var input = {
     orderTotal: $('#summary-order-total'),
     taxTotal: $('[data-hook="tax-total"]'),

data/app/assets/javascripts/spree/frontend/checkout.js

@@ -15,7 +15,7 @@ Spree.enableSave = function () {
   $('#checkout form').data('submitted', false).find(':submit, :image').attr('disabled', false).addClass('primary').removeClass('disabled')
 }
 
-Spree.ready(function () {
+document.addEventListener("turbo:load", function() {
   Spree.Checkout = {}
 
   var formCheckoutConfirm = $('form#checkout_form_confirm')

data/app/assets/javascripts/spree/frontend/login.js

@@ -1,4 +1,4 @@
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   $('#new_spree_user').on('submit', function() {
     sessionStorage.setItem('page-invalidated', 'true')
   })

data/app/assets/javascripts/spree/frontend/main_nav_bar.js

@@ -1,4 +1,4 @@
-Spree.ready(function () {
+document.addEventListener("turbo:load", function() {
   var $navLinks = $('.main-nav-bar .nav-link.dropdown-toggle')
   var $dropdownMenu = $('.main-nav-bar .dropdown-menu')
   var SHOW_CLASS = 'show'

data/app/assets/javascripts/spree/frontend/views/spree/layouts/spree_application.js

@@ -1,4 +1,4 @@
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   document.getElementById('overlay').addEventListener('click', function () {
     var noProductElement = document.getElementById('no-product-available')
     document.getElementById("overlay").classList.remove('shown');

data/app/assets/javascripts/spree/frontend/views/spree/products/cart_form.js

@@ -6,6 +6,7 @@ var ADD_TO_CART_FORM_SELECTOR = '.add-to-cart-form'
 var VARIANT_ID_SELECTOR = '[name="variant_id"]'
 var OPTION_VALUE_SELECTOR = '.product-variants-variant-values-radio'
 var ADD_TO_CART_SELECTOR = '.add-to-cart-button'
+var CHECKED_OPTION_VALUE_APPLIED_EVENT = 'spreeCheckedOptionValueApplied'
 
 var AVAILABILITY_TEMPLATES = {
   notAvailableInCurrency: '.availability-template-not-available-in-currency',
@@ -81,6 +82,12 @@ function CartForm($, $cartForm) {
     }
 
     if (initialUpdate) $optionValue.prop('checked', true)
+
+    document.dispatchEvent(
+      new CustomEvent(CHECKED_OPTION_VALUE_APPLIED_EVENT, {
+        detail: { variant: this.selectedVariant() }
+      })
+    )
   }
 
   this.saveCheckedOptionValue = function($optionValue) {
@@ -263,13 +270,13 @@ function CartForm($, $cartForm) {
     var variant = this.selectedVariant()
     var variantId = (variant && variant.id) || ''
 
-    this.$variantIdInput.val(variantId)
+    this.$variantIdInput.val(variantId).change()
   }
 
   this.constructor()
 }
 
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   Spree.variantById = function($cartForm, variantId) {
     var cartFormVariants = JSON.parse($cartForm.attr('data-variants'))
     return (

data/app/assets/javascripts/spree/frontend/views/spree/products/index.js

@@ -1,4 +1,4 @@
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   $('#sort-by-overlay-show-button').click(function () {
     $('#sort-by-overlay').show();
   });

data/app/assets/javascripts/spree/frontend/views/spree/products/modal_carousel.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   var modalCarousel = $('#productModalThumbnailsCarousel')
   if (modalCarousel.length) {
     ThumbnailsCarousel($, modalCarousel)

data/app/assets/javascripts/spree/frontend/views/spree/products/price_filters.es6

@@ -1,4 +1,4 @@
-Spree.ready(function() {
+document.addEventListener("turbo:load", function() {
   class PriceRangeFilter {
     constructor(inputsContainer, filterButton) {
       this.inputsContainer = inputsContainer

data/app/assets/javascripts/spree/frontend/views/spree/shared/carousel/single.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   // Adjust single carousel based on picked variant.
 
   var productDetailsPage = $('#product-details')

data/app/assets/javascripts/spree/frontend/views/spree/shared/carousel/swipes.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   Spree.addSwipeEventListeners = function($carousel) {
     var touchStartX = 0
     var touchStartY = 0

data/app/assets/javascripts/spree/frontend/views/spree/shared/carousel/thumbnails.js

@@ -83,7 +83,7 @@ function ThumbnailsCarousel($, carousel) {
   this.constructor()
 }
 
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   // Adjust thumbnails carousel based on picked variant.
 
   if ($('#product-details').length) {

data/app/assets/javascripts/spree/frontend/views/spree/shared/carousel.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   // Synchronize carousels.
 
   var carouselGroupIdentifierAttributeName =

data/app/assets/javascripts/spree/frontend/views/spree/shared/delete_address_popup.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   var deleteAddressLinks = document.querySelectorAll('.js-delete-address-link');
   if (deleteAddressLinks.length > 0) {
     deleteAddressLinks.forEach(function(deleteLink) {

data/app/assets/javascripts/spree/frontend/views/spree/shared/mobile_navigation.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
 
   function MobileNavigationManager()  {
     this.mobileNavigation = document.querySelector('.mobile-navigation');

data/app/assets/javascripts/spree/frontend/views/spree/shared/quantity_select.js

@@ -1,4 +1,4 @@
-Spree.ready(function($) {
+document.addEventListener("turbo:load", function() {
   var quantitySelectSelector = '.quantity-select'
   var quantitySelectDecreaseSelector = '.quantity-select-decrease'
   var quantitySelectIncreaseSelector = '.quantity-select-increase'

data/app/assets/javascripts/spree/lazysizes.config.js

@@ -3,6 +3,6 @@ window.lazySizesConfig.loadMode = 1
 window.lazySizesConfig.init = false
 window.lazySizesConfig.loadHidden = false
 
-Spree.ready(function ($) {
+document.addEventListener("turbo:load", function() {
   window.lazySizes.init()
 })

data/app/assets/stylesheets/spree/frontend/components-custom/headers.scss

@@ -1,6 +1,4 @@
 .spree-header {
-  font-size: font-px-to-rem(18px);
-  text-transform: uppercase;
   color: theme-color('dark-text');
   text-align: center;
 

data/app/assets/stylesheets/spree/frontend/components-custom/inputs.scss

@@ -1,53 +1,9 @@
 .spree-flat-input {
-  color: theme-color("secondary");
-  transition: basic-transition(border-color);
-  padding: 15px;
-  width: 100%;
-  height: auto;
-  border-width: 1px;
-  border-style: solid;
-  border-color: $second-global-border;
-  border-radius: 0;
-  outline: none;
-  font-size: font-px-to-rem(12px);
-  line-height: inherit;
-  appearance: none;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  @include media-breakpoint-up(sm) {
-    padding: 25px;
-    font-size: font-px-to-rem(23px);
-  }
-  @include media-breakpoint-up(lg) {
-    padding: 20px;
-    font-size: font-px-to-rem(14px);
-  }
-  &:focus {
-    border-color: theme-color("secondary");
-  }
-  &::placeholder {
-    text-transform: uppercase;
-  }
+  @extend .form-control;
 }
 
 .spree-flat-select {
-  @extend .spree-flat-input;
-  appearance: none;
-  padding-top:22px;
-  padding-bottom:21px;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  &-arrow {
-    right: 10px;
-    top: 50%;
-    transform: translateY(-50%);
-    @include media-breakpoint-up(sm) {
-      right: 23px;
-    }
-    @include media-breakpoint-up(lg) {
-      right: 20px;
-    }
-  }
+  @extend .custom-select;
 }
 
 .field_with_errors {
@@ -58,12 +14,6 @@
 
 .spree-flat-label {
   color: theme-color("secondary");
-  text-transform: uppercase;
-  font-size: font-px-to-rem(12px);
-
-  @include media-breakpoint-up(sm) {
-    font-size: font-px-to-rem(17px);
-  }
 }
 
 .spree-checkbox-container {
@@ -80,16 +30,6 @@
   width: 22px;
   margin-right: 0.5rem;
 
-  @include media-breakpoint-up(sm) {
-    width: 32px;
-    height: 32px;
-  }
-
-  @include media-breakpoint-up(lg) {
-    width: 22px;
-    height: 22px;
-  }
-
   input[type="checkbox"] {
     opacity: 0;
     position: absolute;
@@ -105,20 +45,10 @@
     width: 22px;
     height: 22px;
     font-size: 0;
-    border-radius: 0;
-    border: 2px solid theme-color("secondary");
+    border-radius: $input-border-radius;
+    border: 1px solid $input-border-color;
     background-color: $input-background;
     cursor: pointer;
-
-    @include media-breakpoint-up(sm) {
-      width: 32px;
-      height: 32px;
-    }
-
-    @include media-breakpoint-up(lg) {
-      width: 22px;
-      height: 22px;
-    }
   }
 
   label:after {
@@ -135,20 +65,6 @@
     border-top: none;
     border-right: none;
     transform: rotate(-45deg);
-
-    @include media-breakpoint-up(sm) {
-      width: 15px;
-      height: 10px;
-      top: 6px;
-      left: 6px;
-    }
-
-    @include media-breakpoint-up(lg) {
-      width: 12px;
-      height: 8px;
-      top: 4px;
-      left: 3px;
-    }
   }
 
   input[type="checkbox"]:focus + label {
@@ -162,23 +78,6 @@
       opacity: 1;
     }
   }
-
-  @include media-breakpoint-up(lg) {
-    height: 28px;
-    width: 28px;
-
-    label {
-      height: 28px;
-      width: 28px;
-    }
-
-    label:after {
-      width: 14px;
-      height: 9px;
-      top: 6px;
-      left: 5px;
-    }
-  }
 }
 
 .spree-checkbox-label {
@@ -202,47 +101,6 @@
   }
 }
 
-.spree-btn {
-  text-transform: uppercase;
-  letter-spacing: 0.05rem;
-  font-size: font-px-to-rem(14px);
-  font-weight: bold;
-
-  &.btn-primary {
-    font-size: font-px-to-rem(17px);
-  }
-
-  &.btn-outline-primary {
-    border-width: 2px;
-  }
-
-  @include media-breakpoint-up(sm) {
-    padding-top: 14px;
-    padding-bottom: 14px;
-
-    &.btn-primary {
-      font-size: font-px-to-rem(28px);
-    }
-
-    &.btn-outline-primary {
-      font-size: font-px-to-rem(28px);
-    }
-  }
-
-  @include media-breakpoint-up(lg) {
-    padding-top: 6px;
-    padding-bottom: 6px;
-
-    &.btn-primary {
-      font-size: font-px-to-rem(20px);
-    }
-
-    &.btn-outline-primary {
-      font-size: font-px-to-rem(20px);
-    }
-  }
-}
-
 .spree-radio-label {
   position: relative;
   padding-left: 30px;

data/app/assets/stylesheets/spree/frontend/fonts.scss

@@ -1,137 +1 @@
-// https://fonts.google.com/specimen/Montserrat?selection.family=Montserrat:400,500,700
 
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459WRhyyTh89ZNpQ.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459W1hyyTh89ZNpQ.woff2) format('woff2');
-  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459WZhyyTh89ZNpQ.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459WdhyyTh89ZNpQ.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459WlhyyTh89Y.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gTD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3g3D_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gbD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gfD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gnD_vx3rCs.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gTD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3g3D_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gbD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gfD_vx3rCubqg.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Montserrat';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gnD_vx3rCs.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}

data/app/assets/stylesheets/spree/frontend/variables/variables.scss

@@ -1,11 +1,11 @@
 // main spree variables
-$primary-color: #0074c2;
+$primary-color: #000;
 $secondary-color: #4c4c4c;
 $primary-background: #ffffff;
 $secondary-background: #f2f2f2;
 $input-background: #ffffff;
 $font-color: black;
-$font-family: "Montserrat", sans-serif;
+$font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif !default;
 $header-font-color: $font-color;
 $header-background: $primary-background;
 $meganav-font-color: $font-color;
@@ -17,8 +17,8 @@ $global-border-style: #e2e2e2;
 $second-global-border: #e2e2e2;
 $spree-header-max-width: 1440px;
 $spree-header-mobile-height: 50px;
-$spree-header-tablet-height: 75px;
-$spree-header-desktop-height: 75px;
+$spree-header-tablet-height: 50px;
+$spree-header-desktop-height: 50px;
 
 // bootstrap overrides
 $grid-gutter-width: 1rem;
@@ -38,9 +38,23 @@ $theme-colors: (
   "overlay": rgba(76, 76, 76, 0.5),
   "shadow": rgba(0, 0, 0, 0.16)
 );
-$enable-rounded: false;
-$enable-shadows: false;
-$enable-gradients: false;
+
+$enable-responsive-font-sizes: true;
+$font-size-base:   0.813rem !default;
+$font-size-plus:   0.875rem !default;
+$font-size-sm:    0.75rem !default;
+$font-size-lg:    1rem !default;
+
+$border-radius: 0.5rem !default;
+$border-radius-sm: 0.4rem !default;
+$border-radius-lg: 0.75rem !default;
+
+$dropdown-item-padding-y:           .5rem !default;
+$dropdown-item-padding-x:           1rem !default;
+
+$input-btn-padding-y:         .7rem !default;
+$input-btn-padding-x:         .75rem !default;
+
 $font-family-sans-serif: $font-family;
 $font-weight-medium: 500;
 .font-weight-medium {