Skip to content

Commit ec63426

Browse files
committed
💄 add header auth
1 parent ac3cd9a commit ec63426

18 files changed

+233
-86
lines changed

src/app/auth/auth.component.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<div class="auth-wrapper">
2+
<app-header-auth></app-header-auth>
3+
<router-outlet></router-outlet>
4+
</div>

src/app/auth/auth.component.scss

Whitespace-only changes.

src/app/auth/auth.component.spec.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { AuthComponent } from './auth.component';
4+
5+
describe('AuthComponent', () => {
6+
let component: AuthComponent;
7+
let fixture: ComponentFixture<AuthComponent>;
8+
9+
beforeEach(async () => {
10+
await TestBed.configureTestingModule({
11+
declarations: [ AuthComponent ]
12+
})
13+
.compileComponents();
14+
});
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(AuthComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});

src/app/auth/auth.component.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-auth',
5+
templateUrl: './auth.component.html',
6+
styleUrls: ['./auth.component.scss']
7+
})
8+
export class AuthComponent { }

src/app/auth/auth.module.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,24 @@ import { CommonModule } from '@angular/common';
22
import { NgModule } from '@angular/core';
33
import { RouterModule } from '@angular/router';
44

5+
import { ComponentsModule as CoreComponentsModule } from '@components/components.module';
6+
7+
import { AuthComponent } from './auth.component';
58
import { ComponentsModule } from './components/components.module';
69
import { LoginComponent } from './login/login.component';
710
import { RegisterComponent } from './register/register.component';
811

912
@NgModule({
1013
declarations: [
1114
LoginComponent,
12-
RegisterComponent
15+
RegisterComponent,
16+
AuthComponent
1317
],
1418
imports: [
1519
CommonModule,
1620
RouterModule,
17-
ComponentsModule
21+
ComponentsModule,
22+
CoreComponentsModule
1823
]
1924
})
2025
export class AuthModule { }

src/app/auth/auth.routing.ts

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,25 @@
11
import { NgModule } from "@angular/core";
22
import { RouterModule, Routes } from "@angular/router";
33

4+
import { AuthComponent } from "./auth.component";
45
import { LoginComponent } from "./login/login.component";
56
import { RegisterComponent } from "./register/register.component";
67

78
const routes: Routes = [
8-
{
9-
path: 'login',
10-
component: LoginComponent
11-
},
12-
{
13-
path: 'register',
14-
component: RegisterComponent
15-
}
9+
{
10+
path: '',
11+
component: AuthComponent,
12+
children: [
13+
{
14+
path: 'login',
15+
component: LoginComponent
16+
},
17+
{
18+
path: 'register',
19+
component: RegisterComponent
20+
},
21+
],
22+
},
1623
];
1724

1825
@NgModule({
Lines changed: 17 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,18 @@
1-
<div class="auth-wrapper">
2-
<div class="container">
3-
<section class="logo-content">
4-
<div class="logo">
5-
<img src="" alt="logo_image">
6-
</div>
7-
<img src="assets/images/login.svg" alt="media" class="login-image">
8-
</section>
9-
<section class="form-group">
10-
<div class="main">
11-
<span class="title">Iniciar sesión</span>
12-
<span class="sign-up">¿No tienes una cuenta?
13-
<a routerLink="/register">Regístrate</a>
14-
</span>
15-
</div>
16-
<app-login-form
17-
(loginData)="login($event)"
18-
[showErrors]="showErrors"
19-
[errors]="errors"
20-
></app-login-form>
21-
</section>
22-
</div>
1+
<div class="container">
2+
<figure>
3+
<img src="assets/images/login.svg" alt="media" class="login-image">
4+
</figure>
5+
<section class="form-group">
6+
<div class="main">
7+
<span class="title">Iniciar sesión</span>
8+
<span class="sign-up">¿No tienes una cuenta?
9+
<a routerLink="/register">Regístrate</a>
10+
</span>
11+
</div>
12+
<app-login-form
13+
(loginData)="login($event)"
14+
[showErrors]="showErrors"
15+
[errors]="errors"
16+
></app-login-form>
17+
</section>
2318
</div>

src/app/auth/login/login.component.scss

Lines changed: 0 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,7 @@
11
@import 'settings/_colors.scss';
22
@import 'settings/_typography.scss';
33

4-
.logo-content {
5-
flex: 2;
6-
}
7-
8-
.logo {
9-
position: absolute;
10-
top: 1rem;
11-
left: 1rem;
12-
}
134

14-
.login-image {
15-
width: 100%;
16-
height: 100%;
17-
max-width: 80rem;
18-
background-repeat: no-repeat;
19-
background-size: cover;
20-
background-position: center;
21-
}
225

236

247
.options {
Lines changed: 17 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,18 @@
1-
<div class="auth-wrapper">
2-
<div class="container">
3-
<section class="logo-content">
4-
<div class="logo">
5-
<img src="" alt="logo_image">
6-
</div>
7-
<img src="assets/images/register.svg" alt="media" class="register-image">
8-
</section>
9-
<section class="form-group">
10-
<div class="main">
11-
<span class="title">Regístrate</span>
12-
<span class="sign-up">¿Ya tienes una cuenta?
13-
<a routerLink="/login">Inicia sesión</a>
14-
</span>
15-
</div>
16-
<app-register-form
17-
(registerData)="createAccount($event)"
18-
[showErrors]="showErrors"
19-
[errors]="errors"
20-
></app-register-form>
21-
</section>
22-
</div>
1+
<div class="container">
2+
<figure>
3+
<img src="assets/images/register.svg" alt="media" class="register-image">
4+
</figure>
5+
<section class="form-group">
6+
<div class="main">
7+
<span class="title">Regístrate</span>
8+
<span class="sign-up">¿Ya tienes una cuenta?
9+
<a routerLink="/login">Inicia sesión</a>
10+
</span>
11+
</div>
12+
<app-register-form
13+
(registerData)="createAccount($event)"
14+
[showErrors]="showErrors"
15+
[errors]="errors"
16+
></app-register-form>
17+
</section>
2318
</div>

src/app/core/components/components.module.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,14 @@ import { RouterModule } from '@angular/router';
55
import { PipesModule } from '@pipes/pipes.module';
66

77
import { HeaderComponent } from './header/header.component';
8+
import { HeaderAuthComponent } from './header-auth/header-auth.component';
89
import { SidebarComponent } from './sidebar/sidebar.component';
910

1011
@NgModule({
1112
declarations: [
1213
SidebarComponent,
13-
HeaderComponent
14+
HeaderComponent,
15+
HeaderAuthComponent
1416
],
1517
imports: [
1618
CommonModule,
@@ -19,7 +21,8 @@ import { SidebarComponent } from './sidebar/sidebar.component';
1921
],
2022
exports: [
2123
SidebarComponent,
22-
HeaderComponent
24+
HeaderComponent,
25+
HeaderAuthComponent
2326
]
2427
})
2528
export class ComponentsModule { }

0 commit comments

Comments
 (0)