spree_frontend 4.2.7 → 4.3.0.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b629df62c82fd9747036a92a11106c4f6b778962bfa6b1b6eca263c186e0fd88
-  data.tar.gz: 85d210951f2b6006450c4f57ce5a9ac6b542bc7842beaced0d3c85d9ce09405e
+  metadata.gz: 1d33bc829b31e15e9ff3fb6b935d5f0c8efe605bdb39eec91697295159834b97
+  data.tar.gz: 324b305b9b070290425491a7f42f5d9873736d8458b4d74f59e5385f51a53fee
 SHA512:
-  metadata.gz: 1956cfc9ae904bcf07e27ab741298e933ccdffd39fa61e9b39860121a6042ded4617b893b5274455ec47e2bccf4215c89a16644bc894236bb93a4f0d65f3408d
-  data.tar.gz: b4d6a5c446c2c948be71ce74810aa70abb73d3d0ad70d917fd41b1c41337638c2815fe9054abef8206de9bc258107e57ef30d2686e24b6e4eb92f3be255cfd0e
+  metadata.gz: 9fa6e789d9d2c72f9111f65f0a877f25ef5418a5166b0ab3fa9018fcb6df813c75c47fdf6d99271858c7ad29e30d5e70c82b28c3f3193f65f55328e220a57714
+  data.tar.gz: 8003796ac4b54d905d3723b69bc59090c16f9cb2a086629daff701f384b44dce88ba215d8ed1045d6ff680e29d45a1df3fc050702c30e57a4c4892f359b28bd9

data/Rakefile

@@ -11,5 +11,5 @@ task default: :spec
 desc "Generates a dummy app for testing"
 task :test_app do
   ENV['LIB_NAME'] = 'spree/frontend'
-  Rake::Task['common:test_app'].invoke
+  Rake::Task['common:test_app'].execute( { install_storefront: true, install_admin: false } )
 end

data/app/assets/config/spree_frontend_manifest.js

@@ -0,0 +1,4 @@
+//= link_tree ../images
+//
+//= link spree/frontend/all.js
+//= link spree/frontend/all.css

data/app/assets/images/card-image.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-card-image" viewBox="0 0 16 16">
+  <path d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>
+  <path d="M1.5 2A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13zm13 1a.5.5 0 0 1 .5.5v6l-3.775-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12v.54A.505.505 0 0 1 1 12.5v-9a.5.5 0 0 1 .5-.5h13z"/>
+</svg>

data/app/assets/images/file-image.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-image" viewBox="0 0 16 16">
+  <path d="M8.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>
+  <path d="M12 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM3 2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v8l-2.083-2.083a.5.5 0 0 0-.76.063L8 11 5.835 9.7a.5.5 0 0 0-.611.076L3 12V2z"/>
+</svg>

data/app/assets/images/image.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-image" viewBox="0 0 16 16">
+  <path d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>
+  <path d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/>
+</svg>

