From 4c9ce8cd744dbcc45153cb2baa139894c6856b05 Mon Sep 17 00:00:00 2001 From: Jonathan Sadowski Date: Thu, 3 Dec 2020 18:23:14 -0600 Subject: [PATCH 1/3] 2021 Compat: Fix stretched product image on cart page --- assets/css/twenty-twenty-one.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/assets/css/twenty-twenty-one.scss b/assets/css/twenty-twenty-one.scss index 75af6192e55..d1b47b8e77d 100644 --- a/assets/css/twenty-twenty-one.scss +++ b/assets/css/twenty-twenty-one.scss @@ -2899,6 +2899,12 @@ a.reset_variations { background: var(--global--color-primary); } } + + .product-thumbnail { + .attachment-woocommerce_thumbnail { + height: auto !important; + } + } } .cart-collaterals { From 70299e7f1271f927bd6e98ffb6aff78ef09e6272 Mon Sep 17 00:00:00 2001 From: Jonathan Sadowski Date: Thu, 3 Dec 2020 18:27:40 -0600 Subject: [PATCH 2/3] 2021 compat: improve error notice display on cart page --- assets/css/twenty-twenty-one.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/assets/css/twenty-twenty-one.scss b/assets/css/twenty-twenty-one.scss index d1b47b8e77d..9ad54cbc6a4 100644 --- a/assets/css/twenty-twenty-one.scss +++ b/assets/css/twenty-twenty-one.scss @@ -2855,7 +2855,6 @@ a.reset_variations { .woocommerce-notices-wrapper { & > * { - background: var(--global--color-light-gray); padding: 15px; list-style: none; } From c7a1a627d490737f913b23e4c5c800dc8223a5d1 Mon Sep 17 00:00:00 2001 From: Jonathan Sadowski Date: Thu, 3 Dec 2020 18:29:28 -0600 Subject: [PATCH 3/3] 2021 compat: improve error notice display on checkout page --- assets/css/twenty-twenty-one.scss | 52 ++++++++++++++++++++++--------- 1 file changed, 38 insertions(+), 14 deletions(-) diff --git a/assets/css/twenty-twenty-one.scss b/assets/css/twenty-twenty-one.scss index 9ad54cbc6a4..a89b5ac7282 100644 --- a/assets/css/twenty-twenty-one.scss +++ b/assets/css/twenty-twenty-one.scss @@ -174,7 +174,7 @@ a.button { justify-content: center; &::before { - content: ''; + content: ""; float: left; padding-top: 100%; } @@ -186,7 +186,7 @@ a.button { } .single-product .type-product.sale > .onsale { - right: calc( 52% - 0.7rem ); + right: calc(52% - 0.7rem); } .price { @@ -220,7 +220,6 @@ a.button { .woocommerce-error li, .woocommerce-info { padding: 1.5rem 3rem; - display: flex; justify-content: space-between; align-items: center; @@ -251,6 +250,7 @@ a.button { } #main { + .woocommerce-error, .woocommerce-info { font-family: $headings; @@ -795,6 +795,7 @@ a.reset_variations { li { display: inline-flex !important; + a { color: $body-color; text-decoration: none; @@ -1232,6 +1233,7 @@ a.reset_variations { margin-top: -1rem; .woocommerce-Address-title { + h3 { display: inline-block; margin-right: 1rem; @@ -1246,12 +1248,14 @@ a.reset_variations { } .woocommerce-address-fields { + label { font-size: 1.5rem; margin-bottom: 0.1rem; } - input, .selection { + input, + .selection { font-size: 1.5rem; padding-top: 0.3rem; padding-bottom: 0.3rem; @@ -1325,11 +1329,12 @@ a.reset_variations { td { background: var(--global--color-background); filter: brightness(88%); + .is-dark-theme & { - filter: brightness(112%); + filter: brightness(112%); } } - } + } } } @@ -1441,7 +1446,8 @@ a.reset_variations { border-radius: var(--form--border-radius); } - .select2-container--focus .select2-selection,.select2-container--open .select2-selection { + .select2-container--focus .select2-selection, + .select2-container--open .select2-selection { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } @@ -1474,6 +1480,7 @@ a.reset_variations { margin-bottom: 2rem; padding: 1rem; } + .woocommerce-form-coupon { background: #eee; padding: 1rem; @@ -1776,7 +1783,8 @@ a.reset_variations { height: 46px; } - .select2-container--focus .select2-selection,.select2-container--open .select2-selection { + .select2-container--focus .select2-selection, + .select2-container--open .select2-selection { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } @@ -2022,6 +2030,7 @@ a.reset_variations { } tr:nth-child(2n) { + td { background: transparent !important; } @@ -2032,8 +2041,9 @@ a.reset_variations { td { background: var(--global--color-background); filter: brightness(88%); + .is-dark-theme & { - filter: brightness(112%); + filter: brightness(112%); } } } @@ -2300,12 +2310,14 @@ a.reset_variations { } .woocommerce-tabs { + ul { + li { font-size: 1rem; a { - padding: calc( 0.75 * var(--button--padding-vertical) ) calc( 0.75 * var(--button--padding-horizontal) ); + padding: calc(0.75 * var(--button--padding-vertical)) calc(0.75 * var(--button--padding-horizontal)); } } } @@ -2314,6 +2326,7 @@ a.reset_variations { table.shop_table_responsive { .button { + @include inversebuttoncolors(); } @@ -2340,8 +2353,9 @@ a.reset_variations { td { background: var(--global--color-background); filter: brightness(88%); + .is-dark-theme & { - filter: brightness(112%); + filter: brightness(112%); } } } @@ -2535,6 +2549,7 @@ a.reset_variations { * Home page */ .home #main { + [class*="woocommerce columns-"] { word-break: break-word; max-width: var(--responsive--aligndefault-width); @@ -2624,6 +2639,7 @@ a.reset_variations { padding-right: 0.5em; width: 100%; margin: 1.5rem 0; + @include inversebuttoncolors(); } } @@ -2771,6 +2787,7 @@ a.reset_variations { } #add_payment_method { + ul { list-style-type: none !important; } @@ -2805,7 +2822,9 @@ a.reset_variations { } .woocommerce-PaymentBox { - p, label { + + p, + label { font-size: 1.3rem; } @@ -2886,7 +2905,8 @@ a.reset_variations { } } - button[name="update_cart"],button[name="apply_coupon"] { + button[name="update_cart"], + button[name="apply_coupon"] { padding: 0.5rem; color: var(--global--color-primary); background: var(--global--color-background); @@ -2900,6 +2920,7 @@ a.reset_variations { } .product-thumbnail { + .attachment-woocommerce_thumbnail { height: auto !important; } @@ -2975,17 +2996,20 @@ a.reset_variations { } tr:nth-child(2n) { + td { background: transparent !important; } } tr:nth-child(2n+1) { + td { background: var(--global--color-background); filter: brightness(88%); + .is-dark-theme & { - filter: brightness(112%); + filter: brightness(112%); } } }