add better solution

mate-academy · Nov 30, 2024 · fcd3a1c · fcd3a1c
1 parent 8469d0c
commit fcd3a1c
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 13 deletions.
diff --git a/src/index.html b/src/index.html
@@ -9,11 +9,11 @@
     <title>Calendar</title>
     <link
       rel="stylesheet"
-      href="./styles/blocks/index.scss"
+      href="./styles/main.scss"
     />
   </head>
   <body>
-    <div class="calendar">
+    <div class="calendar calendar--start-day-sun calendar--month-length-31">
       <div class="calendar__day"></div>
       <div class="calendar__day"></div>
       <div class="calendar__day"></div>

diff --git a/src/styles/blocks/index.scss → src/styles/main.scss b/src/styles/blocks/index.scss → src/styles/main.scss
@@ -1,4 +1,4 @@
-@import '../utils/variables';
+@import './utils/variables';
 
 body {
   margin: 0;
@@ -55,5 +55,11 @@ body {
         display: none;
       }
     }
+
+    @for $i from 28 through 31 {
+      .calendar--month-length-#{$i} .calendar__day:nth-child(n + #{$i + 1}) {
+        display: none;
+      }
+    }
   }
 }
diff --git a/src/styles/utils/variables.scss b/src/styles/utils/variables.scss
@@ -2,15 +2,14 @@ $col-count: 7;
 $gap: 1;
 $cell-width: 100;
 $cell-height: 100;
-/* stylelint-disable */
-$days-of-week:
-  'mon' 0,
-  'tue' 1,
-  'wed' 2,
-  'thu' 3,
-  'fri' 4,
-  'sat' 5,
-  'sun' 6;
-/* stylelint-enable */
+$days-of-week: (
+  'mon': 0,
+  'tue': 1,
+  'wed': 2,
+  'thu': 3,
+  'fri': 4,
+  'sat': 5,
+  'sun': 6,
+);
 $month-length: 31;
 $current-day: 'sun';