data/app/assets/images/noimage/plp.svg

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 180 240" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(0.32046,0,0,0.32046,7.99036,6.23638)">
+        <path d="M193.937,171.926C184.475,171.926 173.361,167.573 168.554,160.362C167.504,159.01 167.053,157.509 167.053,155.856C167.053,151.802 170.808,148.347 174.862,148.347C176.966,148.347 178.919,149.397 180.87,151.652C183.874,155.405 188.23,157.208 193.937,157.208C204.001,157.208 209.858,151.351 209.858,145.192C209.858,138.585 203.249,134.078 194.99,131.074C186.729,128.071 177.866,125.216 172.01,117.857C169.156,114.102 167.654,109.598 167.654,104.04C167.654,88.57 180.57,79.558 194.99,79.558C204.601,79.558 215.115,84.814 220.372,92.775C221.123,93.977 221.573,95.328 221.573,96.98C221.573,101.185 217.968,104.49 213.763,104.49C211.51,104.49 209.558,103.288 207.756,100.886C204.601,96.529 200.396,94.277 194.99,94.277C187.178,94.277 182.673,98.633 182.673,104.04C182.673,109.598 189.282,113.352 197.542,116.356C205.803,119.511 214.665,122.665 220.522,130.624C223.376,134.68 224.877,139.485 224.877,145.192C224.877,161.263 210.61,171.926 193.937,171.926ZM250.97,193.166C250.97,197.832 247.51,200.691 243.447,200.691C239.384,200.691 235.923,197.832 235.923,193.166L235.923,111.909C235.923,94.003 250.368,79.558 268.275,79.558C286.183,79.558 300.627,94.003 300.627,111.909L300.627,139.749C300.627,157.654 286.183,172.1 268.275,172.1C261.504,172.1 255.786,169.993 250.97,165.63L250.97,193.166ZM250.97,139.749C250.97,149.378 258.644,157.053 268.275,157.053C277.905,157.053 285.579,149.378 285.579,139.749L285.579,111.909C285.579,102.279 277.905,94.605 268.275,94.605C258.644,94.605 250.97,102.279 250.97,111.909L250.97,139.749ZM358.379,100.963C356.404,100.963 354.583,100.203 352.913,98.533L352.609,98.229C349.725,95.953 346.539,94.738 342.743,94.738C333.787,94.738 328.321,100.963 328.321,113.258L328.321,163.81C328.321,168.516 324.83,171.4 320.731,171.4C316.631,171.4 313.14,168.516 313.14,163.81L313.14,113.258C313.14,94.283 323.918,79.558 342.743,79.558C350.027,79.558 358.832,82.897 363.843,87.907C365.361,89.576 366.12,91.247 366.12,93.219C366.12,97.319 362.477,100.963 358.379,100.963ZM436.715,122.363C436.715,126.419 433.261,129.872 429.206,129.872L387.15,129.872L387.15,139.636C387.15,148.646 395.863,156.907 405.926,156.907C411.933,156.907 416.739,154.956 420.495,151.2C422.145,148.946 424.098,147.746 426.501,147.746C430.558,147.746 434.313,151.2 434.313,155.254C434.313,158.259 432.66,160.211 430.858,162.013C424.7,168.622 416.289,171.926 405.926,171.926C388.353,171.926 372.13,157.509 372.13,139.636L372.13,111.849C372.13,93.977 386.551,79.557 404.423,79.557C422.296,79.557 436.715,93.977 436.715,111.849L436.715,122.363ZM421.696,114.853L421.696,111.849C421.696,102.236 414.035,94.578 404.423,94.578C394.81,94.578 387.15,102.236 387.15,111.849L387.15,114.853L421.696,114.853ZM511.723,122.363C511.723,126.419 508.269,129.872 504.214,129.872L462.16,129.872L462.16,139.636C462.16,148.646 470.871,156.907 480.934,156.907C486.941,156.907 491.749,154.956 495.503,151.2C497.155,148.946 499.106,147.746 501.511,147.746C505.566,147.746 509.321,151.2 509.321,155.254C509.321,158.259 507.669,160.211 505.866,162.013C499.708,168.622 491.298,171.926 480.934,171.926C463.361,171.926 447.138,157.509 447.138,139.636L447.138,111.849C447.138,93.977 461.559,79.557 479.431,79.557C497.305,79.557 511.723,93.977 511.723,111.849L511.723,122.363ZM496.704,114.853L496.704,111.849C496.704,102.236 489.043,94.578 479.431,94.578C469.819,94.578 462.16,102.236 462.16,111.849L462.16,114.853L496.704,114.853Z" style="fill:rgb(0,102,204);fill-rule:nonzero;"/>
+        <path d="M57.551,159.794C57.551,165.5 52.927,170.124 47.221,170.124C41.516,170.124 36.892,165.5 36.892,159.794C36.892,154.088 41.516,149.464 47.221,149.464C52.927,149.464 57.551,154.088 57.551,159.794" style="fill:rgb(0,102,204);fill-rule:nonzero;"/>
+        <path d="M100.978,159.794C100.978,165.5 96.352,170.124 90.648,170.124C84.943,170.124 80.319,165.5 80.319,159.794C80.319,154.088 84.943,149.464 90.648,149.464C96.352,149.464 100.978,154.088 100.978,159.794" style="fill:rgb(0,102,204);fill-rule:nonzero;"/>
+        <path d="M94.443,139.135L43.428,139.135C39.331,139.135 35.639,136.666 34.075,132.879L20.637,100.346L10.119,100.346C4.531,100.346 0,95.815 0,90.227C0,84.639 4.531,80.108 10.119,80.108L27.406,80.108C31.503,80.108 35.195,82.578 36.758,86.364L50.196,118.897L87.742,118.897L101.569,86.278C103.751,81.131 109.69,78.733 114.836,80.91C119.98,83.092 122.384,89.03 120.203,94.176L103.76,132.965C102.174,136.705 98.506,139.135 94.443,139.135" style="fill:rgb(0,102,204);fill-rule:nonzero;"/>
+        <path d="M105.747,46.537C101.875,42.505 95.47,42.376 91.439,46.248L78.842,58.342L78.842,10.12C78.842,4.53 74.313,0.001 68.723,0.001C63.135,0.001 58.605,4.53 58.605,10.12L58.605,58.106L46.482,46.297C42.479,42.399 36.072,42.481 32.173,46.485C28.273,50.489 28.357,56.895 32.36,60.795L61.663,89.336C61.797,89.467 61.941,89.582 62.08,89.703C62.154,89.768 62.225,89.835 62.3,89.898C62.645,90.181 63.002,90.439 63.373,90.671C63.425,90.702 63.481,90.731 63.534,90.764C63.898,90.982 64.272,91.175 64.656,91.344C64.691,91.359 64.721,91.38 64.757,91.395C64.781,91.406 64.805,91.413 64.828,91.422C65.058,91.518 65.291,91.6 65.526,91.678C65.612,91.707 65.697,91.741 65.783,91.767C66.013,91.836 66.247,91.891 66.48,91.944C66.573,91.966 66.666,91.994 66.759,92.011C66.993,92.058 67.228,92.089 67.464,92.118C67.557,92.129 67.648,92.149 67.742,92.157C68.058,92.189 68.374,92.204 68.691,92.204C68.701,92.204 68.711,92.206 68.722,92.206L68.723,92.206C68.75,92.206 68.778,92.202 68.804,92.202C69.1,92.2 69.396,92.187 69.69,92.159C69.864,92.143 70.038,92.11 70.21,92.085C70.355,92.063 70.501,92.048 70.645,92.02C70.851,91.981 71.055,91.925 71.258,91.874C71.366,91.845 71.476,91.824 71.582,91.793C71.792,91.731 71.996,91.655 72.202,91.579C72.3,91.543 72.402,91.513 72.5,91.473C72.696,91.394 72.887,91.302 73.08,91.21C73.185,91.16 73.291,91.115 73.393,91.062C73.568,90.97 73.737,90.868 73.908,90.766C74.024,90.696 74.143,90.63 74.257,90.556C74.406,90.458 74.551,90.349 74.696,90.243C74.825,90.148 74.955,90.055 75.081,89.954C75.207,89.851 75.329,89.74 75.451,89.631C75.545,89.548 75.642,89.473 75.733,89.386L105.457,60.845C109.488,56.974 109.618,50.568 105.747,46.537" style="fill:rgb(153,204,0);fill-rule:nonzero;"/>
+        <path d="M70.287,208.737C60.149,208.737 49.575,204.919 38.207,197.286C33.568,194.171 32.332,187.884 35.447,183.245C38.563,178.607 44.849,177.371 49.49,180.485C67.208,192.383 77.219,189.517 87.633,181.039C91.967,177.511 98.341,178.163 101.869,182.497C105.396,186.832 104.744,193.206 100.409,196.733C90.579,204.736 80.662,208.737 70.287,208.737" style="fill:rgb(153,204,0);fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(0.723327,0,0,0.716405,24.4284,25.3505)">
+        <g transform="matrix(9.26626,0,0,9.26626,16.011,72.835)">
+            <path d="M6.002,5.5C6.002,6.323 5.325,7 4.502,7C3.679,7 3.002,6.323 3.002,5.5C3.002,4.677 3.679,4 4.502,4C5.325,4 6.002,4.677 6.002,5.5Z" style="fill:rgb(125,125,125);fill-rule:nonzero;"/>
+        </g>
+        <g transform="matrix(9.26626,0,0,9.26626,16.011,72.835)">
+            <path d="M1.5,2C0.677,2 -0,2.677 0,3.5L0,12.5C0,13.323 0.677,14 1.5,14L14.5,14C15.323,14 16,13.323 16,12.5L16,3.5C16,2.677 15.323,2 14.5,2L1.5,2ZM14.5,3C14.774,3 15,3.226 15,3.5L15,9.5L11.225,7.553C11.033,7.457 10.8,7.495 10.648,7.646L6.938,11.356L4.278,9.584C4.081,9.453 3.816,9.479 3.648,9.646L1.002,12L1.002,12.54C1.001,12.527 1,12.513 1,12.5L1,3.5C1,3.226 1.226,3 1.5,3L14.5,3Z" style="fill:rgb(125,125,125);fill-rule:nonzero;"/>
+        </g>
+    </g>
+    <g transform="matrix(1.89682,0,0,1.89682,-1.5642,-167.039)">
+        <text x="18.181px" y="200.157px" style="font-family:'Arial-BoldMT', 'Arial', sans-serif;font-weight:700;font-size:12px;fill:rgb(0,102,204);">NO IMAGE</text>
+    </g>
+</svg>

