WIP Изменила сайдбар приложения

src/pages/newCalendar/components/CalendarHeader.vue

@@ -0,0 +1,40 @@
+<template lang="pug">
+  .calendar-header-wrapper.w-full.flex.items-center.justify-between.py-4.pl-4.pr-6
+</template>
+
+<script>
+export default {
+  name: "CalendarHeader",
+};
+</script>
+
+<style lang="sass" scoped>
+.calendar-header-wrapper
+  background-color: var(--default-white)
+  height: 72px
+  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)
+
+.today
+  opacity: 0.5
+
+.bg-blue-grey-1
+  background: var(--bg-light-grey) !important
+
+.q-btn--round
+  width: 32px !important
+  height: 32px !important
+  min-width: 32px !important
+  min-height: 32px !important
+</style>

src/pages/newCalendar/components/CalendarWrapper.vue

@@ -0,0 +1,16 @@
+<template lang="pug">
+  calendar-header.flex-1   
+</template>
+
+<script>
+import CalendarHeader from "@/pages/newCalendar/components/CalendarHeader";
+export default {
+  name: "CalendarWrapper",
+  components: { CalendarHeader },
+  data() {
+    return {};
+  },
+};
+</script>
+
+<style lang="sass" scoped></style>