-
+
Забыли пароль?
diff --git a/src/app/_modules/auth/login/login.component.scss b/src/app/_modules/auth/login/login.component.scss
index 04e37a5..c3b0c6d 100644
--- a/src/app/_modules/auth/login/login.component.scss
+++ b/src/app/_modules/auth/login/login.component.scss
@@ -2,6 +2,9 @@
display: flex;
flex-direction: column;
height: 100%;
+ background-color: #ffffff;
+ border-radius: 8px;
+ font-size: 20px;
form {
display: flex;
flex-direction: column;
@@ -9,23 +12,28 @@
.header {
flex-grow: 0;
border-radius: 24px 24px 0 0;
- padding: 20px 24px;
+ padding: 14px 24px;
display: flex;
flex-direction: row;
align-items: center;
- background-color: #F5F4F4;
- border-bottom: 1px solid #3E3D40;
+ border-bottom: 1px solid #C0C0C0;
h2 {
margin: 0;
- font-weight: 400;
- font-size: 1.5rem;
- line-height: 30px;
- color: #000000;
+ font-family: PT Sans Narrow;
+ font-size: 36px;
+ font-style: normal;
+ font-weight: 700;
+ line-height: 44px; /* 122.222% */
+ letter-spacing: 0.36px;
+ color: var(--dark-1);
}
.close {
width: 24px;
height: 24px;
margin-left: auto;
+ padding: 0;
+ border: none;
+ border-radius: 0;
background: transparent url(/assets/images/icons/close_24dp.svg) 50% 50% no-repeat;
}
}
@@ -35,7 +43,7 @@
flex-grow: 1;
height: 100%;
overflow: auto;
- padding: 20px 24px;
+ padding: 32px 24px;
-webkit-overflow-scrolling: touch;
row-gap: 24px;
.field {
@@ -46,16 +54,27 @@
label {
font-style: normal;
font-weight: 400;
- font-size: 1rem;
+ font-size: 20px;
line-height: normal;
}
- input {
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
- border-radius: 12px;
- border: 1px solid #BFBFBF;
- padding: 10px 16px;
+ input{
+ &:autofill {
+ background: #A1CAE5;
+ }
+
+ &:hover{
+ border-color: #6C6C6C;
+ outline: none;
+ }
+ &:focus, &:focus-visible {
+ border-color: #0070BA;
+ outline: none;
+
+ }
+ &:disabled{
+ border-color: #EDEDED;
+ outline: none;
+ }
}
.eye {
position: absolute;
@@ -101,20 +120,12 @@
.footer {
display: flex;
flex-grow: 0;
- border-top: 1px solid #3E3D40;
- border-radius: 0 0 24px 24px;
- padding: 20px 24px;
+ border-top: 1px solid #C0C0C0;
+ // border-radius: 0 0 24px 24px;
+ padding: 16px 24px;
justify-content: flex-end;
- background-color: #F5F4F4;
gap: 24px;
flex-wrap: wrap;
- .btn {
- font-size: 0.875rem;
- font-style: normal;
- font-weight: 700;
- line-height: 18px;
- letter-spacing: 0.28px;
- }
}
}
}
diff --git a/src/assets/css/forms.scss b/src/assets/css/forms.scss
index c0ecb41..382445a 100644
--- a/src/assets/css/forms.scss
+++ b/src/assets/css/forms.scss
@@ -7,6 +7,7 @@ input, select, textarea {
font-family: "PT Sans";
font-size: 20px;
color: var(--dark-1);
+ background-color: #fff;
&:hover{
border-color: #6C6C6C;
outline: none;
@@ -82,3 +83,58 @@ input, select, textarea {
opacity: 0.5;
}
}
+
+
+
+.checkbox {
+ position: absolute;
+ z-index: -1;
+ opacity: 0;
+}
+
+.checkbox+label {
+ display: inline-flex;
+ align-items: center;
+ user-select: none;
+ font-size: 20px;
+}
+.checkbox+label::before {
+ content: '';
+ display: inline-block;
+ width: 24px;
+ height: 24px;
+ flex-shrink: 0;
+ flex-grow: 0;
+ margin-right: 0.5em;
+ background-repeat: no-repeat;
+ background-position: center center;
+ background-size: 100% 100%;
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_none_base_24dp.svg");
+}
+.checkbox:checked+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_check_base_24dp.svg");
+}
+.checkbox:not(:disabled):not(:checked)+label:hover::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_none_hover_24dp.svg");
+}
+.checkbox:not(:disabled):checked+label:hover::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_check_hover_24dp.svg");
+}
+.checkbox:not(:disabled):checked:active+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_check_active_24dp.svg");
+}
+.checkbox:not(:disabled):not(:checked):active+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_none_active_24dp.svg");
+}
+.checkbox:focus:checked+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_check_hover_24dp.svg");
+}
+.checkbox:focus:not(:checked)+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_none_hover_24dp.svg");
+}
+.checkbox:disabled:checked+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_check_disabled_24dp.svg");
+}
+.checkbox:disabled:not(:checked)+label::before {
+ background-image: url("~/src/assets/images/icons/checkbox/checbox_none_disabled_24dp.svg");
+}
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_check_active_24dp.svg b/src/assets/images/icons/checkbox/checbox_check_active_24dp.svg
new file mode 100644
index 0000000..a252f08
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_check_active_24dp.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_check_base_24dp.svg b/src/assets/images/icons/checkbox/checbox_check_base_24dp.svg
new file mode 100644
index 0000000..bbf02cd
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_check_base_24dp.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_check_disabled_24dp.svg b/src/assets/images/icons/checkbox/checbox_check_disabled_24dp.svg
new file mode 100644
index 0000000..3afd20c
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_check_disabled_24dp.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_check_hover_24dp.svg b/src/assets/images/icons/checkbox/checbox_check_hover_24dp.svg
new file mode 100644
index 0000000..952a6a1
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_check_hover_24dp.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_none_active_24dp.svg b/src/assets/images/icons/checkbox/checbox_none_active_24dp.svg
new file mode 100644
index 0000000..053c201
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_none_active_24dp.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_none_base_24dp.svg b/src/assets/images/icons/checkbox/checbox_none_base_24dp.svg
new file mode 100644
index 0000000..ccddab5
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_none_base_24dp.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_none_disabled_24dp.svg b/src/assets/images/icons/checkbox/checbox_none_disabled_24dp.svg
new file mode 100644
index 0000000..9e5d943
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_none_disabled_24dp.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/src/assets/images/icons/checkbox/checbox_none_hover_24dp.svg b/src/assets/images/icons/checkbox/checbox_none_hover_24dp.svg
new file mode 100644
index 0000000..8fe74f6
--- /dev/null
+++ b/src/assets/images/icons/checkbox/checbox_none_hover_24dp.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file