fix more

Author: iernie

src/pages/Calendar/Calendar.module.css

@@ -1,3 +1,7 @@
+:root {
+  --grid-column-start: 0;
+}
+
 .calendar {
 }
 
@@ -17,9 +21,9 @@
   justify-content: center;
 }
 
-@media only screen and (max-width: 824px) {
+@media only screen and (min-width: 824px) {
   .firstday {
-    grid-column-start: none !important;
+    grid-column-start: var(--grid-column-start);
   }
 }
 

src/pages/Calendar/Calendar.tsx

@@ -86,13 +86,15 @@ const Calendar: React.FC = () => {
             );
           }
 
+          const css = {
+            "--grid-column-start": firstDayOfTheMonth,
+          } as React.CSSProperties;
+
           return (
             <div
               key={day + 1}
               className={dayClass}
-              style={{
-                gridColumnStart: day === 0 ? firstDayOfTheMonth : undefined,
-              }}
+              style={day === 0 ? css : undefined}
             >
               {winner && (
                 <div className={styles.avatar}>