Files
fizzy/app/assets/stylesheets/panels.css
T
2025-07-30 12:08:29 -05:00

28 lines
692 B
CSS

@layer components {
.panel {
background-color: var(--panel-bg, var(--color-canvas));
border: var(--panel-border-size, 1px) solid var(--panel-border-color, var(--color-ink-lighter));
border-radius: var(--panel-border-radius, 1em);
color: var(--color-ink);
inline-size: var(--panel-size, 60ch);
max-inline-size: 100%;
padding: var(--panel-padding, calc(var(--block-space) * 2));
}
.panels--two-up {
--panel-size: auto;
display: flex;
flex-wrap: wrap;
gap: var(--block-space-double);
align-content: start;
max-inline-size: min(100ch, 100%);
margin: auto;
.panel {
flex: 1 1 33%;
min-inline-size: 36ch;
}
}
}