variables seperate

mate-academy · Dec 23, 2024 · ef58e8e · ef58e8e
1 parent 1f56a2c
commit ef58e8e
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
@@ -0,0 +1,3 @@
+$week: (mon 0, tue 1, wed 2, thu 3, fri 4, sat 5, sun 6);
+$day-size: 100px;
+$gap-size: 1px;
diff --git a/src/styles/index.scss b/src/styles/index.scss
@@ -1,5 +1,4 @@
-$week: (mon 0, tue 1, wed 2, thu 3, fri 4, sat 5, sun 6);
-$day-size: 100px;
+@use './variables' as *;
 
 body {
   margin: 0;
@@ -14,13 +13,13 @@ body {
   box-sizing: border-box;
   display: flex;
   flex-wrap: wrap;
+  gap: $gap-size;
   width: 726px;
   padding: 10px;
-  gap: 1px;
 
   @each $day, $index in $week {
     &--start-day-#{$day} .calendar__day:first-child {
-      margin-left: ($day-size + 1px) * $index;
+      margin-left: ($day-size + $gap-size) * $index;
     }
   }