Align Place Order button to the right (https://github.com/woocommerce/woocommerce-blocks/pull/3803)
* Fix Place Order button alignment * Change order of Place Order and Return to Cart buttons
This commit is contained in:
parent
1bd65bd948
commit
2acdbc088b
|
@ -141,7 +141,6 @@ const Checkout = ( { attributes, scrollToTop } ) => {
|
||||||
allowCreateAccount={ allowCreateAccount }
|
allowCreateAccount={ allowCreateAccount }
|
||||||
/>
|
/>
|
||||||
<div className="wc-block-checkout__actions">
|
<div className="wc-block-checkout__actions">
|
||||||
<PlaceOrderButton />
|
|
||||||
{ attributes.showReturnToCart && (
|
{ attributes.showReturnToCart && (
|
||||||
<ReturnToCartButton
|
<ReturnToCartButton
|
||||||
link={ getSetting(
|
link={ getSetting(
|
||||||
|
@ -150,6 +149,7 @@ const Checkout = ( { attributes, scrollToTop } ) => {
|
||||||
) }
|
) }
|
||||||
/>
|
/>
|
||||||
) }
|
) }
|
||||||
|
<PlaceOrderButton />
|
||||||
</div>
|
</div>
|
||||||
{ attributes.showPolicyLinks && <Policies /> }
|
{ attributes.showPolicyLinks && <Policies /> }
|
||||||
</Main>
|
</Main>
|
||||||
|
|
|
@ -1,6 +1,16 @@
|
||||||
.wc-block-checkout__add-note {
|
.wc-block-checkout__add-note {
|
||||||
padding: $gap $gap 0 9px;
|
margin: em($gap-large) 0 em($gap-large) 9px;
|
||||||
margin-bottom: $gap;
|
}
|
||||||
|
|
||||||
|
.is-mobile,
|
||||||
|
.is-small,
|
||||||
|
.is-medium {
|
||||||
|
.wc-block-checkout__add-note {
|
||||||
|
@include with-translucent-border(1px 0);
|
||||||
|
margin-bottom: em($gap);
|
||||||
|
margin-top: em($gap);
|
||||||
|
padding: em($gap) 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.wc-block-checkout__add-note .wc-block-components-textarea {
|
.wc-block-checkout__add-note .wc-block-components-textarea {
|
||||||
|
|
|
@ -14,15 +14,14 @@
|
||||||
|
|
||||||
.wc-block-checkout__actions {
|
.wc-block-checkout__actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
justify-content: space-between;
|
||||||
margin: 0 0 $gap-large*2;
|
align-items: center;
|
||||||
padding-left: 9px;
|
margin-left: 9px;
|
||||||
|
|
||||||
.wc-block-components-checkout-place-order-button {
|
.wc-block-components-checkout-place-order-button {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
height: auto;
|
height: auto;
|
||||||
margin-bottom: 44px;
|
|
||||||
|
|
||||||
.wc-block-components-button__text {
|
.wc-block-components-button__text {
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
|
@ -147,10 +146,8 @@
|
||||||
|
|
||||||
.is-large {
|
.is-large {
|
||||||
.wc-block-checkout__actions {
|
.wc-block-checkout__actions {
|
||||||
padding-right: 36px;
|
@include with-translucent-border(1px 0 0);
|
||||||
|
margin-right: $gap-large;
|
||||||
|
padding-top: em($gap-large);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.wc-block-checkout__actions {
|
|
||||||
margin-top: $gap;
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in New Issue