1
0
mirror of https://github.com/locomotivemtl/locomotive-boilerplate.git synced 2026-01-15 00:55:08 +08:00

Rename breakpoints by shortnames (#171)

* Rename breakpoints by shortnames

* Replace `tiny` breakpoint for `xs` in spacing loop

* Add 2xs, 4xl and 5xl breakpoints
This commit is contained in:
Lucas Bigot
2024-03-26 16:50:16 -04:00
committed by GitHub
parent ea8f98a52d
commit 45d8be5525
10 changed files with 45 additions and 56 deletions

View File

@@ -20,34 +20,26 @@ html {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@media (max-width: $to-small) {
@media (max-width: $to-sm) {
font-size: $font-size - 2px;
}
@media (min-width: $from-small) and (max-width: $to-medium) {
font-size: $font-size - 2px;
}
@media (min-width: $from-medium) and (max-width: $to-large) {
@media (min-width: $from-sm) and (max-width: $to-lg) {
font-size: $font-size - 1px;
}
@media (min-width: $from-large) and (max-width: $to-huge) {
font-size: $font-size; // [1]
@media (min-width: $from-lg) and (max-width: $to-2xl) {
font-size: $font-size;
}
@media (min-width: $from-huge) and (max-width: $to-gigantic) {
@media (min-width: $from-2xl) and (max-width: $to-3xl) {
font-size: $font-size + 1px;
}
@media (min-width: $from-gigantic) and (max-width: $to-colossal) {
@media (min-width: $from-3xl) {
font-size: $font-size + 2px;
}
@media (min-width: $from-colossal) {
font-size: $font-size + 4px;
}
&.is-loading {
cursor: wait;
}