From 7590099580f610aa2b58de660f7ab910b93e01aa Mon Sep 17 00:00:00 2001
From: tblackwell-tm <t.blackwell@techmodal.com>
Date: Mon, 4 Mar 2024 16:45:22 +0000
Subject: [PATCH] make media query ranges inclusive of lower number

---
 src/components/Clue/Clue.scss           | 2 +-
 src/components/Clues/Clues.scss         | 4 ++--
 src/components/Crossword/Crossword.scss | 2 +-
 src/components/Grid/Grid.scss           | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/Clue/Clue.scss b/src/components/Clue/Clue.scss
index 60546f7..4be53a2 100644
--- a/src/components/Clue/Clue.scss
+++ b/src/components/Clue/Clue.scss
@@ -36,7 +36,7 @@
 }
 
 /** Breakpoints **/
-@media (vars.$breakpoint-sm < width <= vars.$breakpoint-md) {
+@media (vars.$breakpoint-sm <= width <= vars.$breakpoint-md) {
   .Clue {
     scroll-margin-top: vars.$grid-size * 2.3;
   }
diff --git a/src/components/Clues/Clues.scss b/src/components/Clues/Clues.scss
index c5bb93e..d11eb02 100644
--- a/src/components/Clues/Clues.scss
+++ b/src/components/Clues/Clues.scss
@@ -33,7 +33,7 @@
   }
 }
 
-@media (vars.$breakpoint-sm < width <= vars.$breakpoint-md) {
+@media (vars.$breakpoint-sm <= width <= vars.$breakpoint-md) {
   .Clues {
     flex-direction: column;
     overflow-y: auto;
@@ -54,7 +54,7 @@
 }
 
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Clues {
     margin-top: vars.$grid-size;
   }
diff --git a/src/components/Crossword/Crossword.scss b/src/components/Crossword/Crossword.scss
index 763c62d..ea102ff 100644
--- a/src/components/Crossword/Crossword.scss
+++ b/src/components/Crossword/Crossword.scss
@@ -16,7 +16,7 @@
   }
 }
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Crossword {
     flex-direction: column;
   }
diff --git a/src/components/Grid/Grid.scss b/src/components/Grid/Grid.scss
index ba1d2a1..d34ddca 100644
--- a/src/components/Grid/Grid.scss
+++ b/src/components/Grid/Grid.scss
@@ -35,7 +35,7 @@
   }
 }
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Grid {
     scroll-margin-top: vars.$grid-size * 5;
   }