sass-site/source/assets/sass/components/_playground.scss
2023-06-02 10:53:32 -04:00

27 lines
604 B
SCSS

@use 'sass:color';
@use '../breakpoints';
@use '../config/color/brand';
// Use h2 sizes for condensed header
.sl-r-banner-playground h1 {
@include breakpoints.sl-breakpoint--medium {
--h1-size: var(--sl-font-size--xx-large);
}
@include breakpoints.sl-breakpoint--large {
--h1-size: var(--sl-font-size--xxx-large);
}
}
.playground-wrapper {
display: flex;
gap: var(--sl-gutter);
> div {
// Duplicated from fun fact- should this be defined elsewhere?
border: var(--sl-border--small) solid
color.adjust(brand.$sl-color--patina, $lightness: 32%);
flex: 50%;
}
}