From 6f52baf6430b8a792a56c8a606ef7f5eedabaff2 Mon Sep 17 00:00:00 2001 From: Boris Voropaev Date: Tue, 12 Dec 2023 10:35:31 +0300 Subject: [PATCH] modal logi --- .../auth/auth-modal/auth-modal.component.html | 2 + .../auth-modal/auth-modal.component.spec.ts | 23 --- .../auth/auth-modal/auth-modal.component.ts | 1 - src/app/_modules/auth/auth.module.ts | 4 +- .../auth-form-password-forget.component.ts | 2 +- .../_modules/auth/forms/forms.component.scss | 88 ----------- .../login/auth-form-login.component.html | 9 +- .../forms/login/auth-form-login.component.ts | 2 +- .../auth-form-password-reset.component.html | 1 - .../auth-form-password-reset.component.ts | 2 +- .../signup/auth-form-signup.component.html | 1 - .../signup/auth-form-signup.component.ts | 2 +- .../auth/page/auth-page.component.html | 12 +- .../auth/page/auth-page.component.scss | 46 ------ src/vniigaz-v2/css/_forms.scss | 142 ++++++++++++++++++ 15 files changed, 162 insertions(+), 175 deletions(-) delete mode 100644 src/app/_modules/auth/auth-modal/auth-modal.component.spec.ts delete mode 100644 src/app/_modules/auth/forms/forms.component.scss diff --git a/src/app/_modules/auth/auth-modal/auth-modal.component.html b/src/app/_modules/auth/auth-modal/auth-modal.component.html index 5ceb3c0..1507c29 100644 --- a/src/app/_modules/auth/auth-modal/auth-modal.component.html +++ b/src/app/_modules/auth/auth-modal/auth-modal.component.html @@ -1,7 +1,9 @@

Вход в систему

+

Регистрация

Восстановление пароля

+

Сброс пароля

