mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-08-31 06:52:50 +08:00
♻️ Clean-up and simplify component SCSS
This commit is contained in:
parent
a567ce7b51
commit
e82f4c5f88
4 changed files with 29 additions and 83 deletions
|
@ -133,10 +133,6 @@
|
||||||
.ppcp-r-settings-block__content {
|
.ppcp-r-settings-block__content {
|
||||||
margin-top: 24px;
|
margin-top: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ppcp-r-connection-status__data {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&--connect-sandbox {
|
&--connect-sandbox {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
@import './settings/input';
|
@import './settings/input';
|
||||||
@import './settings/connection-status';
|
@import './settings/setting-rows';
|
||||||
@import './settings/tab-styling';
|
@import './settings/tab-styling';
|
||||||
@import './settings/tab-paylater-configurator';
|
@import './settings/tab-paylater-configurator';
|
||||||
|
|
||||||
|
|
|
@ -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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -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;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Add table
Add a link
Reference in a new issue