Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
53 lines
1.1 KiB
Plaintext
53 lines
1.1 KiB
Plaintext
@import '../../scss/styles.scss';
|
|
|
|
@layer payload-default {
|
|
.field-type.row {
|
|
margin-bottom: 0;
|
|
|
|
.row__fields {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
row-gap: calc(var(--base) * 0.8);
|
|
|
|
> * {
|
|
flex: 0 1 var(--field-width);
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
// add margin if the row has children
|
|
&:has(> *:nth-child(1)) {
|
|
margin-bottom: var(--base);
|
|
}
|
|
|
|
// If there is more than one child, add inline-margins to space them out.
|
|
&:has(> *:nth-child(2)) {
|
|
margin-inline: calc(var(--base) / -4); // add negative margin to counteract the gap.
|
|
|
|
> * {
|
|
flex: 0 1 calc(var(--field-width) - var(--base) * 0.5);
|
|
margin-inline: calc(var(--base) / 4);
|
|
}
|
|
}
|
|
}
|
|
|
|
@include mid-break {
|
|
.row__fields {
|
|
display: block;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
width: 100%;
|
|
|
|
> * {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
width: 100% !important;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|