[WIP] Добавил сайдбар на странице календаря

src/pages/newCalendar/components/CalendarSidebar.vue

@@ -0,0 +1,47 @@
+<template lang="pug">
+  .flex.flex-col.gap-y-1
+    .button.flex.rounded-t
+      q-btn(
+        @click="openSidebar",
+        dense,
+        padding="8px",
+        style="color: var(--font-grey-color); background: var(--bg-light-grey)"
+      )
+        img(:src="arrow")
+    .button.flex      
+      q-btn(color="primary", dense, padding="14px")
+        q-icon(name="app:icon-plus", size="12px")
+    .button.flex
+      q-btn(dense, style="color: var(--font-grey-color)", padding="0px")
+        img(:src="round")
+    .button.flex
+      q-btn(dense, style="color: var(--font-grey-color)", padding="0px")
+        img(:src="medcard")
+    .button.flex.rounded-b
+      q-btn(dense, style="color: var(--font-grey-color)", padding="6.5px 3.5px")
+        img(:src="group")
+</template>
+
+<script>
+import arrow from "@/assets/icons/double_left_arrow.svg";
+import group from "@/assets/icons/person_group.svg";
+import medcard from "@/assets/icons/medcard.svg";
+import round from "@/assets/icons/status_round.svg";
+
+export default {
+  name: "CalendarSidebar",
+  props: { openSidebar: Function },
+  data() {
+    return { arrow, group, medcard, round };
+  },
+};
+</script>
+
+<style lang="sass" scoped>
+.button
+  width: 72px
+  height: 72px
+  background: var(--default-white)
+  align-items: center
+  justify-content: center
+</style>