feat(ui)!: scope all payload css to payload-default layer (#8545)
All payload css is now encapsulated inside CSS layers under `@layer
payload-default`
Any custom css will now have the highest possible specificity.
We have also provided a new layer `@layer payload` if you want to use
layers and ensure that your styles are applied after payload.
To override existing styles in a way that the existing rules of
specificity would be respected you can use the default layer like so
```css
@layer payload-default {
// my styles within the payload specificity
}
```
This commit is contained in:
Paul
@@ -1,59 +1,61 @@
|
||||
@import '../../../scss/styles.scss';
|
||||
|
||||
.bulk-upload--actions-bar {
|
||||
display: flex;
|
||||
padding-inline: var(--gutter-h);
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--theme-border-color);
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
background-color: var(--theme-bg);
|
||||
height: var(--doc-controls-height);
|
||||
|
||||
&__navigation {
|
||||
@layer payload-default {
|
||||
.bulk-upload--actions-bar {
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
padding-inline: var(--gutter-h);
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
border-bottom: 1px solid var(--theme-border-color);
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
background-color: var(--theme-bg);
|
||||
height: var(--doc-controls-height);
|
||||
|
||||
&__locationText {
|
||||
font-variant-numeric: tabular-nums;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__controls {
|
||||
display: flex;
|
||||
gap: calc(var(--base) / 2);
|
||||
|
||||
.btn {
|
||||
background-color: var(--theme-elevation-100);
|
||||
width: calc(var(--base) * 1.2);
|
||||
height: calc(var(--base) * 1.2);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-200);
|
||||
}
|
||||
|
||||
&__label {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
&__navigation {
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
&__saveButtons {
|
||||
display: none;
|
||||
|
||||
&__locationText {
|
||||
font-variant-numeric: tabular-nums;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__controls {
|
||||
display: flex;
|
||||
gap: calc(var(--base) / 2);
|
||||
|
||||
.btn {
|
||||
background-color: var(--theme-elevation-100);
|
||||
width: calc(var(--base) * 1.2);
|
||||
height: calc(var(--base) * 1.2);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-200);
|
||||
}
|
||||
|
||||
&__label {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
&__navigation {
|
||||
justify-content: space-between;
|
||||
}
|
||||
&__saveButtons {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,28 +1,30 @@
|
||||
.bulk-upload--add-files {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__dropArea {
|
||||
@layer payload-default {
|
||||
.bulk-upload--add-files {
|
||||
height: 100%;
|
||||
padding: calc(var(--base) * 2) var(--gutter-h);
|
||||
}
|
||||
|
||||
.dropzone {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
background-color: var(--theme-elevation-50);
|
||||
flex-direction: column;
|
||||
|
||||
p {
|
||||
&__dropArea {
|
||||
height: 100%;
|
||||
padding: calc(var(--base) * 2) var(--gutter-h);
|
||||
}
|
||||
|
||||
.dropzone {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
background-color: var(--theme-elevation-50);
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__dragAndDropText {
|
||||
margin: 0;
|
||||
text-transform: lowercase;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__dragAndDropText {
|
||||
margin: 0;
|
||||
text-transform: lowercase;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,23 +1,25 @@
|
||||
@import '../../../scss/styles.scss';
|
||||
|
||||
.bulk-upload--file-manager {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
&__editView {
|
||||
flex-grow: 1;
|
||||
@layer payload-default {
|
||||
.bulk-upload--file-manager {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
flex-direction: column-reverse;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
&__editView {
|
||||
flex-grow: 1;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
flex-direction: column-reverse;
|
||||
|
||||
&__editView {
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,27 +1,29 @@
|
||||
.drawer-close-button {
|
||||
--size: calc(var(--base) * 1.2);
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
direction: ltr;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
@layer payload-default {
|
||||
.drawer-close-button {
|
||||
--size: calc(var(--base) * 1.2);
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
direction: ltr;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
|
||||
svg {
|
||||
margin: calc(-1 * var(--size));
|
||||
width: calc(var(--size) * 2);
|
||||
height: calc(var(--size) * 2);
|
||||
svg {
|
||||
margin: calc(-1 * var(--size));
|
||||
width: calc(var(--size) * 2);
|
||||
height: calc(var(--size) * 2);
|
||||
|
||||
position: relative;
|
||||
position: relative;
|
||||
|
||||
.stroke {
|
||||
stroke-width: 1px;
|
||||
vector-effect: non-scaling-stroke;
|
||||
.stroke {
|
||||
stroke-width: 1px;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
@import '../../../scss/styles.scss';
|
||||
|
||||
.collection-edit {
|
||||
width: 100%;
|
||||
@layer payload-default {
|
||||
.collection-edit {
|
||||
width: 100%;
|
||||
|
||||
&__form {
|
||||
height: auto;
|
||||
&__form {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,277 +1,279 @@
|
||||
@import '../../../scss/styles.scss';
|
||||
|
||||
.file-selections {
|
||||
--file-gutter-h: calc(var(--gutter-h) / 4);
|
||||
border-right: 1px solid var(--theme-border-color);
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 300px;
|
||||
overflow: auto;
|
||||
max-height: 100%;
|
||||
|
||||
&__header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
margin-top: var(--base);
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
background: var(--theme-bg);
|
||||
flex-wrap: wrap;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__headerTopRow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--base);
|
||||
width: 100%;
|
||||
padding-block: var(--base);
|
||||
padding-inline: var(--file-gutter-h);
|
||||
}
|
||||
|
||||
&__header__text {
|
||||
@layer payload-default {
|
||||
.file-selections {
|
||||
--file-gutter-h: calc(var(--gutter-h) / 4);
|
||||
border-right: 1px solid var(--theme-border-color);
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.error-pill {
|
||||
align-self: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
&__filesContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: calc(var(--base) / 4);
|
||||
margin-top: calc(var(--base) / 2);
|
||||
width: 100%;
|
||||
padding-inline: var(--file-gutter-h);
|
||||
|
||||
.shimmer-effect {
|
||||
border-radius: var(--style-radius-m);
|
||||
}
|
||||
}
|
||||
|
||||
&__fileRowContainer {
|
||||
--rowPadding: calc(var(--base) / 4);
|
||||
position: relative;
|
||||
&:last-child {
|
||||
margin-bottom: calc(var(--base) / 4);
|
||||
}
|
||||
}
|
||||
|
||||
&__fileRow {
|
||||
@include btn-reset;
|
||||
display: flex;
|
||||
padding: var(--rowPadding);
|
||||
align-items: center;
|
||||
gap: calc(var(--base) / 2);
|
||||
border-radius: var(--style-radius-m);
|
||||
max-width: 100%;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-100);
|
||||
}
|
||||
|
||||
.thumbnail {
|
||||
width: base(1.2);
|
||||
height: base(1.2);
|
||||
flex-shrink: 0;
|
||||
object-fit: cover;
|
||||
border-radius: var(--style-radius-s);
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__fileDetails {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__fileRowContainer--active {
|
||||
.file-selections__fileRow {
|
||||
background-color: var(--theme-elevation-100);
|
||||
}
|
||||
|
||||
.file-selections__remove {
|
||||
.icon--x {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__fileRowContainer--error {
|
||||
.file-selections__fileRow {
|
||||
background-color: var(--theme-error-100);
|
||||
}
|
||||
|
||||
&.file-selections__fileRowContainer--active .file-selections__fileRow,
|
||||
.file-selections__fileRow:hover {
|
||||
background-color: var(--theme-error-200);
|
||||
}
|
||||
|
||||
.file-selections__remove--overlay:hover {
|
||||
background-color: var(--theme-error-50);
|
||||
|
||||
.icon--x {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__errorCount {
|
||||
margin-left: auto;
|
||||
position: absolute;
|
||||
transform: translate(50%, -50%);
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&__fileName {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__fileSize {
|
||||
font-size: calc(var(--base) / 2);
|
||||
color: var(--theme-elvation-400);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__remove {
|
||||
@include btn-reset;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
|
||||
.icon--x {
|
||||
opacity: 0.75;
|
||||
}
|
||||
}
|
||||
|
||||
&__remove--underlay {
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&__remove--overlay {
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
top: 50%;
|
||||
bottom: 50%;
|
||||
right: var(--rowPadding);
|
||||
height: 20px;
|
||||
border-radius: var(--style-radius-m);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-200);
|
||||
}
|
||||
}
|
||||
|
||||
&__header__actions {
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
}
|
||||
|
||||
&__toggler {
|
||||
display: none;
|
||||
margin: 0;
|
||||
padding-block: 0;
|
||||
}
|
||||
|
||||
&__header__mobileDocActions {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&__animateWrapper {
|
||||
width: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
&__mobileBlur {
|
||||
@include blur-bg;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
transition: opacity 100ms cubic-bezier(0, 0.2, 0.2, 1);
|
||||
}
|
||||
|
||||
&__showingFiles {
|
||||
.file-selections__mobileBlur {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
--file-gutter-h: var(--gutter-h);
|
||||
flex-direction: column-reverse;
|
||||
width: 100%;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
flex-shrink: 0;
|
||||
|
||||
&__showingFiles {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
&__filesContainer {
|
||||
@include blur-bg;
|
||||
}
|
||||
|
||||
&__fileRowContainer {
|
||||
z-index: 1;
|
||||
}
|
||||
max-height: 100%;
|
||||
|
||||
&__header {
|
||||
margin-top: 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
margin-top: var(--base);
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
background: var(--theme-bg);
|
||||
flex-wrap: wrap;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__headerTopRow {
|
||||
border-top: 1px solid var(--theme-border-color);
|
||||
padding-block: calc(var(--base) * 0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--base);
|
||||
width: 100%;
|
||||
padding-block: var(--base);
|
||||
padding-inline: var(--file-gutter-h);
|
||||
}
|
||||
|
||||
&__header__mobileDocActions {
|
||||
position: relative;
|
||||
&__header__text {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding-block: calc(var(--base) * 0.8);
|
||||
padding-inline: var(--file-gutter-h);
|
||||
border-top: 1px solid var(--theme-border-color);
|
||||
flex-direction: column;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
button {
|
||||
flex: 0.5;
|
||||
.error-pill {
|
||||
align-self: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
&__filesContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: calc(var(--base) / 4);
|
||||
margin-top: calc(var(--base) / 2);
|
||||
width: 100%;
|
||||
padding-inline: var(--file-gutter-h);
|
||||
|
||||
.shimmer-effect {
|
||||
border-radius: var(--style-radius-m);
|
||||
}
|
||||
}
|
||||
|
||||
&__fileRowContainer {
|
||||
--rowPadding: calc(var(--base) / 4);
|
||||
position: relative;
|
||||
&:last-child {
|
||||
margin-bottom: calc(var(--base) / 4);
|
||||
}
|
||||
}
|
||||
|
||||
&__fileRow {
|
||||
@include btn-reset;
|
||||
display: flex;
|
||||
padding: var(--rowPadding);
|
||||
align-items: center;
|
||||
gap: calc(var(--base) / 2);
|
||||
border-radius: var(--style-radius-m);
|
||||
max-width: 100%;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-100);
|
||||
}
|
||||
|
||||
.thumbnail {
|
||||
width: base(1.2);
|
||||
height: base(1.2);
|
||||
flex-shrink: 0;
|
||||
object-fit: cover;
|
||||
border-radius: var(--style-radius-s);
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__fileDetails {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__fileRowContainer--active {
|
||||
.file-selections__fileRow {
|
||||
background-color: var(--theme-elevation-100);
|
||||
}
|
||||
|
||||
.file-selections__remove {
|
||||
.icon--x {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__toggler {
|
||||
padding-right: 0;
|
||||
display: block;
|
||||
&__fileRowContainer--error {
|
||||
.file-selections__fileRow {
|
||||
background-color: var(--theme-error-100);
|
||||
}
|
||||
|
||||
&.file-selections__fileRowContainer--active .file-selections__fileRow,
|
||||
.file-selections__fileRow:hover {
|
||||
background-color: var(--theme-error-200);
|
||||
}
|
||||
|
||||
.file-selections__remove--overlay:hover {
|
||||
background-color: var(--theme-error-50);
|
||||
|
||||
.icon--x {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
&__errorCount {
|
||||
margin-left: auto;
|
||||
position: absolute;
|
||||
transform: translate(50%, -50%);
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&__fileName {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__fileSize {
|
||||
font-size: calc(var(--base) / 2);
|
||||
color: var(--theme-elvation-400);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__remove {
|
||||
@include btn-reset;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
|
||||
.icon--x {
|
||||
opacity: 0.75;
|
||||
}
|
||||
}
|
||||
|
||||
&__remove--underlay {
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&__remove--overlay {
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
top: 50%;
|
||||
bottom: 50%;
|
||||
right: var(--rowPadding);
|
||||
height: 20px;
|
||||
border-radius: var(--style-radius-m);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-elevation-200);
|
||||
}
|
||||
}
|
||||
|
||||
&__header__actions {
|
||||
display: flex;
|
||||
gap: var(--base);
|
||||
}
|
||||
|
||||
&__toggler {
|
||||
display: none;
|
||||
margin: 0;
|
||||
padding-block: 0;
|
||||
}
|
||||
|
||||
&__header__mobileDocActions {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&__animateWrapper {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
&__mobileBlur {
|
||||
@include blur-bg;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
transition: opacity 100ms cubic-bezier(0, 0.2, 0.2, 1);
|
||||
}
|
||||
|
||||
&__showingFiles {
|
||||
.file-selections__mobileBlur {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@include mid-break {
|
||||
--file-gutter-h: var(--gutter-h);
|
||||
flex-direction: column-reverse;
|
||||
width: 100%;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
flex-shrink: 0;
|
||||
|
||||
&__showingFiles {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
&__filesContainer {
|
||||
@include blur-bg;
|
||||
}
|
||||
|
||||
&__fileRowContainer {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&__header {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&__headerTopRow {
|
||||
border-top: 1px solid var(--theme-border-color);
|
||||
padding-block: calc(var(--base) * 0.8);
|
||||
}
|
||||
|
||||
&__header__mobileDocActions {
|
||||
position: relative;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding-block: calc(var(--base) * 0.8);
|
||||
padding-inline: var(--file-gutter-h);
|
||||
border-top: 1px solid var(--theme-border-color);
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
button {
|
||||
flex: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__toggler {
|
||||
padding-right: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,12 +1,14 @@
|
||||
.bulk-upload--drawer-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: calc(var(--base) * 2.5) var(--gutter-h);
|
||||
height: 48px;
|
||||
border-bottom: 1px solid var(--theme-border-color);
|
||||
@layer payload-default {
|
||||
.bulk-upload--drawer-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: calc(var(--base) * 2.5) var(--gutter-h);
|
||||
height: 48px;
|
||||
border-bottom: 1px solid var(--theme-border-color);
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
h2 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user