Add to Cart Form Block > Ensure the editor preview is properly displayed with the Gutenberg plugin disabled (https://github.com/woocommerce/woocommerce-blocks/pull/8582)

* Update the editor styles for the add to cart form button so it is properly displayed with the Gutenberg plugin disabled.

* update for the input height.

* update the min-height
This commit is contained in:
Patricia Hillebrandt 2023-03-01 10:39:54 +01:00 committed by Tung Du
parent fb4b7d784f
commit cc6be3c3b9
2 changed files with 10 additions and 7 deletions

View File

@ -14,7 +14,7 @@ export interface Attributes {
const Edit = () => {
const blockProps = useBlockProps( {
className: 'woocommerce wc-block-add-to-cart-form',
className: 'wc-block-add-to-cart-form',
} );
return (

View File

@ -3,24 +3,27 @@
flex-direction: row;
}
.wc-block-add-to-cart-form__notice {
.wc-block-add-to-cart-form__notice.components-notice {
margin: 10px 0;
color: $black;
max-width: 60%;
}
input.wc-block-add-to-cart-form__quantity {
width: 35px;
input.wc-block-add-to-cart-form__quantity[type="number"] {
max-width: 50px;
min-height: 23px;
float: left;
padding: 10px 6px 10px 12px;
padding: 6px 6px 6px 12px;
margin-right: 10px;
height: 15px;
font-size: 13px;
height: inherit;
}
input[type="number"]::-webkit-inner-spin-button {
opacity: 1;
}
.wc-block-add-to-cart-form__button {
button.components-button.wc-block-add-to-cart-form__button {
float: left;
padding: 20px 30px;
border-radius: 0;