woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-08-30 05:00:51 +08:00
Code Issues Projects Packages Wiki Activity Actions 18

♻️ Clean-up and simplify component SCSS

Browse source
This commit is contained in:
Philipp Stracker 2025-01-21 18:21:41 +01:00
parent a567ce7b51
commit e82f4c5f88
No known key found for this signature in database
4 changed files with 29 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

4
modules/ppcp-settings/resources/css/components/reusable-components/_settings-block.scss
View file

@ -133,10 +133,6 @@
.ppcp-r-settings-block__content {
margin-top: 24px;
}
.ppcp-r-connection-status__data {
margin-bottom: 20px;
}
}
&--connect-sandbox {

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

@ -1,5 +1,5 @@
@import './settings/input';
@import './settings/connection-status';
@import './settings/setting-rows';
@import './settings/tab-styling';
@import './settings/tab-paylater-configurator';

78
modules/ppcp-settings/resources/css/components/screens/settings/_connection-status.scss
View file

@ -1,78 +0,0 @@
// Connection Status
.ppcp-r-connection-status {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
&__status-status {
margin: 0 0 8px 0;
strong {
@include font(14, 24, 700);
color: $color-black;
}
}
&__status-label {
@include font(11, 22, 600);
color: $color-gray-900;
display: block;
text-transform: uppercase;
}
&__status-value {
@include font(13, 26, 400);
color: $color-text-tertiary;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&__data {
display: flex;
flex-direction: column;
gap: 12px;
width: 100%;
}
&__status-toggle--toggled {
.ppcp-r-connection-status__show-all-data {
transform: rotate(180deg);
}
}
&__status-row {
display: flex;
flex-direction: column;
strong {
@include font(14, 24, 600);
color: $color-gray-800;
margin-right: 12px;
white-space: nowrap;
}
.ppcp-r-connection-status__status-toggle {
line-height: 0;
}
}
@media screen and (max-width: 767px) {
flex-wrap: wrap;
&__status {
width: 100%;
}
&__status-row {
flex-wrap: wrap;
strong {
width: 100%;
}
span {
word-break: break-all;
}
}
}
}

28
modules/ppcp-settings/resources/css/components/screens/settings/_setting-rows.scss Normal file
View file

@ -0,0 +1,28 @@
.ppcp-r-setting-value-rows {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
width: 100%;
}
.ppcp-r-setting-value-row {
display: flex;
flex-direction: column;
width: 100%;
.ppcp-r-setting-label {
@include font(11, 22, 600);
color: $color-gray-900;
display: block;
text-transform: uppercase;
}
.ppcp-r-setting-value {
@include font(13, 26, 400);
color: $color-text-tertiary;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}