woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-08-31 06:52:50 +08:00
Code Issues Projects Packages Wiki Activity Actions

💄 Adjust layout of the button blocks

Browse source
This commit is contained in:
Philipp Stracker 2025-01-23 13:06:47 +01:00
parent 209c264f71
commit f721d991e8
No known key found for this signature in database
3 changed files with 27 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

48
modules/ppcp-settings/resources/css/components/reusable-components/_hstack.scss
View file

@ -1,29 +1,31 @@
.components-flex {
display: flex;
-webkit-box-align: stretch;
align-items: stretch;
-webkit-box-pack: center;
.ppcp-r-app {
.components-flex {
display: flex;
-webkit-box-align: stretch;
align-items: stretch;
-webkit-box-pack: center;
.components-h-stack {
flex-direction: row;
justify-content: flex-start;
gap: 32px;
.components-h-stack {
flex-direction: row;
justify-content: flex-start;
gap: 32px;
}
.components-v-stack {
flex-direction: column;
justify-content: center;
}
// Fix layout for checkboxes inside a flex-stack.
.components-checkbox-control > .components-base-control__field > .components-flex {
flex-direction: row;
gap: 12px;
}
}
.components-v-stack {
flex-direction: column;
justify-content: center;
}
// Fix layout for checkboxes inside a flex-stack.
.components-checkbox-control > .components-base-control__field > .components-flex {
.ppcp--horizontal {
flex-direction: row;
gap: 12px;
align-items: center;
justify-content: space-between;
}
}
.ppcp--horizontal {
flex-direction: row;
align-items: center;
justify-content: space-between;
}

1
modules/ppcp-settings/resources/js/Components/Screens/Overview/TabSettingsElements/Blocks/Troubleshooting/ResubscribeBlock.js
View file

@ -58,6 +58,7 @@ const ResubscribeBlock = () => {
'Click to remove the current webhook subscription and subscribe again, for example, if the website domain or URL structure changed.',
'woocommerce-paypal-payments'
) }
horizontalLayout={ true }
>
<ControlButton
type={ 'secondary' }

1
modules/ppcp-settings/resources/js/Components/Screens/Overview/TabSettingsElements/Blocks/Troubleshooting/SimulationBlock.js
View file

@ -115,6 +115,7 @@ const SimulationBlock = () => {
'Send a test-webhook from PayPal to confirm that webhooks are being received and processed correctly.',
'woocommerce-paypal-payments'
) }
horizontalLayout={ true }
>
<ControlButton
type={ 'secondary' }