diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.html b/src/app/components/login/loading-dialog/loading-dialog.component.html new file mode 100644 index 0000000..4b6fb65 --- /dev/null +++ b/src/app/components/login/loading-dialog/loading-dialog.component.html @@ -0,0 +1,13 @@ +@if (sharedService.isBtnDisabled) { +
+
+
+

+ {{ "login.loginDialog0" | translate }} +

+

+ {{ "login.loginDialog1" | translate }} +

+
+
+} diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.scss b/src/app/components/login/loading-dialog/loading-dialog.component.scss new file mode 100644 index 0000000..25a04de --- /dev/null +++ b/src/app/components/login/loading-dialog/loading-dialog.component.scss @@ -0,0 +1,49 @@ +.loading-dialog { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + width: 100vw; + height: 100vh; + backdrop-filter: blur(5px); + background-color: rgba($color: #000, $alpha: 0.2); + display: flex; + justify-content: center; + align-items: center; + z-index: 999; +} + +.loader { + position: fixed; + border: 16px solid var(--white); + border-top: 16px solid var(--light-blue); + border-radius: 50%; + width: 50px; + height: 50px; + animation: spin 2s linear infinite; + margin: auto; + margin-top: 20px; +} + +.loading-text { + position: fixed; + text-align: center; + margin-top: 200px; + color: var(--white); + text-shadow: 3px 3px 3px var(--black); + p { + font-size: 21px; + font-weight: 400px; + margin-bottom: 6px; + } +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts b/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts new file mode 100644 index 0000000..eb04690 --- /dev/null +++ b/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { LoadingDialogComponent } from './loading-dialog.component'; + +describe('LoadingDialogComponent', () => { + let component: LoadingDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [LoadingDialogComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(LoadingDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.ts b/src/app/components/login/loading-dialog/loading-dialog.component.ts new file mode 100644 index 0000000..bc45acb --- /dev/null +++ b/src/app/components/login/loading-dialog/loading-dialog.component.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; +import { SharedService } from '../../../services/shared.service'; +import { TranslateModule } from '@ngx-translate/core'; + +@Component({ + selector: 'app-loading-dialog', + standalone: true, + imports: [TranslateModule], + templateUrl: './loading-dialog.component.html', + styleUrl: './loading-dialog.component.scss', +}) +export class LoadingDialogComponent { + constructor(public sharedService: SharedService) {} +} diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index 9995a57..0a1bcba 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -108,16 +108,4 @@ -@if (sharedService.isBtnDisabled) { -
-
-
-

- {{ "login.loginDialog0" | translate }} -

-

- {{ "login.loginDialog1" | translate }} -

-
-
-} + diff --git a/src/app/components/login/login.component.scss b/src/app/components/login/login.component.scss index d53e286..9995e06 100644 --- a/src/app/components/login/login.component.scss +++ b/src/app/components/login/login.component.scss @@ -87,58 +87,6 @@ section { padding: 12px 0; } -/*------------- LOADER -------------*/ - -.loading-dialog { - position: fixed; - top: 0; - bottom: 0; - left: 0; - right: 0; - width: 100vw; - height: 100vh; - backdrop-filter: blur(5px); - background-color: rgba($color: #000, $alpha: 0.2); - display: flex; - justify-content: center; - align-items: center; - z-index: 999; -} - -.loader { - position: fixed; - border: 16px solid var(--white); - border-top: 16px solid var(--light-blue); - border-radius: 50%; - width: 50px; - height: 50px; - animation: spin 2s linear infinite; - margin: auto; - margin-top: 20px; -} - -.loading-text { - position: fixed; - text-align: center; - margin-top: 200px; - color: var(--white); - text-shadow: 3px 3px 3px var(--black); - p { - font-size: 21px; - font-weight: 400px; - margin-bottom: 6px; - } -} - -@keyframes spin { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } -} - /*------------- RESPONSIVE -------------*/ @media (max-height: 800px) { diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index 8aa1bfa..e494cb3 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -9,6 +9,7 @@ import { SharedService } from '../../services/shared.service'; import { FooterComponent } from './footer/footer.component'; import { HeaderComponent } from './header/header.component'; import { TranslateModule } from '@ngx-translate/core'; +import { LoadingDialogComponent } from './loading-dialog/loading-dialog.component'; @Component({ selector: 'app-login', @@ -20,6 +21,7 @@ import { TranslateModule } from '@ngx-translate/core'; FooterComponent, HeaderComponent, TranslateModule, + LoadingDialogComponent, ], templateUrl: './login.component.html', styleUrl: './login.component.scss', diff --git a/src/app/components/login/register/register.component.html b/src/app/components/login/register/register.component.html index 16d5e50..792db0f 100644 --- a/src/app/components/login/register/register.component.html +++ b/src/app/components/login/register/register.component.html @@ -170,6 +170,7 @@ !registerData.mail || password.invalid || !registerData.password || + !checkbox.valid || sharedService.isBtnDisabled || registerData.password.length < 6 || registerData.password !== registerData.passwordConfirm || @@ -181,3 +182,4 @@ + diff --git a/src/app/components/login/register/register.component.ts b/src/app/components/login/register/register.component.ts index 6b94882..9f07f1e 100644 --- a/src/app/components/login/register/register.component.ts +++ b/src/app/components/login/register/register.component.ts @@ -10,6 +10,7 @@ import { SharedService } from '../../../services/shared.service'; import { BtnBackComponent } from '../../../shared/components/buttons/btn-back/btn-back.component'; import { RouterModule } from '@angular/router'; import { TranslateModule, TranslateService } from '@ngx-translate/core'; +import { LoadingDialogComponent } from '../loading-dialog/loading-dialog.component'; @Component({ selector: 'app-register', @@ -23,6 +24,7 @@ import { TranslateModule, TranslateService } from '@ngx-translate/core'; CommonModule, RouterModule, TranslateModule, + LoadingDialogComponent, ], templateUrl: './register.component.html', styleUrl: './register.component.scss',