data/app/assets/javascripts/spree/api/main.js

@@ -0,0 +1,36 @@
+//= require spree
+
+var SpreeAPI = {
+  oauthToken: null, // user Bearer token to authorize operations for the given user
+  orderToken: null // order token to authorize operations on current order (cart)
+}
+
+SpreeAPI.Storefront = {}
+SpreeAPI.Platform = {}
+
+// API routes
+Spree.routes.api_v2_storefront_cart_create = Spree.pathFor('api/v2/storefront/cart')
+Spree.routes.api_v2_storefront_cart_add_item = Spree.pathFor('api/v2/storefront/cart/add_item')
+Spree.routes.api_v2_storefront_cart_apply_coupon_code = Spree.pathFor('api/v2/storefront/cart/apply_coupon_code')
+
+// helpers
+SpreeAPI.handle500error = function () {
+  alert('Internal Server Error')
+}
+
+SpreeAPI.prepareHeaders = function (headers) {
+  if (typeof headers === 'undefined') {
+    headers = {}
+  }
+
+  // if signed in we need to pass the Bearer authorization token
+  // so backend will recognize that actions are authorized in scope of this user
+  if (SpreeAPI.oauthToken) {
+    headers['Authorization'] = 'Bearer ' + SpreeAPI.oauthToken
+  }
+
+  // default headers, required for POST/PATCH/DELETE requests
+  headers['Accept'] = 'application/json'
+  headers['Content-Type'] = 'application/json'
+  return headers
+}

