From 79bc82eb49efff0197a44a6adf20363383a7fade Mon Sep 17 00:00:00 2001
From: Lucas Larroche <lucas@larroche.com>
Date: Mon, 20 Feb 2023 23:44:33 +0700
Subject: [PATCH] style: update lg and xl breakpoints

---
 scss/_settings.scss              | 15 +++++++++++----
 scss/pico.scss                   |  1 +
 scss/themes/default/_styles.scss |  2 ++
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/scss/_settings.scss b/scss/_settings.scss
index 947f93f5..32659286 100644
--- a/scss/_settings.scss
+++ b/scss/_settings.scss
@@ -40,31 +40,38 @@ $breakpoints: () !default;
 $breakpoints: map.deep-merge(
   (
     // Small (landscape phones)
+    // Font size: 17px
     sm:
       (
         breakpoint: 576px,
         viewport: 510px,
         root-font-size: 106.25%,
       ),
+
     // Medium (tablets)
+    // Font size: 18px
     md:
       (
         breakpoint: 768px,
         viewport: 700px,
         root-font-size: 112.5%,
       ),
+
     // Large (desktops)
+    // Font size: 19px
     lg:
       (
-        breakpoint: 992px,
-        viewport: 920px,
+        breakpoint: 1024px,
+        viewport: 950px,
         root-font-size: 118.75%,
       ),
+
     // Extra large (large desktops)
+    // Font size: 20px
     xl:
       (
-        breakpoint: 1200px,
-        viewport: 1130px,
+        breakpoint: 1280px,
+        viewport: 1200px,
         root-font-size: 125%,
       )
   ),
diff --git a/scss/pico.scss b/scss/pico.scss
index db35db34..88490ffa 100644
--- a/scss/pico.scss
+++ b/scss/pico.scss
@@ -1 +1,2 @@
+@forward "settings";
 @use "index";
diff --git a/scss/themes/default/_styles.scss b/scss/themes/default/_styles.scss
index 61899c08..f1fefa54 100644
--- a/scss/themes/default/_styles.scss
+++ b/scss/themes/default/_styles.scss
@@ -104,6 +104,7 @@
               } @else if $key == "xl" {
                 $multiplier: 4;
               }
+
               #{$✨}block-spacing-vertical: calc(var(#{$✨}spacing) * $multiplier);
             }
           }
@@ -127,6 +128,7 @@
               } @else if $key == "xl" {
                 $multiplier: 2;
               }
+
               #{$✨}block-spacing-horizontal: calc(var(#{$✨}spacing) * $multiplier);
             }
           }