From 82b7a456764019a63372cc4a421cd00d6aa5a23a Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Thu, 13 Oct 2022 12:54:31 +0300 Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D0=B4=D0=BD=D1=8F=D0=BB=D0=B0=20?= =?UTF-8?q?=D0=B8=D0=BD=D1=84=D0=BE=D1=80=D0=BC=D0=B0=D1=86=D0=B8=D1=8E=20?= =?UTF-8?q?=D0=B8=D0=B7=20LayoutSwitch=20=D0=B4=D0=BE=20=D1=80=D0=BE=D0=B4?= =?UTF-8?q?=D0=B8=D1=82=D0=B5=D0=BB=D1=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/sass/variables.sass | 5 ++--- src/components/HeaderInputs.vue | 14 ++++---------- src/components/TheHeader.vue | 2 +- src/components/base/buttons/BaseAddEvent.vue | 2 +- src/pages/calendar/TheCalendar.vue | 8 ++++++-- .../calendar/components/CalendarFormAddEvent.vue | 2 +- src/pages/calendar/components/CalendarHeader.vue | 5 ++--- .../calendar/components/CalendarLayoutSwitch.vue | 2 +- 8 files changed, 18 insertions(+), 22 deletions(-) diff --git a/src/assets/sass/variables.sass b/src/assets/sass/variables.sass index 4631acd..ab17f61 100644 --- a/src/assets/sass/variables.sass +++ b/src/assets/sass/variables.sass @@ -1,6 +1,5 @@ \:root --bg-lavender-color: #e9e9f6 - --bg-white-color: #f8f8ff --bg-ligth-blue-color: #e6eafc --font-dark-blue-color: #252850 --font-black-color: #090a15 @@ -10,5 +9,5 @@ --border-light-grey-color: #d3d4dc --default-shadow: 4px 4px 8px rgba(9, 10, 21, 0.1), -4px -4px 8px rgba(9, 10, 21, 0.1) --bg-hover-row-table: rgba(215, 217, 255, 0.25) - --default-white: #FFFFFF - --btn-red-color: #FF6F6F + --default-white: #fff + --btn-red-color: #ff6f6f diff --git a/src/components/HeaderInputs.vue b/src/components/HeaderInputs.vue index 6ce9128..ecf0497 100644 --- a/src/components/HeaderInputs.vue +++ b/src/components/HeaderInputs.vue @@ -9,7 +9,7 @@ .option-list.cursor-pointer.flex.flex-row.mb-4(v-for="filter in filters" :key="filter" @click="selectFilter(filter)") .icon-wrapper.mr-2.flex.justify-center .icon-ok.text-xs.flex.justify-center.items-center(v-if="filter === selectedFilter") - .options-text {{ filter }} + .flex.items-center {{ filter }} input.custom-input.search-input.inline-block.box-border.align-middle.px-4(class="py-2.5" placeholder="Искать ...") @@ -41,10 +41,8 @@ export default { .arrow transform: rotate(180deg) -.wrapper - background-color: var(--bg-white-color) - display: flex - align-items: center +.header-inputs-wrapper + background-color: var(--default-white) .select-container border-radius: 4px 0 0 4px @@ -71,7 +69,7 @@ export default { .options-wrapper width: 172px - background-color: var(--bg-white-color) + background-color: var(--default-white) color: var(--font-dark-blue-color) border-radius: 4px position: absolute @@ -89,10 +87,6 @@ export default { &:hover color: var(--btn-blue-color) -.options-text - display: flex - align-items: center - .arrow color: var(--btn-blue-color) diff --git a/src/components/TheHeader.vue b/src/components/TheHeader.vue index e1e849e..4e7ea63 100644 --- a/src/components/TheHeader.vue +++ b/src/components/TheHeader.vue @@ -35,7 +35,7 @@ export default { .header-wrapper width: 100% - background-color: var(--bg-white-color) + background-color: var(--default-white) position: relative z-index: 2 diff --git a/src/components/base/buttons/BaseAddEvent.vue b/src/components/base/buttons/BaseAddEvent.vue index 1243148..26dcd16 100644 --- a/src/components/base/buttons/BaseAddEvent.vue +++ b/src/components/base/buttons/BaseAddEvent.vue @@ -14,7 +14,7 @@ export default { border: none cursor: pointer width: fit-content - color: var(--bg-white-color) + color: var(--default-white) background-color: var(--btn-blue-color) border-radius: 4px diff --git a/src/pages/calendar/TheCalendar.vue b/src/pages/calendar/TheCalendar.vue index 1c2d8e5..746589f 100644 --- a/src/pages/calendar/TheCalendar.vue +++ b/src/pages/calendar/TheCalendar.vue @@ -2,7 +2,8 @@ calendar-header( :currentDay="currentDate" @previous-date="switchPreviousDate" - @next-date="switchNextDate") + @next-date="switchNextDate" + @selectedLayout="changeCalendarLayout") -, diff --git a/src/pages/calendar/components/CalendarFormAddEvent.vue b/src/pages/calendar/components/CalendarFormAddEvent.vue index 909e55a..e624a7f 100644 --- a/src/pages/calendar/components/CalendarFormAddEvent.vue +++ b/src/pages/calendar/components/CalendarFormAddEvent.vue @@ -131,7 +131,7 @@ export default { .event-form height: fit-content min-width: 448px - background-color: var(--bg-white-color) + background-color: var(--default-white) box-shadow: -4px -4px 16px rgba(9, 10, 21, 0.25), 4px 4px 16px rgba(9, 10, 21, 0.25) border-radius: 4px .form-item diff --git a/src/pages/calendar/components/CalendarHeader.vue b/src/pages/calendar/components/CalendarHeader.vue index 96f7d25..0ce8935 100644 --- a/src/pages/calendar/components/CalendarHeader.vue +++ b/src/pages/calendar/components/CalendarHeader.vue @@ -22,7 +22,6 @@ export default { data() { return { isToday: true, - selectedLayout: "", }; }, computed: { @@ -39,7 +38,7 @@ export default { }, methods: { changeSelectedLayout(option) { - this.selectedLayout = option; + this.$emit("selectedLayout", option); }, previousHandler() { this.$emit("previous-date"); @@ -60,7 +59,7 @@ export default {