mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-01 07:02:48 +08:00
81 lines
1.3 KiB
SCSS
81 lines
1.3 KiB
SCSS
$width-settings-panel: 422px;
|
|
|
|
.ppcp-r-styling {
|
|
display: flex;
|
|
border: 1px solid var(--color-separators);
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
|
|
.ppcp-r-styling__title {
|
|
@include font(14, 16, 600);
|
|
|
|
color: var(--color-text-title);
|
|
display: block;
|
|
margin: 0 0 18px 0;
|
|
}
|
|
|
|
.header-section .ppcp-r-styling__title {
|
|
@include font(16, 20, 600);
|
|
}
|
|
|
|
/* The settings-panel (left side) */
|
|
.settings-panel {
|
|
width: $width-settings-panel;
|
|
padding: 48px;
|
|
|
|
.ppcp-r-styling__section {
|
|
padding-bottom: 24px;
|
|
margin-bottom: 28px;
|
|
border-bottom: 1px solid var(--color-separators);
|
|
|
|
&:last-child {
|
|
padding-bottom: 0;
|
|
margin-bottom: 0;
|
|
border-bottom-style: none;
|
|
}
|
|
}
|
|
|
|
.components-radio-control__option {
|
|
min-width: 100px;
|
|
}
|
|
}
|
|
|
|
/* The preview area (right side) */
|
|
.preview-panel {
|
|
width: calc(100% - $width-settings-panel);
|
|
background-color: var(--color-preview-background);
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.preview-panel-inner {
|
|
width: 100%;
|
|
padding: 24px;
|
|
}
|
|
}
|
|
|
|
/* --- *
|
|
|
|
&__select {
|
|
label {
|
|
@include font(13, 16, 600);
|
|
color: $color-black;
|
|
margin: 0;
|
|
text-transform: none;
|
|
}
|
|
|
|
select {
|
|
@include font(13, 20, 400);
|
|
}
|
|
}
|
|
|
|
.ppcp-r__checkbox {
|
|
.components-checkbox-control {
|
|
&__label {
|
|
@include font(13, 20, 400);
|
|
color: $color-black;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//*/
|
|
}
|
