diff --git a/src/assets/sass/variables.sass b/src/assets/sass/variables.sass
index 3ff0f4a..dee537e 100644
--- a/src/assets/sass/variables.sass
+++ b/src/assets/sass/variables.sass
@@ -28,3 +28,4 @@
--btn-green-color: rgba(60, 217, 75, 1)
--btn-light-green-color: rgba(60, 217, 75, 0.2)
--border-light-grey-color-1: rgba(211, 212, 220, 0.5)
+ --bg-white-color-0: rgba(255, 255, 255, 0.3)
diff --git a/src/components/base/BaseInput.vue b/src/components/base/BaseInput.vue
index ededb78..0825780 100644
--- a/src/components/base/BaseInput.vue
+++ b/src/components/base/BaseInput.vue
@@ -1,6 +1,6 @@
.input-wrapper.flex.gap-x-2.px-4.box-border(class="py-2.5" :style="{ minWidth: widthInput + 'px' }")
- input.w-full.outline-0.text-base.not-italic(:style="{ backgroundColor: backgroundInput, fontSize: fontSizeInput }" :value="value" :type="type" @input="$emit('update:value', $event.target.value)" :placeholder="placeholder" :maxlength="maxLength")
+ input.w-full.outline-0.text-base.not-italic(:value="value" :type="type" @input="$emit('update:value', $event.target.value)" :placeholder="placeholder" :maxlength="maxLength")
.slot(v-if="withIcon" :class="iconPosition")
slot.cursor-pointer
@@ -24,8 +24,6 @@ export default {
default: "Поиск",
},
widthInput: Number,
- backgroundInput: String,
- fontSizeInput: String,
},
};
diff --git a/src/components/base/buttons/BaseCreateButton.vue b/src/components/base/buttons/BaseCreateButton.vue
index e68ddd2..5e671ac 100644
--- a/src/components/base/buttons/BaseCreateButton.vue
+++ b/src/components/base/buttons/BaseCreateButton.vue
@@ -1,8 +1,8 @@
button.button.flex.w-fit.gap-x-2.text-base.pt-3.pb-2.px-6
- .flex.text-xs.w-fit.pt-1(v-if="withIcon")
- span.icon-plus
- span.text-base.font-semibold {{text}}
+ .flex.text-xs.w-fit.pt-1(v-if="withIcon" :class="iconPosition")
+ span.icon-plus(:style="{fontSize:iconSize + 'px'}")
+ span.text-base.font-semibold(:class="textStyled") {{text}}
@@ -30,4 +39,16 @@ export default {
&:active
opacity: 1
background-color: var(--font-dark-blue-color)
+.left
+ order: -1
+.right
+ order: 1
+ padding-top: 1px
+ border-left: 1px solid var(--bg-white-color-0)
+ padding-left: 14px
+ height: 24px
+ align-items: center
+.createEvent
+ font-weight: 500
+ padding-right: 2px
diff --git a/src/pages/calendar/components/CalendarSidebar.vue b/src/pages/calendar/components/CalendarSidebar.vue
index 31de909..6a70318 100644
--- a/src/pages/calendar/components/CalendarSidebar.vue
+++ b/src/pages/calendar/components/CalendarSidebar.vue
@@ -4,7 +4,7 @@
.sidebar-content.items-center.flex.flex-col.gap-y-8.px-4.py-19px
base-button-plus(:size="40" v-if="!isOpen")
.create-event.flex.items-center.justify-center(v-else)
- base-create-button.font-medium.pl-15px.py-10.5px(text="Создать событие" :withIcon="true")
+ base-create-button.pl-15px.pb-2.pr-3.pt-2.items-center.h-10(text-styled="createEvent" :icon-size="10" text="Создать событие" :with-icon="true" icon-position="right")
.flex.flex-col.items-center(v-if="!isOpen")
base-button-plus(:class="buttonStyled" :size="24" :icon-size="10")
.flex.flex-col.gap-y-2.items-center.mt-4
@@ -15,8 +15,8 @@
.flex {{ "Виды событий" }}
base-button-plus(:class="buttonStyled" :size="24" :icon-size="10")
.flex.flex-col.gap-y-2
- .relative.flex.items-center.gap-x-3(v-for="event in events")
- base-input.py-2.pl-6(:placeholder="event.name" :key="event.id" :backgroundInput="red" background-input="transparent" font-size-input="12px")
+ .relative.flex.items-center.gap-x-3.h-8(v-for="event in events")
+ input.custom-input.py-2.pl-6.h-full.not-italic.font-medium.text-xxs(:placeholder="event.name" :key="event.id")
.event-type(:style="{ background: event.color }")
span.icon-edit.cursor-pointer
.flex.flex-col.items-center.gap-y-2.justify-center(v-if="!isOpen")
@@ -28,11 +28,11 @@
.flex {{ "Команды" }}
base-button-plus(:class="buttonStyled" :size="24" :icon-size="10")
.box-team.flex.flex-col.gap-y-2
- .team-card.flex.items-center.justify-between(v-for="teammate in team" :key="teammate.id")
+ .team-card.flex.items-center.justify-between.cursor-pointer(v-for="teammate in team" :key="teammate.id")
.flex.items-center
img.avatar-wrapper(:src="teammate.avatar" alt="Team member")
.flex.ml-2.not-italic.font-medium.text-xxs {{ changeLastName(teammate.last_name) + changeInitials(teammate.first_name, teammate.patronymic) }}
- .span.icon-change-place.cursor-pointer
+ span.icon-change-place.cursor-pointer.w-5
base-open-button.mt-148px(@click="changeSize" :style="{ transform: `rotate(${turnButton})` }")
@@ -40,14 +40,12 @@
import BaseButtonPlus from "../../../components/base/buttons/BaseButtonPlus.vue";
import BaseOpenButton from "../../../components/base/buttons/BaseOpenButton.vue";
import BaseCreateButton from "../../../components/base/buttons/BaseCreateButton.vue";
-import BaseInput from "../../../components/base/BaseInput.vue";
export default {
name: "CalendarSidebar",
components: {
BaseButtonPlus,
BaseOpenButton,
BaseCreateButton,
- BaseInput,
},
props: {
team: Array,
@@ -113,30 +111,37 @@ export default {