Martin Macola / autoservicio

Download as
Browse Code ยป

Commit 2cb513768aa3a2463955072e7dbcc5f3ef32c8d2

Authored by Marcelo Puebla
2 parents fe33054b33 28ef2dbbbd
Exists in master

Merge branch 'master' into 'master' 

Master(mpuebla)

See merge request !4
Showing 16 changed files   Show diff stats
src/app/app-routing.module.ts
Diff comments   View file @ 2cb5137
1 1 import { NgModule } from '@angular/core';
2 2 import { Routes, RouterModule } from '@angular/router';
  3 +import { HomeComponent } from './home/home.component';
  4 +import { CargarProductosComponent } from './cargar-productos/cargar-productos.component';
3 5  
4   -const routes: Routes = [];
  6 +const routes: Routes = [
  7 + { path: 'home', component: HomeComponent },
  8 + { path: 'cargar-productos', component: CargarProductosComponent },
  9 + { path: '**', redirectTo: '/home', pathMatch: 'full' },
  10 +];
5 11  
6 12 @NgModule({
7 13 imports: [RouterModule.forRoot(routes)],
src/app/app.component.html
Diff comments   View file @ 2cb5137
1   -<div class="container-fluid h-100">
2   - <div class="row h-100">
3   - <div class="col p-0">
4   - <app-home class="w-100 h-100 d-flex align-items-start flex-column"></app-home>
5   - </div>
6   - </div>
7   -</div>
8 1 <router-outlet></router-outlet>
9 2 \ No newline at end of file
src/app/app.module.ts
Diff comments   View file @ 2cb5137
... ... @@ -3,20 +3,20 @@ import { NgModule } from &#39;@angular/core&#39;;
3 3  
4 4 import { AppRoutingModule } from './app-routing.module';
5 5 import { AppComponent } from './app.component';
6   -import { FooterComponent } from './footer/footer.component';
7 6 import { HeaderComponent } from './header/header.component';
8 7 import { SidebarComponent } from './sidebar/sidebar.component';
9 8 import { CarouselComponent } from './carousel/carousel.component';
10 9 import { HomeComponent } from './home/home.component';
  10 +import { CargarProductosComponent } from './cargar-productos/cargar-productos.component';
11 11  
12 12 @NgModule({
13 13 declarations: [
14 14 AppComponent,
15   - FooterComponent,
16 15 HeaderComponent,
17 16 SidebarComponent,
18 17 CarouselComponent,
19   - HomeComponent
  18 + HomeComponent,
  19 + CargarProductosComponent
20 20 ],
21 21 imports: [
22 22 BrowserModule,
src/app/cargar-productos/cargar-productos.component.html
Diff comments   View file @ 2cb5137
... ... @@ -0,0 +1,8 @@
  1 +<div class="row m-0 h-100">
  2 + <div class="col-10 p-0">
  3 + <div class="bg-danger py-1 py-sm-2 py-lg-5">
  4 + <p class="text-center">HEADER</p>
  5 + </div>
  6 + </div>
  7 + <app-sidebar class="col-2 col-md-2 w-100 h-100 bg-dark text-white"></app-sidebar>
  8 +</div>
0 9 \ No newline at end of file
src/app/cargar-productos/cargar-productos.component.scss
Diff comments   View file @ 2cb5137
src/app/cargar-productos/cargar-productos.component.spec.ts
Diff comments   View file @ 2cb5137
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { CargarProductosComponent } from './cargar-productos.component';
  4 +
  5 +describe('CargarProductosComponent', () => {
  6 + let component: CargarProductosComponent;
  7 + let fixture: ComponentFixture<CargarProductosComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ CargarProductosComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(CargarProductosComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/cargar-productos/cargar-productos.component.ts
Diff comments   View file @ 2cb5137
... ... @@ -0,0 +1,15 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +
  3 +@Component({
  4 + selector: 'app-cargar-productos',
  5 + templateUrl: './cargar-productos.component.html',
  6 + styleUrls: ['./cargar-productos.component.scss']
  7 +})
  8 +export class CargarProductosComponent implements OnInit {
  9 +
  10 + constructor() { }
  11 +
  12 + ngOnInit() {
  13 + }
  14 +
  15 +}
src/app/footer/footer.component.html
View file @ 2cb5137
... ... @@ -1,7 +0,0 @@
1   -<div class="row footer">
2   - <div class="col p-0">
3   - <div class="bg-dark py-1 py-sm-2 py-lg-5">
4   - <p class="text-center text-white-50">Soy el footer</p>
5   - </div>
6   - </div>
7   -</div>
8 0 \ No newline at end of file
src/app/footer/footer.component.scss
View file @ 2cb5137
src/app/footer/footer.component.spec.ts
View file @ 2cb5137
... ... @@ -1,25 +0,0 @@
1   -import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2   -
3   -import { FooterComponent } from './footer.component';
4   -
5   -describe('FooterComponent', () => {
6   - let component: FooterComponent;
7   - let fixture: ComponentFixture<FooterComponent>;
8   -
9   - beforeEach(async(() => {
10   - TestBed.configureTestingModule({
11   - declarations: [FooterComponent]
12   - })
13   - .compileComponents();
14   - }));
15   -
16   - beforeEach(() => {
17   - fixture = TestBed.createComponent(FooterComponent);
18   - component = fixture.componentInstance;
19   - fixture.detectChanges();
20   - });
21   -
22   - it('should create', () => {
23   - expect(component).toBeTruthy();
24   - });
25   -});
src/app/footer/footer.component.ts
View file @ 2cb5137
... ... @@ -1,15 +0,0 @@
1   -import { Component, OnInit } from '@angular/core';
2   -
3   -@Component({
4   - selector: 'app-footer',
5   - templateUrl: './footer.component.html',
6   - styleUrls: ['./footer.component.scss']
7   -})
8   -export class FooterComponent implements OnInit {
9   -
10   - constructor() { }
11   -
12   - ngOnInit() {
13   - }
14   -
15   -}
src/app/home/home.component.html
Diff comments   View file @ 2cb5137
1   -<!-- HEADER -->
2   -<div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
3   - <p class="text-white text-center">HEADER</p>
4   -</div>
  1 +<div class="container-fluid h-100">
  2 + <div class="row h-100">
  3 + <div class="col p-0">
  4 + <div class="w-100 h-100 d-flex align-items-start flex-column disable-user-select">
  5 +
  6 + <!-- HEADER -->
  7 + <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
  8 + <p class="text-white text-center">HEADER</p>
  9 + </div>
5 10  
6   -<div class="h-100 w-100 position-relative">
7   - <div class="background-image blur"></div>
8   - <div class="row position-absolute w-100 h-100">
9   - <div class="col-5 my-auto">
10   - <!-- CAROUSEL -->
11   - <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
12   - <div class="carousel-inner">
13   - <div class="carousel-item active">
14   - <img class="m-auto img-fluid d-block w-75"
15   - src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
16   - alt="">
17   - </div>
18   - <div class="carousel-item">
19   - <img class="m-auto img-fluid d-block w-75"
20   - src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
21   - alt="">
  11 + <div class="h-100 w-100 position-relative">
  12 + <div class="background-image blur"></div>
  13 + <div class="row position-absolute w-100 h-100">
  14 + <div class="col-5 my-auto">
  15 + <!-- CAROUSEL -->
  16 + <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
  17 + <div class="carousel-inner">
  18 + <div class="carousel-item active">
  19 + <img class="m-auto img-fluid d-block w-75"
  20 + src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
  21 + alt="">
  22 + </div>
  23 + <div class="carousel-item">
  24 + <img class="m-auto img-fluid d-block w-75"
  25 + src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
  26 + alt="">
  27 + </div>
  28 + </div>
  29 + </div>
  30 + </div>
  31 + <div class="col-7 my-auto">
  32 + <div class="text-center text-white">
  33 + <h1 class="display-2 font-weight-bold">ยกBIENVENIDO!</h1>
  34 + <h1 class="display-3 font-weight-bold">Toque la pantalla<br>para comenzar.</h1>
  35 + </div>
  36 + </div>
22 37 </div>
23 38 </div>
24   - </div>
25   - </div>
26   - <div class="col-7 my-auto">
27   - <div class="text-center text-white">
28   - <h1 class="display-2 font-weight-bold">ยกBIENVENIDO!</h1>
29   - <h1 class="display-3 font-weight-bold">Toque la pantalla<br>para comenzar.</h1>
  39 +
  40 + <!-- FOOTER -->
  41 + <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
  42 + <p class="text-white text-center">FOOTER</p>
  43 + </div>
30 44 </div>
31 45 </div>
32 46 </div>
33   -</div>
34   -
35   -<!-- FOOTER -->
36   -<div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
37   - <p class="text-white text-center">FOOTER</p>
38 47 </div>
39 48 \ No newline at end of file
src/app/home/home.component.scss
Diff comments   View file @ 2cb5137
1 1 .background-image {
2 2 background-image: url(http://www.nortecorrientes.com/content/bucket/7/304027w980.jpg);
  3 + background-repeat: no-repeat;
  4 + background-size: cover;
3 5 position: absolute;
4 6 width: 100%;
5 7 height: 100%;
src/app/home/home.component.ts
Diff comments   View file @ 2cb5137
1   -import { Component, OnInit } from '@angular/core';
  1 +import { Component, OnInit, HostListener } from '@angular/core';
  2 +import { Router } from '@angular/router';
2 3  
3 4 @Component({
4 5 selector: 'app-home',
... ... @@ -7,9 +8,14 @@ import { Component, OnInit } from &#39;@angular/core&#39;;
7 8 })
8 9 export class HomeComponent implements OnInit {
9 10  
10   - constructor() { }
  11 + constructor(private router: Router) { }
11 12  
12 13 ngOnInit() {
13 14 }
14 15  
  16 + @HostListener('document:click', ['$event'])
  17 + documentClick(event: MouseEvent) {
  18 + this.router.navigate(['/cargar-productos']);
  19 + }
  20 +
15 21 }
src/app/sidebar/sidebar.component.html
Diff comments   View file @ 2cb5137
1   -< <div class="d-flex align-items-center flex-column h-100 bg-dark pt-2 text-center">
  1 +<div class="d-flex align-items-center flex-column h-100 bg-dark pt-2 text-center">
2 2  
3 3 <h4 class="border-bottom border-white"> Mi compra </h4>
4 4  
... ... @@ -39,4 +39,4 @@
39 39 </div>
40 40 </div>
41 41 </div>
42   - </div>
43 42 \ No newline at end of file
  43 +</div>
44 44 \ No newline at end of file
... ... @@ -5,9 +5,15 @@ body {
5 5 }
6 6  
7 7 .blur {
8   - /* Add the blur effect */
9   - filter: blur(8px);
10   - -webkit-filter: blur(8px);
  8 + filter: blur(10px);
  9 + -webkit-filter: blur(10px);
  10 +}
  11 +
  12 +.disable-user-select {
  13 + -webkit-user-select: none;
  14 + -moz-user-select: none;
  15 + -ms-user-select: none;
  16 + user-select: none;
11 17 }
12 18 .blue-gradient{
13 19 background: linear-gradient(0deg, rgba(40,112,175,1),rgb(252, 252, 252));