WIP Исправлены baseInputs на TheLogin

This commit is contained in:
Daria Golova
2022-12-29 16:31:49 +03:00
parent e138bedfac
commit 78fd2a4233
4 changed files with 21 additions and 25 deletions

View File

@@ -104,7 +104,7 @@ export default {
box-shadow: 1px 1px 8px rgba(37, 40, 80, 0.15)
border-radius: 4px
background-color: white
max-height: 140px
max-height: 142px
overflow-y: auto
.placeholder
color: #090A15

View File

@@ -2,13 +2,14 @@
.flex.flex-col.gap-y-2
.label.font-semibold.text-sm.opacity-40(v-if="label") {{ label }}
.input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
:class="{'border-none': borderNone}"
:class="{'border-none': borderNone, 'border-error': borderError }"
:style="{'background-color': disabled && 'var(--bg-disable-grey-color)'}"
)
input.input.w-full.outline-0.not-italic(
v-model="value",
:placeholder="placeholder",
:disabled="disabled"
:disabled="disabled",
:type="type"
)
.slot(v-if="withIcon", :class="iconPosition")
slot.cursor-pointer
@@ -18,6 +19,9 @@
export default {
name: "BaseInput",
props: {
type: {
derault: "text",
},
modelValue: String,
withIcon: {
default: false,
@@ -27,6 +31,7 @@ export default {
},
placeholder: String,
borderNone: Boolean,
borderError: Boolean,
disabled: Boolean,
label: String,
},
@@ -58,6 +63,8 @@ export default {
height: 40px
.border-none
border: none
.border-error
border-color: var(--border-red-color)
.input
background-color: inherit
&:disabled, &[disabled]

View File

@@ -9,18 +9,16 @@
.text-under.flex.not-italic.font-medium.text-base(
:style="{color: this.underTextColor}") Войдите в аккаунт, чтобы начать пользоваться сервисом «Астра».
.flex.flex-col.gap-y-5
.flex.flex-col.gap-y-6px
.flex.non-italic.font-semibold.text-xss Логин
base-input.h-12.font-medium(
:style="{borderColor: wrongData ? this.redColor : ''}",
v-model="user.username",
type="text",
placeholder="Введите ваш логин"
)
base-input.font-medium(
:borderError="wrongData",
v-model="user.username",
placeholder="Введите ваш логин",
label="Логин"
)
.flex.flex-col.gap-y-6px.relative
.flex.non-italic.font-semibold.text-xss Пароль
base-input.h-12(
:style="{borderColor: wrongData ? this.redColor : ''}",
.flex.non-italic.font-semibold.text-sm.opacity-40 Пароль
base-input(
:borderError="wrongData",
v-model="user.password",
:type="changeType",
placeholder="Введите ваш пароль"

View File

@@ -2,12 +2,8 @@
.wrapper-bar.flex.flex-col.gap-y-4
.flex.px-5.py-5.w-full.justify-around.gap-x-4
.time-wrapper.flex.justify-between
.flex.flex-col.items-center.py-14px.px-4.gap-y-14px
.text.text-smm Начало
base-input-time.select(v-model="times.start_time")
.flex.flex-col.items-center.py-14px.px-4.gap-y-14px
.text.span.text-smm Конец
base-input-time.select(v-model="times.end_time")
base-input-time.py-14px.px-4(v-model="times.start_time", label="Начало")
base-input-time.py-14px.px-4(v-model="times.end_time", label="Конец")
.status-wrapper.flex.flex-col
.flex.justify-center.items-center.h-10
span.font-semibold Статусы
@@ -140,9 +136,4 @@ export default {
.graph-template
width: 218px
height: 40px
.select
height: 40px
border: 1.5px solid var(--border-light-grey-color)
border-radius: 4px
</style>