woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-04 08:47:23 +08:00
Code Issues Projects Packages Wiki Activity Actions 7

♻️ Reuse the generic Accordion for settings

Browse source
This commit is contained in:
Philipp Stracker 2024-12-09 14:43:27 +01:00
parent 1b557f1619
commit 2a9766fc76
No known key found for this signature in database
3 changed files with 63 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

29
modules/ppcp-settings/resources/css/components/screens/_settings.scss
View file

@ -1,3 +1,5 @@
@import "./settings/block-accordion";
// Container and Tab Settings
.ppcp-r-tabs.settings,
.ppcp-r-container--settings {
@ -275,7 +277,6 @@
align-items: center;
}
&.ppcp-r-settings-block__accordion,
&.ppcp-r-settings-block__feature {
.ppcp-r-settings-block__title {
@include font(13, 20, 600);
@ -283,11 +284,6 @@
text-transform: none;
}
.ppcp-r-settings-block--accordion__title {
@include font(14, 20, 600);
}
.ppcp-r-settings-block--accordion__description,
.ppcp-r-settings-block__feature__description {
color: $color-gray-700;
@include font(13, 20, 400);
@ -524,27 +520,6 @@
}
}
.ppcp-r-settings-block__accordion {
.ppcp-r-settings-block--accordion__header {
gap: 4px;
}
&.ppcp-r-settings-block--content-visible .ppcp-r-settings-block--accordion__header {
margin-bottom: 24px;
}
&.ppcp-r-settings-block {
gap: 0;
.ppcp-r-settings-block:not(:last-child) {
&:not(.ppcp-r__radio-content-additional .ppcp-r-settings-block) {
padding-bottom: 32px;
margin-bottom: 32px;
border-bottom: 1px solid $color-divider;
}
}
}
}
.ppcp-r-settings-block--toggle-content {
.ppcp-r-settings-block__content {
margin-top: 32px;

38
modules/ppcp-settings/resources/css/components/screens/settings/_block-accordion.scss Normal file
View file

@ -0,0 +1,38 @@
.ppcp-r-settings-block__accordion {
> .ppcp-r-accordion {
width: 100%;
.ppcp-r-accordion__toggler {
width: 100%;
margin: 0;
text-align: unset;
}
}
&.ppcp-r-settings-block {
gap: 0;
.ppcp-r-settings-block__title {
@include font(13, 20, 600);
color: $color-text-text;
text-transform: none;
}
.ppcp-r-settings-block--accordion__title {
@include font(14, 20, 600);
}
.ppcp-r-settings-block--accordion__description {
color: $color-gray-700;
@include font(13, 20, 400);
}
.ppcp-r-settings-block:not(:last-child) {
&:not(.ppcp-r__radio-content-additional .ppcp-r-settings-block) {
padding-bottom: 32px;
margin-bottom: 32px;
border-bottom: 1px solid $color-divider;
}
}
}
}