diff --git a/assets/js/blocks/cart-checkout/cart-i2/block.js b/assets/js/blocks/cart-checkout/cart-i2/block.js index e8139c97b78..f847bb11f38 100644 --- a/assets/js/blocks/cart-checkout/cart-i2/block.js +++ b/assets/js/blocks/cart-checkout/cart-i2/block.js @@ -23,6 +23,7 @@ import { SlotFillProvider } from '@woocommerce/blocks-checkout'; * Internal dependencies */ import { CartBlockContext } from './context'; +import './style.scss'; const reloadPage = () => void window.location.reload( true ); diff --git a/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-express-payment-block/editor.scss b/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-express-payment-block/editor.scss index c7acf278ff5..30104418caa 100644 --- a/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-express-payment-block/editor.scss +++ b/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-express-payment-block/editor.scss @@ -1,19 +1,15 @@ // Adjust padding and margins in the editor to improve selected block outlines. .wp-block-woocommerce-cart-express-payment-block { - margin: 14px 0 28px; - .components-placeholder__label svg { font-size: 1em; } - .wc-block-components-express-payment-continue-rule--checkout { - margin-bottom: 0; - } + .wc-block-cart__payment-options { + padding: 0; - &.wp-block-woocommerce-cart-express-payment-block--has-express-payment-methods { - padding: 14px 0; - margin: -14px 0 14px 0 !important; - position: relative; + .wc-block-components-express-payment-continue-rule { + margin-bottom: -12px; + } } } diff --git a/assets/js/blocks/cart-checkout/cart-i2/style.scss b/assets/js/blocks/cart-checkout/cart-i2/style.scss index 8c72f08fdfd..4743d1366d1 100644 --- a/assets/js/blocks/cart-checkout/cart-i2/style.scss +++ b/assets/js/blocks/cart-checkout/cart-i2/style.scss @@ -1,7 +1,56 @@ -.wp-block-woocommerce-cart.is-loading { - display: none; -} - -.wp-block-woocommerce-cart { +.wp-block-woocommerce-cart-i2 { margin-bottom: 3em; + + .wc-block-cart-items { + @include with-translucent-border(0 0 1px); + + th { + padding: 0.25rem $gap 0.25rem 0; + white-space: nowrap; + } + td { + @include with-translucent-border(1px 0 0); + padding: $gap 0 $gap $gap; + vertical-align: top; + } + th:last-child { + padding-right: 0; + } + td:last-child { + padding-right: $gap; + } + } + + .wc-block-cart__sidebar { + & > div:not(.wc-block-components-totals-wrapper) { + margin-left: $gap; + margin-right: $gap; + } + } + + .wc-block-components-radio-control__input { + left: 0; + } + + .wc-block-cart__totals-title { + @include text-heading(); + @include font-size(smaller); + display: block; + font-weight: 600; + padding: 0.25rem 0; + text-align: right; + text-transform: uppercase; + } + + .wc-block-components-sidebar { + .wc-block-components-shipping-calculator, + .wc-block-components-shipping-rates-control__package:not(.wc-block-components-panel) { + padding-left: $gap; + padding-right: $gap; + } + } + + .wc-block-cart__payment-options { + padding: $gap 0 0; + } } diff --git a/assets/js/blocks/cart-checkout/cart/full-cart/style.scss b/assets/js/blocks/cart-checkout/cart/full-cart/style.scss index d69c1cccf7b..e3ddb16c43b 100644 --- a/assets/js/blocks/cart-checkout/cart/full-cart/style.scss +++ b/assets/js/blocks/cart-checkout/cart/full-cart/style.scss @@ -215,7 +215,7 @@ table.wc-block-cart-items { } } -.is-large.wc-block-cart { +.is-large.wp-block-woocommerce-cart { .wc-block-cart-items { @include with-translucent-border(0 0 1px); diff --git a/packages/checkout/components/totals-wrapper/style.scss b/packages/checkout/components/totals-wrapper/style.scss index 32bbf8f9f17..a1c6a41e251 100644 --- a/packages/checkout/components/totals-wrapper/style.scss +++ b/packages/checkout/components/totals-wrapper/style.scss @@ -2,6 +2,10 @@ @include with-translucent-border(1px 0 0); padding: $gap 0; + &:last-child { + padding-bottom: 0; + } + &.has-bottom-border { &::after { border-bottom-width: 1px;