Fix WooCommerce payments action button styling (https://github.com/woocommerce/woocommerce-admin/pull/7412)

* Fix WC action button styling

* Add changelog

* Updated WCPay css for updated card component

* Added changelog
This commit is contained in:
louwie17 2021-07-28 11:40:27 -03:00 committed by GitHub
parent 17730079a8
commit 668c86ac48
3 changed files with 15 additions and 9 deletions

View File

@ -0,0 +1,4 @@
Significance: patch
Type: Fix
Fixes action button mis-alignment within card footer. #7412

View File

@ -1,3 +1,7 @@
# Unreleased
- Update WCPayCard CSS to handle @wordpress/card updates. #7412
# 2.1.0
- Fix commonjs module build, allow package to be built in isolation. #7286

View File

@ -1,27 +1,30 @@
.woocommerce-task-payment-wcpay {
.woocommerce-task-payments .woocommerce-task-payment-wcpay {
.woocommerce-task-payment-wcpay__description {
font-size: 16px;
margin-bottom: $gap-large;
}
> .components-card__header {
.components-card__header {
margin-bottom: $gap-small;
justify-content: flex-start;
padding: 25px;
.woocommerce-pill {
margin-left: $gap-small;
}
}
> .components-card__footer {
.components-card__footer {
flex-direction: column;
align-items: flex-start;
.components-button {
margin-top: $gap;
margin-left: 0;
}
}
> .components-card__body {
.components-card__body {
h2 {
margin: 0 0 20px 0;
}
@ -37,9 +40,4 @@
color: #40464d;
}
}
> h2 {
display: flex;
justify-content: flex-start;
}
}