data/app/assets/javascripts/spree/api/storefront/cart.js

@@ -0,0 +1,49 @@
+//= require spree/api/main
+
+SpreeAPI.Storefront.createCart = function (successCallback, failureCallback) {
+  fetch(Spree.routes.api_v2_storefront_cart_create, {
+    method: 'POST',
+    headers: SpreeAPI.prepareHeaders()
+  }).then(function (response) {
+    switch (response.status) {
+      case 422:
+        response.json().then(function (json) { failureCallback(json.error) })
+        break
+      case 500:
+        SpreeAPI.handle500error()
+        break
+      case 201:
+        response.json().then(function (json) {
+          SpreeAPI.orderToken = json.data.attributes.token
+          successCallback()
+        })
+        break
+    }
+  })
+}
+
+SpreeAPI.Storefront.addToCart = function (variantId, quantity, options, successCallback, failureCallback) {
+  fetch(Spree.routes.api_v2_storefront_cart_add_item, {
+    method: 'POST',
+    headers: SpreeAPI.prepareHeaders({ 'X-Spree-Order-Token': SpreeAPI.orderToken }),
+    body: JSON.stringify({
+      variant_id: variantId,
+      quantity: quantity,
+      options: options
+    })
+  }).then(function (response) {
+    switch (response.status) {
+      case 422:
+        response.json().then(function (json) { failureCallback(json.error) })
+        break
+      case 500:
+        SpreeAPI.handle500error()
+        break
+      case 200:
+        response.json().then(function (json) {
+          successCallback(json.data)
+        })
+        break
+    }
+  })
+}

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

