From be41cd155ffcdb6fbc874cd777451e1c1fb6bfd5 Mon Sep 17 00:00:00 2001 From: Yuliy Date: Thu, 7 Dec 2023 20:58:44 -0500 Subject: [PATCH] Updated for paper v6.2.0 --- src/css/utilities/borders.css | 6 ++++ src/entrypoints/styles.css | 11 ++++++- src/ts/cart/cart.ts | 50 +++++++++++++++++-------------- src/ts/collections/collections.ts | 6 ++-- src/ts/globals/globals.ts | 4 ++- 5 files changed, 50 insertions(+), 27 deletions(-) diff --git a/src/css/utilities/borders.css b/src/css/utilities/borders.css index fdaaa4d1..269f32e7 100644 --- a/src/css/utilities/borders.css +++ b/src/css/utilities/borders.css @@ -44,6 +44,12 @@ outline: 2px solid transparent; outline-offset: 2px; } + .border--focus--inset { + box-shadow: none; + outline: 2px solid var(--color__bg-body-light); + outline-offset: -4px; + border: 2px solid var(--color__border-selected-light-1) !important; + } /* ======= */ /* button borders */ diff --git a/src/entrypoints/styles.css b/src/entrypoints/styles.css index 82540f93..a2e92ce4 100644 --- a/src/entrypoints/styles.css +++ b/src/entrypoints/styles.css @@ -45,7 +45,7 @@ html { /* - hide alpine elements until ready */ [x-cloak] { - @apply hidden; + @apply !hidden; } /* - remove margin on child content */ @@ -196,6 +196,15 @@ html { margin-bottom: 0; } +input[type=range]::-moz-range-thumb { + pointer-events: all; + cursor: pointer; + -moz-appearance: none; + width: 24px; + height: 24px; +/* @apply w-6 h-6 appearance-none pointer-events-auto; */ +} + /* - add spacing to challenge captcha page */ /* - add spacing to shopify legal pages */ .shopify-challenge__container, diff --git a/src/ts/cart/cart.ts b/src/ts/cart/cart.ts index 7449141b..6e964ab5 100644 --- a/src/ts/cart/cart.ts +++ b/src/ts/cart/cart.ts @@ -3,7 +3,7 @@ export const cart = { // Update cart with note input updateCartNote(note: string) { this.cart_loading = true; - fetch("/cart/update.js", { + fetch(`${window.Shopify.routes.root}cart/update.js`, { method: "POST", headers: { "Content-Type": "application/json", @@ -53,19 +53,18 @@ export const cart = { this.cart.total_price = data.total_price; this.cart.original_total_price = data.original_total_price; this.cart.total_discount = data.total_discount; - this.cart.cart_level_discount_applications = - data.cart_level_discount_applications; + this.cart.cart_level_discount_applications = data.cart_level_discount_applications; this.cart.note = data.note; + // Custom properties - this.cart.shipping_gap = - this.progress_bar_threshold * (+window.Shopify.currency.rate || 1) - - this.cart.total_price; - this.cart.shipping_progress = - (this.cart.total_price / - (this.progress_bar_threshold * - (+window.Shopify.currency.rate || 1))) * - 100 + - "%"; + let calcTotal; + if (this.cart_shipping_bar_total === 'total') { + calcTotal = this.cart.total_price + } else { + calcTotal = this.cart.original_total_price + } + this.cart.shipping_gap = this.progress_bar_threshold * (+window.Shopify.currency.rate || 1) - calcTotal; + this.cart.shipping_progress = (calcTotal / (this.progress_bar_threshold * (+window.Shopify.currency.rate || 1))) * 100 + "%"; // Finish loading setTimeout(() => { @@ -75,8 +74,15 @@ export const cart = { // Open cart if set if (openCart == true) { + let cart_behavior; + if(window.screen.width < 768){ + cart_behavior = this.cart_behavior_mobile; + } + else { + cart_behavior = this.cart_behavior_desktop; + } this.cart_delay_width = "0%"; - if (this.cart_behavior == "alert") { + if (cart_behavior == "alert") { this.cart_alert = true; setTimeout(() => { this.cart_delay_width = "100%"; @@ -85,10 +91,10 @@ export const cart = { this.cart_alert = false; }, this.cart_delay); } - if (this.cart_behavior == "drawer") { + if (cart_behavior == "drawer") { this.cart_drawer = true; } - if (this.cart_behavior == "redirect") { + if (cart_behavior == "redirect") { window.location.href = "/cart"; } } @@ -118,7 +124,7 @@ export const cart = { id: oldKey.toString(), quantity: "0", }; - fetch("/cart/change.js", { + fetch(`${window.Shopify.routes.root}cart/change.js`, { method: "POST", body: JSON.stringify(formData), headers: { @@ -142,7 +148,7 @@ export const cart = { } // Add new item - fetch("/cart/add.js", { + fetch(`${window.Shopify.routes.root}cart/add.js`, { method: "POST", body: JSON.stringify(formData), headers: { @@ -190,7 +196,7 @@ export const cart = { id: key.toString(), quantity: quantity.toString(), }; - fetch("/cart/change.js", { + fetch(`${window.Shopify.routes.root}cart/change.js`, { method: "POST", body: JSON.stringify(formData), headers: { @@ -447,7 +453,7 @@ export const cart = { }; } - fetch("/cart/add.js", { + fetch(`${window.Shopify.routes.root}cart/add.js`, { method: "POST", headers: { "Content-Type": "application/json", @@ -488,7 +494,7 @@ export const cart = { if (clear) { this.cart_loading = true; - fetch("/cart/clear.js", { + fetch(`${window.Shopify.routes.root}cart/clear.js`, { method: "POST", headers: { "Content-Type": "application/json", @@ -499,7 +505,7 @@ export const cart = { this.updateCart(true); }) .then(() => { - fetch("/cart/add.js", { + fetch(`${window.Shopify.routes.root}cart/add.js`, { method: "POST", headers: { "Content-Type": "application/json", @@ -522,7 +528,7 @@ export const cart = { this.cart_loading = false; }); } else { - fetch("/cart/add.js", { + fetch(`${window.Shopify.routes.root}cart/add.js`, { method: "POST", headers: { "Content-Type": "application/json", diff --git a/src/ts/collections/collections.ts b/src/ts/collections/collections.ts index 3b516322..14bf8967 100644 --- a/src/ts/collections/collections.ts +++ b/src/ts/collections/collections.ts @@ -111,16 +111,16 @@ export const collections = { if (pair[0].indexOf("price") !== -1) { if (pair[0] === "filter.v.price.lte") { if (pair[1] < this.filter_max) { - urlFilter = urlFilter + "&" + pair[0] + "=" + encodeURIComponent(pair[1] instanceof File ? "" : pair[1]); + urlFilter = urlFilter + "&" + pair[0] + "=" + pair[1]; } } if (pair[0] === "filter.v.price.gte") { if (pair[1] > this.filter_min) { - urlFilter = urlFilter + "&" + pair[0] + "=" + encodeURIComponent(pair[1] instanceof File ? "" : pair[1]); + urlFilter = urlFilter + "&" + pair[0] + "=" + pair[1]; } } } else { - urlFilter = urlFilter + "&" + pair[0] + "=" + encodeURIComponent(pair[1] instanceof File ? "" : pair[1]); + urlFilter = urlFilter + "&" + pair[0] + "=" + encodeURIComponent(pair[1]); } } return urlFilter; diff --git a/src/ts/globals/globals.ts b/src/ts/globals/globals.ts index 9d83911d..fcb43368 100644 --- a/src/ts/globals/globals.ts +++ b/src/ts/globals/globals.ts @@ -37,12 +37,14 @@ export const globals = { incomplete_fields: window.__initialData.incomplete_fields, // Boolean to check if product options are incomplete selectedImageIndex: window.__initialData.selectedImageIndex, // Index of the selected product image (used for fullscreen slider) // Cart related properties + cart_shipping_bar_total: window.__initialData.cart_shipping_bar_total, // Total or subtotal cart_drawer: window.__initialData.cart_drawer, // Boolean to toggle the cart drawer cart_loading: window.__initialData.cart_loading, // Boolean to toggle the cart loading state cart_alert: window.__initialData.cart_alert, // Boolean to toggle the cart alert cart_delay: window.__initialData.cart_delay, // Set the delay for the cart alert to close cart_delay_width: window.__initialData.cart_delay_width, // Set the width for the cart alert progress bar - cart_behavior: window.__initialData.cart_behavior, // Set to 'drawer' 'alert' or 'redirect' + cart_behavior_desktop: window.__initialData.cart_behavior_desktop, // Set to 'drawer' 'alert' or 'redirect' + cart_behavior_mobile: window.__initialData.cart_behavior_mobile, // Set to 'drawer' 'alert' or 'redirect' cart: window.__initialData.cart, // Object to store the cart data progress_bar_threshold: window.__initialData.progress_bar_threshold, // Set the threshold for the 'free shipping' progress bar