cerebrate-project
/
cerebrate
mirror of https://github.com/cerebrate-project/cerebrate
1
0
Fork 0
Code Issues Releases Wiki Activity

chg: [css:metafields] Improved responsiveness

pull/93/head
Sami Mokaddem 2021-11-08 14:07:31 +01:00
parent b1f08f3b2d
commit b11db037d7
No known key found for this signature in database
GPG Key ID: 164C473F627A06FA
9 changed files with 44 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
webroot/css/themes/additional/bootstrap-additional.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-darkly.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-default.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-flatly.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-minty.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-quartz.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-slate.css
View File

@ -320,8 +320,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

5
webroot/css/themes/theme-vapor.css
View File

@ -324,8 +324,11 @@
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX(calc(1.5rem * -.5 + 5px)); transform: translateX(calc(1.5rem * -.5 + 3px));
height: calc(100% + 4px); } } height: calc(100% + 4px); } }
@media (max-width: 575.98px) {
.multi-metafields-container > .multi-metafield-container:not(:first-child) label.form-label {
display: none; } }
.multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before { .multi-metafields-container > .multi-metafield-container:first-child > .multi-metafield-input-container::before {
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; } border-top-right-radius: 3px; }

31
webroot/scss/custom.scss
View File

@ -1,5 +1,5 @@
$secondary: #6c757d !default; $secondary: #6c757d !default;
$translateX: calc(1.5rem * -.5 + 5px); $translateX: calc(1.5rem * -.5 + 3px);
$rectHeight: calc(100% + 4px); $rectHeight: calc(100% + 4px);
$borderRadius: 3px; $borderRadius: 3px;
@ -24,22 +24,6 @@ $borderRadius: 3px;
transform: translate(0px, 18px); transform: translate(0px, 18px);
} }
// @include media-breakpoint-up(sm) {
// &::before {
// content: none !important;
// }
// }
// &::before {
// content: ' ';
// background-color: $secondary;
// opacity: 0.5;
// position: absolute;
// width: 0.25rem;
// transform: translate(5px, 10px);
// height: calc(100% - 17px);
// border-radius: $borderRadius;
// }
& > .multi-metafield-container { & > .multi-metafield-container {
position: relative; position: relative;
@ -48,16 +32,25 @@ $borderRadius: 3px;
} }
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
& > .multi-metafield-input-container::before { & > .multi-metafield-input-container::before {
background-color: $secondary; background-color: $secondary;
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
width: 0.25rem; width: 0.25rem;
transform: translateX($translateX); transform: translateX($translateX);
height: $rectHeight; height: $rectHeight;
} }
} }
@include media-breakpoint-down(sm) {
&:not(:first-child) label.form-label {
display: none;
}
}
&:first-child > .multi-metafield-input-container::before { &:first-child > .multi-metafield-input-container::before {
border-top-left-radius: $borderRadius; border-top-left-radius: $borderRadius;
border-top-right-radius: $borderRadius; border-top-right-radius: $borderRadius;