81 lines
1.4 KiB
SCSS
81 lines
1.4 KiB
SCSS
// Stack
|
|
// Everylayout component for vertical spacing between children
|
|
// https://every-layout.dev/layouts/stack/
|
|
|
|
.type-page .page-body,
|
|
.stack {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-start;
|
|
--stack-spacing: var(--spacing-md, 1rem);
|
|
}
|
|
|
|
.type-page .page-body,
|
|
.stack > * {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.stack > * + * {
|
|
margin-top: var(--stack-spacing);
|
|
}
|
|
|
|
.type-page .page-body > * + * {
|
|
margin-top: var(--spacing-lg);
|
|
}
|
|
|
|
|
|
.stack-spacing-0,
|
|
.stack--0 > * + * {
|
|
--stack-spacing: 0;
|
|
}
|
|
|
|
.stack-spacing-5xl,
|
|
.stack--5xl > * + * {
|
|
--stack-spacing: var(--spacing-5xl, 2rem);
|
|
}
|
|
|
|
.stack-spacing-4xl,
|
|
.stack--4xl > * + * {
|
|
--stack-spacing: var(--spacing-4xl, 2rem);
|
|
}
|
|
|
|
.stack-spacing-3xl,
|
|
.stack--3xl > * + * {
|
|
--stack-spacing: var(--spacing-3xl, 2rem);
|
|
}
|
|
|
|
.stack-spacing-2xl,
|
|
.stack--2xl > * + * {
|
|
--stack-spacing: var(--spacing-2xl, 2rem);
|
|
}
|
|
|
|
.stack-spacing-xl,
|
|
.stack--xl > * + * {
|
|
--stack-spacing: var(--spacing-xl, 2rem);
|
|
}
|
|
|
|
.stack-spacing-lg,
|
|
.stack--lg > * + * {
|
|
--stack-spacing: var(--spacing-lg, 2rem);
|
|
}
|
|
|
|
.stack-spacing-sm,
|
|
.stack--sm > * + * {
|
|
--stack-spacing: var(--spacing-sm, 0.5rem);
|
|
}
|
|
|
|
.stack-spacing-xs,
|
|
.stack--xs > * + * {
|
|
--stack-spacing: var(--spacing-xs, 0.5rem);
|
|
}
|
|
|
|
.stack-spacing-2xs,
|
|
.stack--2xs > * + * {
|
|
--stack-spacing: var(--spacing-2xs, 0.25rem);
|
|
}
|
|
|
|
.stack-spacing-3xs,
|
|
.stack--3xs > * + * {
|
|
--stack-spacing: var(--spacing-3xs, 0.25rem);
|
|
}
|