sharpetronics/pico
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-02-23 00:01:58 -05:00
Code Issues Projects Releases Wiki Activity

style: update lg and xl breakpoints

Browse Source
This commit is contained in:
Lucas Larroche 2023-02-20 23:44:33 +07:00
parent 020fa9a1f0
commit 79bc82eb49
3 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
scss/_settings.scss
View File

@ -40,31 +40,38 @@ $breakpoints: () !default;
$breakpoints: map.deep-merge( $breakpoints: map.deep-merge(
( (
// Small (landscape phones) // Small (landscape phones)
// Font size: 17px
sm: sm:
( (
breakpoint: 576px, breakpoint: 576px,
viewport: 510px, viewport: 510px,
root-font-size: 106.25%, root-font-size: 106.25%,
), ),
// Medium (tablets) // Medium (tablets)
// Font size: 18px
md: md:
( (
breakpoint: 768px, breakpoint: 768px,
viewport: 700px, viewport: 700px,
root-font-size: 112.5%, root-font-size: 112.5%,
), ),
// Large (desktops) // Large (desktops)
// Font size: 19px
lg: lg:
( (
breakpoint: 992px, breakpoint: 1024px,
viewport: 920px, viewport: 950px,
root-font-size: 118.75%, root-font-size: 118.75%,
), ),
// Extra large (large desktops) // Extra large (large desktops)
// Font size: 20px
xl: xl:
( (
breakpoint: 1200px, breakpoint: 1280px,
viewport: 1130px, viewport: 1200px,
root-font-size: 125%, root-font-size: 125%,
) )
), ),

1
scss/pico.scss
View File

@ -1 +1,2 @@
@forward "settings";
@use "index"; @use "index";

2
scss/themes/default/_styles.scss
View File

@ -104,6 +104,7 @@
} @else if $key == "xl" { } @else if $key == "xl" {
$multiplier: 4; $multiplier: 4;
} }
#{$✨}block-spacing-vertical: calc(var(#{$✨}spacing) * $multiplier); #{$✨}block-spacing-vertical: calc(var(#{$✨}spacing) * $multiplier);
} }
} }
@ -127,6 +128,7 @@
} @else if $key == "xl" { } @else if $key == "xl" {
$multiplier: 2; $multiplier: 2;
} }
#{$✨}block-spacing-horizontal: calc(var(#{$✨}spacing) * $multiplier); #{$✨}block-spacing-horizontal: calc(var(#{$✨}spacing) * $multiplier);
} }
} }