owncast/web/styles/mixins.scss

26 lines
580 B
SCSS
Raw Normal View History

@mixin flexCenter {
display: flex;
justify-content: center;
align-items: center;
}
@mixin screen ($breakpoint) {
@if $breakpoint == desktop {
@media only screen and (min-width: 768px) {
@content;
}
}
// tablet will also apply to mobile as there is no cut-off for min-width, however changing this now could break CSS all over the site.
@if $breakpoint == tablet {
@media only screen and (max-width: 768px) {
@content;
}
}
@if $breakpoint == mobile {
@media only screen and (max-width: 481px) {
@content;
}
}
}