diff --git a/src/app/_modules/auth/auth-modal/auth-modal.component.spec.ts b/src/app/_modules/auth/auth-modal/auth-modal.component.spec.ts deleted file mode 100644 index 0ad439c..0000000 --- a/src/app/_modules/auth/auth-modal/auth-modal.component.spec.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { AuthModalComponent } from './auth-modal.component'; - -describe('AuthModalComponent', () => { - let component: AuthModalComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ AuthModalComponent ] - }) - .compileComponents(); - - fixture = TestBed.createComponent(AuthModalComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/_modules/auth/auth-modal/auth-modal.component.ts b/src/app/_modules/auth/auth-modal/auth-modal.component.ts index fdd60dd..da9c4e1 100644 --- a/src/app/_modules/auth/auth-modal/auth-modal.component.ts +++ b/src/app/_modules/auth/auth-modal/auth-modal.component.ts @@ -19,7 +19,6 @@ export class AuthModalComponent { } close() { - console.log('CLS') this.router.navigate([{outlets: {auth: null}}]).then(); } } diff --git a/src/app/_modules/auth/auth.module.ts b/src/app/_modules/auth/auth.module.ts index 052f32a..fa7bf50 100644 --- a/src/app/_modules/auth/auth.module.ts +++ b/src/app/_modules/auth/auth.module.ts @@ -17,8 +17,10 @@ const routes = [ {path: 'login', component: AuthModalComponent, canActivate: [NotAuthGuard], outlet: 'auth'}, {path: 'signup', component: AuthPageComponent, canActivate: [NotAuthGuard]}, {path: 'signup', component: AuthModalComponent, canActivate: [NotAuthGuard], outlet: 'auth'}, + {path: 'password/forget', component: AuthPageComponent, canActivate: [NotAuthGuard]}, {path: 'password/forget', component: AuthModalComponent, canActivate: [NotAuthGuard], outlet: 'auth'}, - {path: 'password/reset/:token/:email', component: AuthPageComponent, canActivate: [NotAuthGuard]} + {path: 'password/reset/:token/:email', component: AuthPageComponent, canActivate: [NotAuthGuard]}, + {path: 'password/reset/:token/:email', component: AuthPageComponent, canActivate: [NotAuthGuard], outlet: 'auth'} ]; @NgModule({ diff --git a/src/app/_modules/auth/forms/forget/auth-form-password-forget.component.ts b/src/app/_modules/auth/forms/forget/auth-form-password-forget.component.ts index fddffcc..e4d455e 100644 --- a/src/app/_modules/auth/forms/forget/auth-form-password-forget.component.ts +++ b/src/app/_modules/auth/forms/forget/auth-form-password-forget.component.ts @@ -7,7 +7,7 @@ import {AuthenticationService} from '@app/_services'; @Component({ selector: 'auth-form-password-forget', templateUrl: 'auth-form-password-forget.component.html', - styleUrls: ['auth-form-password-forget.component.scss', '../forms.component.scss'] + styleUrls: ['auth-form-password-forget.component.scss'] }) export class AuthFormPasswordForgetComponent implements OnInit { form: FormGroup; diff --git a/src/app/_modules/auth/forms/forms.component.scss b/src/app/_modules/auth/forms/forms.component.scss deleted file mode 100644 index e679a30..0000000 --- a/src/app/_modules/auth/forms/forms.component.scss +++ /dev/null @@ -1,88 +0,0 @@ -h2 { - margin: 0 0 24px; - font-size: 24px; - font-weight: normal; -} - -.field { - margin: 0 0 16px; - - label { - font-size: 14px; - color: #666666; - line-height: 20px; - } - - .checkbox { - display: flex; - flex-direction: row; - gap: 12px; - margin: 0 0 12px; - &:last-child {margin: 0;} - label { - font-size: 0.875rem; - color: #86898E; - a { - color: #F9B417; - } - } - input { - flex-shrink: 0; - width: 20px; - height: 20px; - margin: 0; - padding: 0; - } - } -} - -.error { - margin: 0 0 16px; - font-size: 14px; - color: #D91519; - text-align: center; -} - -.bar { - display: flex; - flex-direction: row; - align-items: center; - width: 100%; - flex-wrap: wrap; - row-gap: 18px; - .remember { - display: flex; - flex-direction: row; - align-items: center; - input { - width: 16px; - height: 16px; - margin-right: 8px; - border-radius: 2px; - border: 1px solid #86898E; - } - } - .forget { - margin-left: auto; - cursor: pointer; - } -} - -.bottom { - display: flex; - flex-direction: row; - align-items: center; - justify-content: flex-end; - gap: 24px; - margin: 24px 0 0; -} - - -@media screen and (max-width: 600px) { - .bottom { - flex-direction: column-reverse; - button { - width: 100%; - } - } -} diff --git a/src/app/_modules/auth/forms/login/auth-form-login.component.html b/src/app/_modules/auth/forms/login/auth-form-login.component.html index a1e3929..b547a78 100644 --- a/src/app/_modules/auth/forms/login/auth-form-login.component.html +++ b/src/app/_modules/auth/forms/login/auth-form-login.component.html @@ -1,5 +1,4 @@ -
- +
@@ -14,8 +13,10 @@
- Забыли пароль? - Регистрация +
diff --git a/src/app/_modules/auth/forms/login/auth-form-login.component.ts b/src/app/_modules/auth/forms/login/auth-form-login.component.ts index d9c8259..329dfbf 100644 --- a/src/app/_modules/auth/forms/login/auth-form-login.component.ts +++ b/src/app/_modules/auth/forms/login/auth-form-login.component.ts @@ -6,7 +6,7 @@ import {AuthenticationService} from '@app/_services'; @Component({ selector: 'auth-form-login', templateUrl: 'auth-form-login.component.html', - styleUrls: ['auth-form-login.component.scss', '../forms.component.scss'] + styleUrls: ['auth-form-login.component.scss'] }) export class AuthFormLoginComponent implements OnInit { form: FormGroup; diff --git a/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.html b/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.html index fa9df5d..cbc897f 100644 --- a/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.html +++ b/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.html @@ -1,5 +1,4 @@ -

Сброс пароля

diff --git a/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.ts b/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.ts index 8a1b15a..dd27d91 100644 --- a/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.ts +++ b/src/app/_modules/auth/forms/reset/auth-form-password-reset.component.ts @@ -7,7 +7,7 @@ import {AuthenticationService} from '@app/_services'; @Component({ selector: 'auth-form-password-reset', templateUrl: 'auth-form-password-reset.component.html', - styleUrls: ['auth-form-password-reset.component.scss', '../forms.component.scss'] + styleUrls: ['auth-form-password-reset.component.scss'] }) export class AuthFormPasswordResetComponent implements OnInit { form: FormGroup; diff --git a/src/app/_modules/auth/forms/signup/auth-form-signup.component.html b/src/app/_modules/auth/forms/signup/auth-form-signup.component.html index ae91070..987bb58 100644 --- a/src/app/_modules/auth/forms/signup/auth-form-signup.component.html +++ b/src/app/_modules/auth/forms/signup/auth-form-signup.component.html @@ -1,5 +1,4 @@ -

Регистрация

diff --git a/src/app/_modules/auth/forms/signup/auth-form-signup.component.ts b/src/app/_modules/auth/forms/signup/auth-form-signup.component.ts index 1dc3518..e75f668 100644 --- a/src/app/_modules/auth/forms/signup/auth-form-signup.component.ts +++ b/src/app/_modules/auth/forms/signup/auth-form-signup.component.ts @@ -8,7 +8,7 @@ import {Subscription} from "rxjs"; @Component({ selector: 'auth-form-signup', templateUrl: 'auth-form-signup.component.html', - styleUrls: ['auth-form-signup.component.scss', '../forms.component.scss'] + styleUrls: ['auth-form-signup.component.scss'] }) export class AuthFormSignupComponent implements OnInit { form: FormGroup; diff --git a/src/app/_modules/auth/page/auth-page.component.html b/src/app/_modules/auth/page/auth-page.component.html index 29fd514..075be0c 100644 --- a/src/app/_modules/auth/page/auth-page.component.html +++ b/src/app/_modules/auth/page/auth-page.component.html @@ -1,12 +1,12 @@
-
+
+

Вход в систему

+

Регистрация

+

Восстановление пароля

+

Сброс пароля

+
diff --git a/src/app/_modules/auth/page/auth-page.component.scss b/src/app/_modules/auth/page/auth-page.component.scss index c2f73c9..e69de29 100644 --- a/src/app/_modules/auth/page/auth-page.component.scss +++ b/src/app/_modules/auth/page/auth-page.component.scss @@ -1,46 +0,0 @@ -.authentication { - display: flex; - flex-direction: row; - width: 100%; - height: 100vh; - .logo { - display: flex; - width: 50%; - flex-shrink: 0; - height: 100%; - border-right: #E0E0E0 solid 1px; - text-align: center; - color: #0071BB; - } - - .form { - display: flex; - flex-grow: 1; - padding: 24px; - } - - .center { - width: 100%; - max-width: 416px; - margin: auto; - } -} - - -@media screen and (max-width: 959px) { - .authentication { - flex-direction: column; - justify-content: center; - .logo { - width: 100%; - height: auto; - border-right: none; - } - .form { - flex-grow: 0; - } - ::ng-deep h2 { - text-align: center; - } - } -} diff --git a/src/vniigaz-v2/css/_forms.scss b/src/vniigaz-v2/css/_forms.scss index 136669b..c4abcad 100644 --- a/src/vniigaz-v2/css/_forms.scss +++ b/src/vniigaz-v2/css/_forms.scss @@ -293,4 +293,146 @@ form-field-document{ margin: 0 0 16px; } } +} + +auth-page{ + .authentication { + display: flex; + flex-direction: row; + .logo { + display: flex; + width: 50%; + flex-shrink: 0; + height: 100%; + border-right: #E0E0E0 solid 1px; + text-align: center; + color: #0071BB; + } + + .form { + display: flex; + flex-grow: 1; + padding: 24px; + } + + .center { + width: 100%; + max-width: 416px; + margin: auto; + } + } + + + @media screen and (max-width: 959px) { + .authentication { + flex-direction: column; + justify-content: center; + .logo { + width: 100%; + height: auto; + border-right: none; + } + .form { + flex-grow: 0; + } + ::ng-deep h2 { + text-align: center; + } + } + } + +} + +auth-page, auth-modal{ + h2 { + margin: 0 0 24px; + font-size: 24px; + font-weight: normal; + } + + .field { + margin: 0 0 16px; + + label { + font-size: 14px; + color: #666666; + line-height: 20px; + } + + .checkbox { + display: flex; + flex-direction: row; + gap: 12px; + margin: 0 0 12px; + &:last-child {margin: 0;} + label { + font-size: 0.875rem; + color: #86898E; + a { + color: #F9B417; + } + } + input { + flex-shrink: 0; + width: 20px; + height: 20px; + margin: 0; + padding: 0; + } + } + } + + .error { + margin: 0 0 16px; + font-size: 14px; + color: #D91519; + text-align: center; + } + + .bar { + display: flex; + flex-direction: row; + align-items: center; + width: 100%; + flex-wrap: wrap; + row-gap: 18px; + .remember { + display: flex; + flex-direction: row; + align-items: center; + input { + width: 16px; + height: 16px; + margin-right: 8px; + border-radius: 2px; + border: 1px solid #86898E; + } + } + .forget { + cursor: pointer; + display: flex; + justify-content: space-between; + flex-basis: 100%; + } + } + + .bottom { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-end; + gap: 24px; + margin: 24px 0 0; + } + + + @media screen and (max-width: 600px) { + .bottom { + flex-direction: column-reverse; + button { + width: 100%; + } + } + } + } \ No newline at end of file