@@ -27,11 +27,29 @@ Spree.ready(function ($) {
       if ($(CARD_NUMBER_SELECTOR).length > 0 &&
           $(CARD_EXPIRATION_SELECTOR).length > 0 &&
           $(CARD_CODE_SELECTOR).length > 0) {
+        var cardCodeCleave;
+        var updateCardCodeCleave = function (length) {
+          if (cardCodeCleave) cardCodeCleave.destroy()
+
+          cardCodeCleave = new Cleave(CARD_CODE_SELECTOR, {
+            numericOnly: true,
+            blocks: [length]
+          })
+        }
+
+        updateCardCodeCleave(3)
+
         /* eslint-disable no-new */
         new Cleave(CARD_NUMBER_SELECTOR, {
           creditCard: true,
           onCreditCardTypeChanged: function (type) {
             $('.ccType').val(type)
+
+            if (type === 'amex') {
+              updateCardCodeCleave(4)
+            } else {
+              updateCardCodeCleave(3)
+            }
           }
         })
         /* eslint-disable no-new */
@@ -39,11 +57,6 @@ Spree.ready(function ($) {
           date: true,
           datePattern: ['m', 'Y']
         })
-        /* eslint-disable no-new */
-        new Cleave(CARD_CODE_SELECTOR, {
-          numericOnly: true,
-          blocks: [3]
-        })
       }
 
       $('input[type="radio"][name="order[payments_attributes][][payment_method_id]"]').click(function () {

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

@@ -59,3 +59,19 @@ Spree.ready(function () {
 
   return Spree.Checkout
 })
+
+$('.js-remove-credit-card').click(function() {
+  if (confirm(Spree.translations.credit_card_remove_confirmation)) {
+    return $.ajax({
+      async: false,
+      method: 'DELETE',
+      url: Spree.routes.api_v2_storefront_destroy_credit_card(this.dataset.id),
+      dataType: 'json',
+      headers: {
+        'Authorization': 'Bearer ' + SpreeAPI.oauthToken
+      }
+    }).done(function() {
+      location.reload();
+    })
+  }
+})

data/app/assets/javascripts/spree/frontend/locale.es6

@@ -0,0 +1,13 @@
+document.addEventListener('turbolinks:load', () => {
+  const localeSelect = document.querySelectorAll('select[name=switch_to_locale]')
+
+  if (localeSelect.length) {
+    localeSelect.forEach((element) => {
+      element.addEventListener('change', () => {
+        Spree.clearCache()
+        Spree.showProgressBar()
+        element.form.submit()
+      })
+    })
+  }
+})

data/app/assets/javascripts/spree/frontend/views/spree/home/product_carousels.js

@@ -23,13 +23,13 @@ Spree.loadCarousel = function (element, div) {
 }
 
 Spree.loadsCarouselElements = function () {
-  $('div[data-product-carousel]').each(function (_index, element) { Spree.loadCarousel(element, this) })
+  $('div[data-product-carousel-taxon-id]').each(function (_index, element) { Spree.loadCarousel(element, this) })
 }
 
 document.addEventListener('turbolinks:load', function () {
-  var homePage = $('body#home')
+  var carouselPresent = $('div[data-product-carousel-taxon-id]')
 
-  if (homePage.length) {
+  if (carouselPresent.length) {
     // load Carousels straight away if they are in the viewport
     Spree.loadsCarouselElements()
 

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

@@ -99,13 +99,4 @@ Spree.ready(function ($) {
     $('.plp-overlay-ul-li').removeClass('plp-overlay-ul-li--active')
     $(this).addClass('plp-overlay-ul-li--active');
   });
-
-  $('.plp-overlay-buttons .done-btn').click(function (event) {
-    if (window.URLSearchParams) {
-      event.preventDefault();
-      var searchParams = new URLSearchParams(location.search);
-      searchParams.delete('menu_open');
-      setNewUrl(searchParams);
-    }
-  });
 });

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

@@ -0,0 +1,46 @@
+Spree.ready(function() {
+  class PriceRangeFilter {
+    constructor(inputsContainer, filterButton) {
+      this.inputsContainer = inputsContainer
+      this.filterButton = filterButton
+
+      this.priceInputs = inputsContainer.querySelectorAll('input')
+      this.minPriceInput = inputsContainer.querySelector('input[name="min_price"]')
+      this.maxPriceInput = inputsContainer.querySelector('input[name="max_price"]')
+    }
+
+    handlePriceChange() {
+      this.priceInputs.forEach((priceInput) => {
+        priceInput.addEventListener('change', () => {
+          this.updatePricesForFiltering(
+            parseInt(this.minPriceInput.value) || 0,
+            parseInt(this.maxPriceInput.value) || 'Infinity'
+          )
+        })
+      })
+    }
+
+    updatePricesForFiltering(minPrice, maxPrice) {
+      const formattedPriceRange = `${minPrice}-${maxPrice}`
+      const url = new URL(this.filterButton.href)
+
+      url.searchParams.set('price', formattedPriceRange)
+      this.filterButton.href = `${url.pathname}${url.search}`
+    }
+  }
+
+  // we have 2 elements for filtering prices - desktop and mobile
+  const desktopElement = document.getElementById('filterPriceRangeDesktop')
+  if (desktopElement) {
+    const desktopFilterButton = desktopElement.querySelector('a')
+    const desktopPriceRangeFilter = new PriceRangeFilter(desktopElement, desktopFilterButton)
+    desktopPriceRangeFilter.handlePriceChange()
+  }
+
+  const mobileElement = document.getElementById('filterPriceRangeMobile')
+  if (mobileElement) {
+    const mobileFilterButton = document.getElementById('filterProductsButtonMobile')
+    const mobilePriceRangeFilter = new PriceRangeFilter(mobileElement, mobileFilterButton)
+    mobilePriceRangeFilter.handlePriceChange()
+  }
+});

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

@@ -10,6 +10,7 @@
 //= require spree/api/main
 //= require ./lazysizes.config
 //= require lazysizes.min
+//= require accounting.min
 //= require turbolinks
 //= require spree/frontend/account
 //= require spree/frontend/api_tokens
@@ -29,6 +30,7 @@
 //= require spree/frontend/views/spree/products/description
 //= require spree/frontend/views/spree/products/index
 //= require spree/frontend/views/spree/products/modal_carousel
+//= require spree/frontend/views/spree/products/price_filters
 //= require spree/frontend/views/spree/shared/carousel
 //= require spree/frontend/views/spree/shared/carousel/single
 //= require spree/frontend/views/spree/shared/carousel/swipes
@@ -46,6 +48,7 @@ Spree.routes.api_tokens = Spree.pathFor('api_tokens')
 Spree.routes.ensure_cart = Spree.pathFor('ensure_cart')
 Spree.routes.api_v2_storefront_cart_apply_coupon_code = Spree.localizedPathFor('api/v2/storefront/cart/apply_coupon_code')
 Spree.routes.api_v2_storefront_cart_remove_coupon_code = function(couponCode) { return Spree.localizedPathFor('api/v2/storefront/cart/remove_coupon_code/' + couponCode) }
+Spree.routes.api_v2_storefront_destroy_credit_card = function(id) { return Spree.localizedPathFor('api/v2/storefront/account/credit_cards/' + id) }
 Spree.routes.product = function(id) { return Spree.localizedPathFor('products/' + id) }
 Spree.routes.product_related = function(id) { return Spree.localizedPathFor('products/' + id + '/related') }
 Spree.routes.product_carousel = function (taxonId) { return Spree.localizedPathFor('product_carousel/' + taxonId) }

data/app/assets/javascripts/spree.js

@@ -0,0 +1,78 @@
+//= require jsuri
+function Spree () {}
+
+Spree.ready = function (callback) {
+  return jQuery(document).on('page:load turbolinks:load', function () {
+    return callback(jQuery)
+  })
+}
+
+Spree.mountedAt = function () {
+  return window.SpreePaths.mounted_at
+}
+
+Spree.adminPath = function () {
+  return window.SpreePaths.admin
+}
+
+Spree.pathFor = function (path) {
+  var locationOrigin = (window.location.protocol + '//' + window.location.hostname) + (window.location.port ? ':' + window.location.port : '')
+
+  return this.url('' + locationOrigin + (this.mountedAt()) + path, this.url_params).toString()
+}
+
+Spree.localizedPathFor = function(path) {
+  if (typeof (SPREE_LOCALE) !== 'undefined' && typeof (SPREE_CURRENCY) !== 'undefined') {
+    var fullUrl = new URL(Spree.pathFor(path))
+    var params = fullUrl.searchParams
+    var pathName = fullUrl.pathname
+
+    params.set('currency', SPREE_CURRENCY)
+
+    if (pathName.match(/api\/v/)) {
+      params.set('locale', SPREE_LOCALE)
+    } else {
+      pathName = (this.mountedAt()) + SPREE_LOCALE + '/' + path
+    }
+    return fullUrl.origin + pathName + '?' + params.toString()
+  }
+  return Spree.pathFor(path)
+}
+
+Spree.adminPathFor = function (path) {
+  return this.pathFor('' + (this.adminPath()) + path)
+}
+
+Spree.url = function (uri, query) {
+  if (uri.path === void 0) {
+    // eslint-disable-next-line no-undef
+    uri = new Uri(uri)
+  }
+  if (query) {
+    $.each(query, function (key, value) {
+      return uri.addQueryParam(key, value)
+    })
+  }
+  return uri
+}
+
+Spree.ajax = function (urlOrSettings, settings) {
+  var url
+  if (typeof urlOrSettings === 'string') {
+    return $.ajax(Spree.url(urlOrSettings).toString(), settings)
+  } else {
+    url = urlOrSettings['url']
+    delete urlOrSettings['url']
+    return $.ajax(Spree.url(url).toString(), urlOrSettings)
+  }
+}
+
+Spree.routes = {
+  states_search: Spree.pathFor('api/v1/states'),
+  apply_coupon_code: function (orderId) {
+    return Spree.pathFor('api/v1/orders/' + orderId + '/apply_coupon_code')
+  },
+  cart: Spree.pathFor('cart')
+}
+
+Spree.url_params = {}

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

@@ -28,6 +28,7 @@
 @import "spree/frontend/views/spree/shared/order_details";
 @import "spree/frontend/views/spree/shared/main_nav_bar";
 @import "spree/frontend/views/spree/errors/not_found";
+@import "spree/frontend/views/spree/cms_sections/_index";
 @import "spree/frontend/views/spree/shared/carousel/thumbnails";
 @import "spree/frontend/views/spree/shared/carousel/single";
 @import "spree/frontend/views/spree/home/index";

data/app/assets/stylesheets/spree/frontend/components-bootstrap/button.scss

@@ -6,3 +6,11 @@
     }
   }
 }
+
+.cursor-default {
+  cursor: default;
+}
+
+.pointer-events-none {
+  pointer-events: none;
+}

data/app/assets/stylesheets/spree/frontend/helpers/spree/frontend_helper.scss

@@ -1,3 +1,22 @@
+.position-absolute-center {
+  position:absolute;
+  left:50%;
+  top:50%;
+  transform:translate(-50%, -50%);
+}
+
+.position-absolute-x-center {
+  position:absolute;
+  left:50%;
+  transform:translate(-50%, 0);
+}
+
+.position-absolute-y-center {
+  position:absolute;
+  top:50%;
+  transform:translate(0, -50%);
+}
+
 #breadcrumbs {
   padding: 0;
 }
@@ -30,3 +49,25 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+// Aspect Ratios
+[style*="--aspect-ratio"] > img,
+[style*="--aspect-ratio"] > svg {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+@supports (--custom:property) {
+  [style*="--aspect-ratio"] {
+    position: relative;
+  }
+
+  [style*="--aspect-ratio"]::before {
+    content: "";
+    display: block;
+    padding-bottom: calc(100% / (var(--aspect-ratio)));
+  }
+}

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

@@ -21,7 +21,7 @@ $spree-header-tablet-height: 75px;
 $spree-header-desktop-height: 75px;
 
 // bootstrap overrides
-$grid-gutter-width: 19px;
+$grid-gutter-width: 1rem;
 $body-color: $font-color;
 $theme-colors: (
   // standard bootstrap colors
@@ -62,7 +62,7 @@ $container-max-widths: (
 );
 
 // helper variables
-$container-padding: 17px;
+$container-padding: $grid-gutter-width / 2;
 $photo-width-to-height-ratio: 30001/ 37500;
 $photo-width-to-height-ratio-zoom: 28015 / 37500;
 $thumbnails-carousel-single-height: 100% / $photo-width-to-height-ratio;

data/app/assets/stylesheets/spree/frontend/views/spree/checkout/edit.scss

@@ -32,9 +32,21 @@
         }
       }
       &-text {
-        padding-left: 15px;
+        color: black;
+        font-size: 0.8rem;
+        @include media-breakpoint-up(sm) {
+          font-size: 1rem;
+        }
+        @include media-breakpoint-up(lg) {
+          font-size: 1.25rem;
+        }
+        svg {
+          height: 15px;
+          padding-top: 2px;
+        }
         &:hover {
           text-decoration: underline;
+          color: black;
         }
       }
     }
@@ -388,19 +400,19 @@
       }
       &-header {
         font-size: font-px-to-rem(16px);
+        hyphens: auto;
+        overflow-wrap: break-word;
+        word-wrap: break-word;
         font-weight: 500;
-        line-height: 1.06;
         letter-spacing: 0.4px;
-        margin-bottom: 35px;
+        margin-bottom: 30px;
         @include media-breakpoint-up(sm) {
           font-size: font-px-to-rem(29px);
-          line-height: 1.1;
           letter-spacing: 0.73px;
           margin-bottom: 74px;
         }
         @include media-breakpoint-up(lg) {
           font-size: font-px-to-rem(26px);
-          line-height: 0.65;
           letter-spacing: 0.65px;
           margin-bottom: 35px;
         }

data/app/assets/stylesheets/spree/frontend/views/spree/cms_sections/_index.scss

@@ -0,0 +1 @@
+@import "spree/frontend/views/spree/cms_sections/product_buy_bar";

data/app/assets/stylesheets/spree/frontend/views/spree/cms_sections/product_buy_bar.scss

@@ -0,0 +1,20 @@
+.row.section-row.sticky-top {
+  z-index: 3;
+  background-color: rgba(255, 255, 255, 0.95);
+  padding: 5px 0;
+  border-top: 1px solid $global-border-style;
+  border-bottom: 1px solid $global-border-style;
+  top: $spree-header-mobile-height + 24px;
+
+  .buy-container {
+    min-height: $spree-header-mobile-height;
+  }
+
+  li.buy-bar {
+    a { color: grey;
+      &.active {
+        color: $header-font-color;
+      }
+    }
+  }
+}