Skip to content

Commit

Permalink
Merge branch 'main' into fix-image-sizes-multicolumn
Browse files Browse the repository at this point in the history
  • Loading branch information
@eugenekasimov
eugenekasimov authored Mar 2, 2023
2 parents 0a11554 + 5f13b1b commit 9ab1706
Show file tree
Hide file tree
Showing 75 changed files with 1,447 additions and 604 deletions.
161 changes: 142 additions & 19 deletions assets/base.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -244,11 +244,14 @@ html.no-js .no-js-hidden {
}

.page-width {
max-width: var(--page-width);
margin: 0 auto;
padding: 0 1.5rem;
}

.page-width:not(.drawer-menu) {
max-width: var(--page-width);
}

.page-width-desktop {
padding: 0;
margin: 0 auto;
Expand All @@ -259,6 +262,11 @@ html.no-js .no-js-hidden {
padding: 0 5rem;
}

.header.page-width {
padding-left: 3.2rem;
padding-right: 3.2rem;
}

.page-width--narrow {
padding: 0 9rem;
}
Expand All @@ -273,6 +281,11 @@ html.no-js .no-js-hidden {
}

@media screen and (min-width: 990px) {
.header:not(.drawer-menu).page-width {
padding-left: 5rem;
padding-right: 5rem;
}

.page-width--narrow {
max-width: 72.6rem;
padding: 0;
Expand Down Expand Up @@ -730,19 +743,31 @@ details > * {
}

.underlined-link,
.customer a {
color: rgba(var(--color-link), var(--alpha-link));
.customer a,
.inline-richtext a {
text-underline-offset: 0.3rem;
text-decoration-thickness: 0.1rem;
transition: text-decoration-thickness ease 100ms;
}

.underlined-link,
.customer a {
color: rgba(var(--color-link), var(--alpha-link));
}

.inline-richtext a,
.rte.inline-richtext a {
color: currentColor;
}

.underlined-link:hover,
.customer a:hover {
.customer a:hover,
.inline-richtext a:hover {
color: rgb(var(--color-link));
text-decoration-thickness: 0.2rem;
}


.icon-arrow {
width: 1.5rem;
}
Expand Down Expand Up @@ -979,7 +1004,6 @@ summary::-webkit-details-marker {
}

.title-wrapper-with-link a {
color: rgb(var(--color-link));
margin-top: 0;
flex-shrink: 0;
}
Expand Down Expand Up @@ -1786,7 +1810,7 @@ details[open] > .share-button__fallback {
.customer select {
cursor: pointer;
line-height: calc(1 + 0.6 / var(--font-body-scale));
padding: 0 2rem;
padding: 0 calc(var(--inputs-border-width) + 3rem) 0 2rem;
margin: var(--inputs-border-width);
min-height: calc(var(--inputs-border-width) * 2);
}
Expand Down Expand Up @@ -2280,7 +2304,7 @@ product-info .loading-overlay:not(.hidden) ~ *,

.header {
display: grid;
grid-template-areas: 'left-icon heading icons';
grid-template-areas: 'left-icons heading icons';
grid-template-columns: 1fr 2fr 1fr;
align-items: center;
}
Expand All @@ -2294,13 +2318,21 @@ product-info .loading-overlay:not(.hidden) ~ *,
grid-template-columns: 1fr auto;
}

.header--top-left.drawer-menu,
.header--middle-left.drawer-menu {
grid-template-areas:
'navigation heading icons';
grid-template-columns: auto 1fr auto;
column-gap: 1rem;
}

.header--middle-left {
grid-template-areas: 'heading navigation icons';
grid-template-columns: auto auto 1fr;
column-gap: 2rem;
}

.header--middle-center {
.header--middle-center:not(.drawer-menu) {
grid-template-areas: 'navigation heading icons';
grid-template-columns: 1fr auto 1fr;
column-gap: 2rem;
Expand All @@ -2312,10 +2344,16 @@ product-info .loading-overlay:not(.hidden) ~ *,

.header--top-center {
grid-template-areas:
'left-icon heading icons'
'left-icons heading icons'
'navigation navigation navigation';
}

.header--top-center.drawer-menu {
grid-template-areas:
'left-icons heading icons';
grid-template-columns: 1fr 2fr 1fr;
}

.header:not(.header--middle-left, .header--middle-center) .header__inline-menu {
margin-top: 1.05rem;
}
Expand Down Expand Up @@ -2358,7 +2396,12 @@ product-info .loading-overlay:not(.hidden) ~ *,

.header__heading-logo {
height: auto;
max-width: 100%;
}

.header__heading-logo-wrapper {
width: 100%;
display: inline-block;
transition: width 0.3s cubic-bezier(0.52, 0, 0.61, 0.99);
}

Expand All @@ -2380,7 +2423,8 @@ product-info .loading-overlay:not(.hidden) ~ *,
}

@media screen and (min-width: 990px) {
.header__heading-link {
.header--middle-left .header__heading-link,
.header--top-left .header__heading-link {
margin-left: -0.75rem;
}

Expand All @@ -2389,6 +2433,12 @@ product-info .loading-overlay:not(.hidden) ~ *,
justify-self: start;
}

.header--middle-center .header__heading-link,
.header--middle-center .header__heading {
justify-self: center;
text-align: center;
}

.header--top-center .header__heading-link,
.header--top-center .header__heading {
justify-self: center;
Expand Down Expand Up @@ -2446,12 +2496,6 @@ product-info .loading-overlay:not(.hidden) ~ *,
margin-right: -1.2rem;
}

@media screen and (max-width: 989px) {
menu-drawer ~ .header__icons .header__icon--account {
display: none;
}
}

.header__icon--menu[aria-expanded="true"]::before {
content: "";
top: 100%;
Expand All @@ -2469,10 +2513,18 @@ menu-drawer + .header__search {
}

.header > .header__search {
grid-area: left-icon;
grid-area: left-icons;
justify-self: start;
}

.header--top-center.drawer-menu > .header__search {
margin-left: 3.2rem;
}

.header--top-center header-drawer {
grid-area: left-icons;
}

.header:not(.header--has-menu) * > .header__search {
display: none;
}
Expand Down Expand Up @@ -2772,7 +2824,8 @@ details-disclosure > details {
}

.overflow-hidden-mobile,
.overflow-hidden-tablet {
.overflow-hidden-tablet,
.overflow-hidden-desktop {
overflow: hidden;
}

Expand Down Expand Up @@ -2909,7 +2962,9 @@ details-disclosure > details {

.content-container--full-width,
.global-media-settings--full-width,
.global-media-settings--full-width img {
.global-media-settings--full-width img,
.global-media-settings--full-width video,
.global-media-settings--full-width iframe {
border-radius: 0;
border-left: none;
border-right: none;
Expand Down Expand Up @@ -2993,3 +3048,71 @@ details-disclosure > details {
outline: transparent solid 1px;
}
}

.rte:after {
clear: both;
content: '';
display: block;
}

.rte > p:first-child {
margin-top: 0;
}

.rte > p:last-child {
margin-bottom: 0;
}

.rte table {
table-layout: fixed;
}

@media screen and (min-width: 750px) {
.rte table td {
padding-left: 1.2rem;
padding-right: 1.2rem;
}
}

.rte img {
height: auto;
max-width: 100%;
border: var(--media-border-width) solid rgba(var(--color-foreground), var(--media-border-opacity));
border-radius: var(--media-radius);
box-shadow: var(--media-shadow-horizontal-offset) var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius) rgba(var(--color-shadow), var(--media-shadow-opacity));
margin-bottom: var(--media-shadow-vertical-offset);
}

.rte ul,
.rte ol {
list-style-position: inside;
padding-left: 2rem;
}

.rte li {
list-style: inherit;
}

.rte li:last-child {
margin-bottom: 0;
}

.rte a {
color: rgba(var(--color-link), var(--alpha-link));
text-underline-offset: 0.3rem;
text-decoration-thickness: 0.1rem;
transition: text-decoration-thickness var(--duration-short) ease;
}

.rte a:hover {
color: rgb(var(--color-link));
text-decoration-thickness: 0.2rem;
}

.rte blockquote {
display: inline-flex;
}

.rte blockquote > * {
margin: -0.5rem 0 -0.5rem 0;
}
14 changes: 11 additions & 3 deletions assets/cart.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,7 @@ class CartItems extends HTMLElement {
.then((state) => {
const parsedState = JSON.parse(state);
const quantityElement = document.getElementById(`Quantity-${line}`) || document.getElementById(`Drawer-quantity-${line}`);
const items = document.querySelectorAll('.cart-item');

if (parsedState.errors) {
quantityElement.value = quantityElement.getAttribute('value');
Expand All @@ -120,8 +121,15 @@ class CartItems extends HTMLElement {
elementToReplace.innerHTML =
this.getSectionInnerHTML(parsedState.sections[section.section], section.selector);
}));
const updatedValue = parsedState.items[line - 1].quantity;
const message = updatedValue !== parseInt(quantityElement.value) ? window.cartStrings.quantityError.replace('[quantity]', updatedValue) : '';
const updatedValue = parsedState.items[line - 1] ? parsedState.items[line - 1].quantity : undefined;
let message = '';
if (items.length === parsedState.items.length && updatedValue !== parseInt(quantityElement.value)) {
if (typeof updatedValue === 'undefined') {
message = window.cartStrings.error;
} else {
message = window.cartStrings.quantityError.replace('[quantity]', updatedValue);
}
}
this.updateLiveRegions(line, message);

const lineItem = document.getElementById(`CartItem-${line}`) || document.getElementById(`CartDrawer-Item-${line}`);
Expand All @@ -145,7 +153,7 @@ class CartItems extends HTMLElement {

updateLiveRegions(line, message) {
const lineItemError = document.getElementById(`Line-item-error-${line}`) || document.getElementById(`CartDrawer-LineItemError-${line}`);
lineItemError.querySelector('.cart-item__error-text').innerHTML = message;
if (lineItemError) lineItemError.querySelector('.cart-item__error-text').innerHTML = message;

this.lineItemStatusElement.setAttribute('aria-hidden', true);

Expand Down
6 changes: 6 additions & 0 deletions assets/component-cart-notification.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,12 @@
.cart-notification {
border-width: 0 var(--popup-border-width) var(--popup-border-width);
max-width: 36.8rem;
right: 2.2rem;
}
}

@media screen and (min-width: 990px) {
.cart-notification-wrapper:is(.page-width) > .cart-notification {
right: 4rem;
}
}
Expand Down
6 changes: 6 additions & 0 deletions assets/component-deferred-media.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
height: 100%;
width: 100%;
overflow: hidden;
border-radius: calc(var(--border-radius) - var(--border-width));
}

.media > .deferred-media__poster {
Expand Down Expand Up @@ -45,6 +46,11 @@
border-radius: calc(var(--media-radius) - var(--media-border-width));
}

.global-media-settings--full-width .deferred-media__poster,
.global-media-settings--full-width .deferred-media__poster:is(:focus, :focus-visible) {
border-radius: 0;
}

/* outline styling for Windows High Contrast Mode */
@media (forced-colors: active) {
.deferred-media__poster:focus {
Expand Down
Loading

0 comments on commit 9ab1706

Please sign in to comment.