Add overlays

This commit is contained in:
inpsyde-maticluznar 2024-11-05 13:30:27 +01:00
parent 6b9b024d64
commit 6a5fc51c02
No known key found for this signature in database
GPG key ID: D005973F231309F6
9 changed files with 348 additions and 21 deletions

View file

@ -1,4 +1,17 @@
.ppcp-r-modal {
@import "../../global";
@import './button';
@import './fields';
&__container {
max-width: 100%;
width: 400px;
&--small {
padding: 0 50px;
}
}
.components-modal {
&__header {
height: 52px;
@ -22,6 +35,7 @@
gap: 8px;
border-bottom: 1px solid $color-gray-500;
padding-bottom: 12px;
margin-bottom: 24px;
}
&__title {
@ -33,4 +47,74 @@
width: 400px;
max-width: 100%;
}
&__inverted-toggle-control {
.components-form-toggle {
order: 1;
}
}
&__field-row {
display: flex;
flex-direction: column;
gap: 8px;
&--save {
margin-top: 24px;
align-items: flex-end;
}
input[type='text'] {
padding: 7px 11px;
@include font(14, 20, 400);
margin: 0;
border-color: $color-gray-700;
}
label {
@include font(14, 16, 400);
color: $color-gray-900;
}
}
&__field-rows {
display: flex;
flex-direction: column;
gap: 24px;
&--acdc {
gap: 18px;
}
}
.ppcp-r-modal__field-row--save button.is-primary {
border-radius: 2px;
padding: 6px 12px;
@include font(13, 20, 400);
}
&__content-title {
@include font(14, 20, 600);
color: $color-black;
display: block;
margin: 0 0 4px 0;
}
&__description {
@include font(14, 20, 400);
margin: 0 0 24px 0;
color: $color-black;
}
&__field-rdb {
display: flex;
gap: 18px;
align-items: center;
position: relative;
label {
@include font(14, 20, 400);
color: $color-black;
}
}
}