[WIP] Правка кода, добавил конфиг календаря

src/pages/schedule/components/ScheduleHeader.vue

@@ -1,54 +1,49 @@
 <template lang="pug">
   .flex.flex-col.gap-y-5
     .flex.justify-center.pl-8.pr-20.font-bold.text-xl Планировщик смен
-    .flex
-      .calendar-header-wrapper.flex.items-center.justify-between.py-3.pl-5.pr-6
-        .flex
-          q-btn.mr-4(
-            text-color="primary",
-            color="secondary"
-            round,
-            size="14px",
-            dense,
-            @click="previousHandler",
-          )
-            q-icon(name="arrow_back_ios", right)
-          q-btn.mr-6(
-            @click="nextHandler",
-            text-color="primary",
-            color="secondary"
-            icon="arrow_forward_ios",
-            round,
-            size="14px",
-            dense,
-          ) 
-          .text.flex.items-center
-            .text.font-medium.text-base {{ dateString }}
-            .opacity-50.font-bold.text-xxs.ml-2(v-if="isCurrentMonth") Текущий
-        .flex.gap-x-4.h-10
-          q-btn(
-            :label="textButton",
-            color="primary",
-            no-caps,
-            padding="8px 24px",
-            style="width: 174px"
-            @click="changeShowTime",
-          )
+    .flex.items-center.justify-between.py-3.pl-5.pr-6.h-14.w-full
+      .flex
+        q-btn.mr-4(
+          text-color="primary",
+          color="secondary"
+          round,
+          size="14px",
+          dense,
+          @click="previousHandler",
+        )
+          q-icon(name="arrow_back_ios", right)
+        q-btn.mr-6(
+          @click="nextHandler",
+          text-color="primary",
+          color="secondary"
+          icon="arrow_forward_ios",
+          round,
+          size="14px",
+          dense,
+        ) 
+        .text.flex.items-center(:style="{color: 'var(--font-dark-blue-color)'}")
+          .text.font-medium.text-base {{ dateString }}
+          .opacity-50.font-bold.text-xxs.ml-2(v-if="isCurrentMonth") Текущий
+      .flex.gap-x-4.h-10
+        q-btn(
+          :label="textButton",
+          color="primary",
+          no-caps,
+          padding="8px 24px",
+          style="width: 174px"
+          @click="changeShowTime",
+        )
 </template>
 
 <script>
 import * as moment from "moment";
-import FormChangeShift from "@/pages/schedule/components/FormChangeShift.vue";
 
 export default {
   name: "ScheduleHeader",
-  components: { FormChangeShift },
   props: {
     showTime: Boolean,
     startMonth: Object,
-    replacementSheet: Object,
     changeShowTime: Function,
-    changeShift: Function,
   },
   data() {
     return {
@@ -87,36 +82,3 @@ export default {
   },
 };
 </script>
-
-<style lang="sass" scoped>
-.calendar-header-wrapper
-  width: 100%
-  background-color: var(--default-white)
-  height: 56px
-  border-radius: 4px
-  z-index: 10
-
-.left-arrow
-  padding: 3px 4px 0 4px !important
-  transform: rotate(90deg)
-
-.right-arrow
-  padding: 3px 4px 0 4px !important
-  transform: rotate(270deg)
-
-.text
-  color: var(--font-dark-blue-color)
-
-.secondary
-  background-color: var(--btn-blue-sec-color)
-  border: 1px solid var(--btn-blue-sec-color)
-  color: var(--btn-blue-color)
-  &:hover
-    background-color: var(--btn-blue-color-hover)
-    border: 1px solid var(--btn-blue-color-hover)
-    color: var(--btn-blue-color)
-  &:disabled, &[disabled]
-    background-color: var(--btn-blue-sec-color)
-    border: 1px solid var(--btn-blue-sec-color)
-    color: var(--btn-blue-color)
-</style>