feat: add desktop ui to calendar

components/TempDesignSystem/Button/button.module.css

@@ -69,19 +69,19 @@ a.default {
 }
 
 /* SIZES */
-.small {
+.btn.small {
   gap: var(--Spacing-x-quarter);
   height: 40px;
   padding: var(--Spacing-x1) var(--Spacing-x2);
 }
 
-.medium {
+.btn.medium {
   gap: var(--Spacing-x-half);
   height: 48px;
   padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
 }
 
-.large {
+.btn.large {
   gap: var(--Spacing-x-half);
   height: 56px;
   padding: var(--Spacing-x2) var(--Spacing-x3);
@@ -170,19 +170,19 @@ a.default {
   fill: var(--Base-Button-Secondary-On-Fill-Disabled);
 }
 
-.baseTertiary {
+.btn.baseTertiary {
   background-color: var(--Base-Button-Tertiary-Fill-Normal);
   color: var(--Base-Button-Tertiary-On-Fill-Normal);
 }
 
-.baseTertiary:active,
-.baseTertiary:focus,
-.baseTertiary:hover {
+.btn.baseTertiary:active,
+.btn.baseTertiary:focus,
+.btn.baseTertiary:hover {
   background-color: var(--Base-Button-Tertiary-Fill-Hover);
   color: var(--Base-Button-Tertiary-On-Fill-Hover);
 }
 
-.baseTertiary:disabled {
+.btn.baseTertiary:disabled {
   background-color: var(--Base-Button-Tertiary-Fill-Disabled);
   color: var(--Base-Button-Tertiary-On-Fill-Disabled);
 }
@@ -800,4 +800,4 @@ a.default {
 .icon.tertiaryLightSecondary:disabled svg,
 .icon.tertiaryLightSecondary:disabled svg * {
   fill: var(--Tertiary-Light-Button-Secondary-On-Fill-Disabled);
-}
+}