Parcourir la source

Navbar recreada de nuevo

AldrickChavarria il y a 1 an
Parent
commit
ffee7e2162

+ 3 - 3
angular.json

@@ -48,13 +48,13 @@
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "500kB",
+                  "maximumWarning": "5MB",
                   "maximumError": "1MB"
                 },
                 {
                   "type": "anyComponentStyle",
-                  "maximumWarning": "2kB",
-                  "maximumError": "4kB"
+                  "maximumWarning": "5MB",
+                  "maximumError": "1MB"
                 }
               ],
               "outputHashing": "all"

BIN
dist.rar


BIN
dist.zip


+ 13 - 8
src/app/pages/linea/linea.component.ts

@@ -12,27 +12,27 @@ export class LineaComponent {
     {
       img: 'assets/img/dfs.png',
       name: 'AERO',
-      description: 'La gama AERO de extractores axiales marca ATC, ha sido especialmente disefada para aplicacién en muro, techo o falso plafén y es la solucién ideal para la renovacion ambiental en espacios reducidos con...'
+      description: 'La gama AERO de extractores axiales marca ATC, ha sido especialmente diseñada para aplicación en muro, techo o falso plafón y es lo solución ideal para la renovación ambiental en espacios reducidos con....'
     },
     {
       img: 'assets/img/dv.png',
       name: 'OV',
-      description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      description: 'La serie OV de los Aero Extractores-Inyectores OVNI Centrífugos en línea con motor del tipo rotor exterior, ha sido especialmente diseñado para acoplar en ductos de ventilación....'
     },
     {
       img: 'assets/img/fds.png',
       name: 'AB',
-      description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      description: 'Aero extractor-inyector tubular booster "6, 10, 12, 14" de diámetro. La serie AB es una gama de extractores axiales tipo tubular accionados con acoplamiento directo y diseñados especialmente para los....'
     },
     {
       img: 'assets/img/dfs.png',
       name: 'AERO',
-      description: 'La gama AERO de extractores axiales marca ATC, ha sido especialmente disefada para aplicacién en muro, techo o falso plafén y es la solucién ideal para la renovacion ambiental en espacios reducidos con...'
+      description: 'La gama AERO de extractores axiales marca ATC, ha sido especialmente diseñada para aplicación en muro, techo o falso plafón y es lo solución ideal para la renovación ambiental en espacios reducidos con....'
     },
     {
       img: 'assets/img/dv.png',
       name: 'OV',
-      description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      description: 'La serie OV de los Aero Extractores-Inyectores OVNI Centrífugos en línea con motor del tipo rotor exterior, ha sido especialmente diseñado para acoplar en ductos de ventilación....'
     }
 
   ];
@@ -49,13 +49,18 @@ export class LineaComponent {
 
   cargarDatos(tipo: any) {
     if (tipo === 'habitat') {
-      this.typeLine = 'Linea Hábitat';
+      this.typeLine = 'Línea Hábitat';
       // this.products = [...]; // Datos de línea hábitat
     } else if (tipo === 'comercial') {
-      this.typeLine = 'Linea Comercial';
+      this.typeLine = 'Línea Comercial';
+      // this.products = [...]; // Datos de línea comercial
+    } else if (tipo === 'industrial') {
+      this.typeLine = 'Línea Industrial';
+      // this.products = [...]; // Datos de línea comercial
+    } else if (tipo === 'aplicacion') {
+      this.typeLine = 'Por Aplicación';
       // this.products = [...]; // Datos de línea comercial
     }
-    // Agrega más casos para las demás líneas
   }
 
 }

+ 9 - 3
src/app/pages/producto/producto.component.ts

@@ -34,12 +34,18 @@ export class ProductoComponent {
 
   cargarDatos(tipo: any) {
     if (tipo === 'habitat') {
-      this.typeLine = 'Linea Hábitat';
+      this.typeLine = 'Línea Hábitat';
       // this.products = [...]; // Datos de línea hábitat
     } else if (tipo === 'comercial') {
-      this.typeLine = 'Linea Comercial';
+      this.typeLine = 'Línea Comercial';
+      // this.products = [...]; // Datos de línea comercial
+    } else if (tipo === 'industrial') {
+      this.typeLine = 'Línea Industrial';
+      // this.products = [...]; // Datos de línea comercial
+    } else if (tipo === 'aplicacion') {
+      this.typeLine = 'Por Aplicación';
       // this.products = [...]; // Datos de línea comercial
     }
-    // Agrega más casos para las demás líneas
+    
   }
 }

+ 23 - 3
src/app/shared/footer/footer.component.css

@@ -1,13 +1,13 @@
 .footer {
-
     color: white;
-
 }
 
 .footerTop {
+    flex-wrap: wrap;
     width: 100%;
     background-color: #333333;
-    height: 125px;
+    height: auto;
+    padding: 1% 0 1% 0;
 
 }
 
@@ -31,4 +31,24 @@
 
 .txtContent {
     font-size: 120%;
+}
+
+@media screen and (max-width: 768px) {
+    .spaddingBlocks{
+        width: 100%;
+        margin-top: 10px;
+        margin-bottom: 10px;
+    }
+    .img-footer{
+        width: 100%;
+        text-align: center;
+        margin-top: 15px;
+        margin-bottom: 20px;
+    }
+
+    .footerBottom{
+        text-align: center;
+    }
+
+    
 }

+ 3 - 1
src/app/shared/footer/footer.component.html

@@ -1,7 +1,9 @@
 <!-- TODO: Footer responsive -->
 <footer class="footer">
     <div class="footerTop center">
-        <img src="../../../assets/img/negativo.png" style="height: 52%;">
+        <div class="img-footer">
+            <img src="../../../assets/img/negativo.png" style="max-height: 65px">
+        </div>
         <div class="spaddingBlocks">
             <div class="lineFooter">
                 <mat-icon svgIcon="phone"></mat-icon>

+ 91 - 82
src/app/shared/navbar/navbar.component.css

@@ -1,121 +1,130 @@
-.navbar-Home {
-  background-color: #ffffff;
-  /* background-image: url('../../../assets/img/Air-technology.png'); */
-  height: 80px;
+.navbar {
+  height: 60px;
+  background-color: white;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 20px;
+  position: relative;
+  z-index: 100;
 }
 
-.topnav {
-  background-color: #ffffff;
-  overflow: hidden;
+.nav-center {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 50%;
 }
 
-.topnav a {
-  float: left;
-  display: block;
-  color: #f2f2f2;
-  text-align: center;
+.ul-links {
+  display: flex;
+  list-style: none;
+  justify-content: space-around;
+}
+
+
+.main-option {
   text-decoration: none;
-  padding: 14px 5px;
+  color: black;
+  border-bottom: 2px solid white;
+  padding: 10px 10px;
   font-size: 17px;
-  font-family: "Albert Sans", sans-serif;
+  font-family: 'Albert Sans', sans-serif;
 }
 
-.topnav a:hover {
-  color: #252E68 !important;
-  cursor: pointer;
-
+.main-option:hover {
+  border-bottom: 2px solid #252E68;
 }
 
-.container-links {
-  height: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+
+.nav-links {
+  position: relative;
+  z-index: 200;
 }
 
-.container-links.active {
-  border-bottom: 2px solid;
-  border-bottom-color: #252E68;
+
+.dropdown-menu {
+  display: none;
+  position: absolute;
+  top: 145%;
+  left: 50%;
+
+  transform: translateX(-50%);
+  text-align: center;
+  background-color: #fff;
+  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  z-index: 1;
+  width: auto;
+  min-width: 120px;
+  white-space: nowrap;
 }
 
-.container-links:hover {
-  border-bottom: 2px solid;
-  border-bottom-color: #252E68;
+
+.nav-links:hover .dropdown-menu {
+  display: block;
 }
 
 
-.fondoDiv {
-  height: 50px;
-  max-width: 200px;
-  background-color: rgba(255, 255, 255, 0);
-  border-radius: 40px;
-  padding: 5px 10px;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: fit-content;
+
+.dropdown-option {
+  text-decoration: none;
+  color: black;
+  padding: 5px 20px;
+  display: block;
+  font-size: 17px;
+  font-family: 'Albert Sans', sans-serif;
 }
 
-.fondoDiv img {
-  max-width: 100%;
-  max-height: 100%;
-  object-fit: contain;
+.dropdown-option:hover {
+  background-color: #252e68b7;
+  color: white;
 }
 
-.menu-options {
-  text-align: center;
-  font-size: 14px;
-  min-height: 30px !important;
+/* .nav-right{
+  
+} */
+
+.menu{
+  display: none;
 }
 
-.menu-options:hover {
-  color: white;
-  background-color: #252e68b7 !important;
+
+.search {
+  position: relative;
+  color: #aaa;
+  font-size: 16px;
 }
 
-.input {
+.search input {
+  height: 30px;
+  text-indent: 5px;
+  width: 200px;
   border: 2px solid #c0c0c0;
   outline: none;
 }
 
-.input:focus {
-  outline: none;
-  border: 2px solid #979797;
+.search mat-icon {
+  position: absolute;
+  right: 10px;
+  top: 25%;
+  color: #252E68;
 }
 
-@media screen and (max-width: 600px) {
-  .topnav a:not(:first-child) {
+@media screen and (max-width: 768px) {
+  .nav-center {
     display: none;
   }
 
-  .topnav a.icon {
-    float: right;
-    display: block;
-  }
-
-  .topnav.responsive {
-    position: relative;
-  }
-
-  .topnav.responsive a.icon {
-    position: absolute;
-    right: 0;
-    top: 0;
+  .nav-right {
+    display: none;
   }
 
-  .topnav.responsive a {
-    float: none;
+  .menu {
     display: block;
-    text-align: left;
+    transform: scale(1.5);
   }
-}
 
-
-
-
-/* @media only screen and (max-width: 1024px) {
-  .topnav {
-    display: none;
-  }
-} */
+}

+ 54 - 65
src/app/shared/navbar/navbar.component.html

@@ -1,67 +1,56 @@
 
-<!-- TODO: Navbar responsive -->
-<mat-toolbar class="navbar-Home">
-    <mat-toolbar-row style="height: 80px; display: flex; justify-content: space-between;">
-        <span style="width: 15%; display: flex; justify-content: center;" (click)="redirectHome()">
-            <div class="fondoDiv">
-                <img [src]="'assets/img/logoATC.png'">
-            </div>
-        </span>
-        <div class="topnav" style="width: 50%; justify-content: space-evenly; display: flex; align-items: center;">
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" (click)="redirectHome()">Inicio</a>
-            </div>
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" [matMenuTriggerFor]="menu1" routerLink="/linea/habitat"
-                    #menu1Trigger="matMenuTrigger">Línea Hábitat</a>
-                <mat-menu #menu1="matMenu">
-                    <ng-container *ngFor="let menu of menu1Opciones">
-                        <button mat-menu-item class="menu-options" [routerLink]="['/linea/habitat', menu.name]">{{menu.name}}</button>
-                    </ng-container>
-                </mat-menu>
-            </div>
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" [matMenuTriggerFor]="menu2" routerLink="/linea/comercial"> Línea Comercial</a>
-                <mat-menu #menu2="matMenu">
-                    <ng-container *ngFor="let menu of menu2Opciones">
-                        <button mat-menu-item class="menu-options" [routerLink]="['/linea/comercial', menu.name]">{{menu.name}}</button>
-                    </ng-container>
-                </mat-menu>
-            </div>
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" [matMenuTriggerFor]="menu3">Línea Industrial</a>
-                <mat-menu #menu3="matMenu">
-                    <ng-container *ngFor="let menu of menu3Opciones">
-                        <button mat-menu-item class="menu-options" (click)="redirectPage();">{{menu.name}}</button>
-                    </ng-container>
-                </mat-menu>
-            </div>
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" [matMenuTriggerFor]="menu4">Por Aplicación</a>
-                <mat-menu #menu4="matMenu">
-                    <ng-container *ngFor="let menu of menu4Opciones">
-                        <button mat-menu-item class="menu-options" (click)="redirectPage();">{{ menu.name }}</button>
-                    </ng-container>
-                </mat-menu>
-            </div>
-            <div class="container-links">
-                <a style=" text-decoration: none; color: black;" routerLink="/cotizacion">Cotización</a>
-            </div>
-            <div class="container-links">
-                <a style="text-decoration: none; color: black;" [matMenuTriggerFor]="menu5">Portales</a>
-                <mat-menu #menu5="matMenu">
-                    <ng-container *ngFor="let menu of menu5Opciones">
-                        <button mat-menu-item class="menu-options" (click)="redirectPage();">{{ menu.name }}</button>
-                    </ng-container>
-                </mat-menu>
-            </div>
+<nav class="navbar">
+    <div style="max-width: fit-content;">
+        <img [src]="'assets/img/logoATC.png'" alt="" style="max-height: 60px;">
+    </div>
+    <div class="nav-center">
+        <ul class="ul-links">
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" href="">Inicio</a>
+            </li>
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" routerLink="/linea/habitat">Línea Hábitat</a>
+                <ul *ngIf="showDropdown" class="dropdown-menu">
+                    <li><a class="dropdown-option" *ngFor="let option of menu1Opciones" [routerLink]="['/linea/habitat', option.name]">{{option.name}}</a></li>
+                </ul>
+            </li>
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" routerLink="/linea/comercial">Línea Comercial</a>
+                <ul *ngIf="showDropdown" class="dropdown-menu">
+                    <li><a class="dropdown-option" *ngFor="let option of menu2Opciones" [routerLink]="['/linea/comercial', option.name]">{{option.name}}</a></li>
+                </ul>
+            </li>
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" routerLink="/linea/industrial">Línea Industrial</a>
+                <ul *ngIf="showDropdown" class="dropdown-menu">
+                    <li><a class="dropdown-option" *ngFor="let option of menu3Opciones" [routerLink]="['/linea/industrial', option.name]">{{option.name}}</a></li>
+                </ul>
+            </li>
+            
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" routerLink="/linea/aplicacion">Por Aplicación</a>
+                <ul *ngIf="showDropdown" class="dropdown-menu">
+                    <li><a class="dropdown-option" *ngFor="let option of menu4Opciones" [routerLink]="['/linea/aplicacion', option.name]">{{option.name}}</a></li>
+                </ul>
+            </li>
+            <li class="nav-links"><a class="main-option" href="">Cotización</a></li>
+            <li class="nav-links" (mouseenter)="showDropdown = true" (mouseleave)="showDropdown = false">
+                <a class="main-option" href="">Portales</a>
+                <ul *ngIf="showDropdown" class="dropdown-menu">
+                    <li><a class="dropdown-option" *ngFor="let option of menu5Opciones">{{option.name}}</a></li>
+                </ul>
+            </li>
+            
+        </ul>
+    </div>
+    <div class="nav-right">
+        <div class="search">
+            <mat-icon>search</mat-icon>
+            <input placeholder="Modelo">
         </div>
-        <div style="width: 20%; display: flex; justify-content: center; align-items: center;">
-            <div style="position: relative;">
-                <input type="text" class="input" style="padding-right: 30px; height: 20px;" placeholder="Modelo">
-                <mat-icon
-                    style="position: absolute; right: 5px; top: 60%; transform: translateY(-50%); color: #3B349F;">search</mat-icon>
-            </div>
-        </div>
-    </mat-toolbar-row>
-</mat-toolbar>
+    </div>
+
+    <div class="menu">
+        <mat-icon>menu</mat-icon>
+    </div>
+</nav>

+ 68 - 80
src/app/shared/navbar/navbar.component.ts

@@ -7,99 +7,87 @@ import { Router } from '@angular/router';
   styleUrl: './navbar.component.css'
 })
 export class NavbarComponent {
+  public showDropdown = false;
+  menu1Opciones: any[] = [
+    { name: 'PF', link: '/home' },
+    { name: 'AB', link: '/about' },
+    { name: 'OV', link: '/contact' },
 
-  menu1Opciones: any [] =[
-    {name: 'AERO', link: '/home'}, 
-    {name: 'OV', link: '/about'}, 
-    {name: 'AB', link: '/contact'},
-    {name: 'WAD', link: '/contact'},
-    {name: 'PF', link: '/contact'},
   ];
-  menu2Opciones: any [] =[
-    {name: 'AGH', link: '/home'}, 
-    {name: 'AGF', link: '/about'}, 
-    {name: 'AGB', link: '/contact'},
-    {name: 'AGD-AGB-AGDC', link: '/contact'},
-    {name: 'AT', link: '/contact'},
-    {name: 'BK', link: '/contact'},
-    {name: 'CFD', link: '/contact'},
-    {name: 'COR', link: '/contact'},
-    {name: 'JF', link: '/contact'},
-    {name: 'LUV', link: '/contact'},
-    {name: 'PAC', link: '/contact'},
-    {name: 'PER', link: '/contact'},
-    {name: 'REF', link: '/contact'},
-    {name: 'SI-DI-DIT', link: '/contact'},
-    {name: 'SQ', link: '/contact'},
-    {name: 'SW-XP', link: '/contact'},
-    {name: 'TAB', link: '/contact'},
-    {name: 'TAD', link: '/contact'},
-    {name: 'TAP', link: '/contact'},
-    {name: 'WAB', link: '/contact'},
-    {name: 'WAD', link: '/contact'},
-    {name: 'PB', link: '/contact'},
-    {name: 'Filtros de aire', link: '/contact'},
-    {name: 'Accesorios para el control de sonido y vibración', link: '/contact'},
-    {name: 'Accesorios para ventiladores axiales', link: '/contact'},
+  menu2Opciones: any[] = [
+    { name: 'AGF', link: '/home' },
+    { name: 'AGH', link: '/about' },
+    { name: 'AT', link: '/contact' },
+    { name: 'BK', link: '/contact' },
+    { name: 'CFD', link: '/contact' },
+    { name: 'PB', link: '/contact' },
+    { name: 'REF', link: '/contact' },
+    { name: 'SW-XP', link: '/contact' },
+    { name: 'TAB', link: '/contact' },
+    { name: 'TAD', link: '/contact' },
+    { name: 'TAP', link: '/contact' },
+    { name: 'WAB', link: '/contact' },
+    { name: 'WAD', link: '/contact' },
+
   ];
-  menu3Opciones: any [] =[
-    {name: 'CAB-DI', link: '/home'}, 
-    {name: 'CBI', link: '/about'}, 
-    {name: 'CORIN', link: '/contact'},
-    {name: 'GDB-GDD-GUB-GUD-GWB-GWD', link: '/contact'},
-    {name: 'JF', link: '/contact'},
-    {name: 'DQ', link: '/contact'},
-    {name: 'RHB', link: '/contact'},
-    {name: 'RHD', link: '/contact'},
-    {name: 'RUB-RUD-TUB', link: '/contact'},
-    {name: 'TC', link: '/contact'},
-    {name: 'TWP-A', link: '/contact'},
-    {name: 'UFD', link: '/contact'},
-    {name: 'UFDW', link: '/contact'},
-    {name: 'UFP', link: '/contact'},
-    {name: 'XDP-A', link: '/contact'},
-    {name: 'XTP-A', link: '/contact'},
-    {name: 'XWP-A', link: '/contact'},
-    {name: 'SI-DI-DIT', link: '/contact'},
-    {name: 'KCB-KCD-KCDBR', link: '/contact'},
-    {name: 'UF', link: '/contact'},
-    {name: 'PX', link: '/contact'},
-    {name: 'ZHP', link: '/contact'},
+  menu3Opciones: any[] = [
+    { name: 'CAB-DI', link: '/home' },
+    { name: 'CBI', link: '/about' },
+    { name: 'CORIN', link: '/contact' },
+    { name: 'GDB-GDD-GUB-GUD-GWB-GWD', link: '/contact' },
+    { name: 'JF', link: '/contact' },
+    { name: 'DQ', link: '/contact' },
+    { name: 'RHB', link: '/contact' },
+    { name: 'RHD', link: '/contact' },
+    { name: 'RUB-RUD-TUB', link: '/contact' },
+    { name: 'TC', link: '/contact' },
+    { name: 'TWP-A', link: '/contact' },
+    { name: 'UFD', link: '/contact' },
+    { name: 'UFDW', link: '/contact' },
+    { name: 'UFP', link: '/contact' },
+    { name: 'XDP-A', link: '/contact' },
+    { name: 'XTP-A', link: '/contact' },
+    { name: 'XWP-A', link: '/contact' },
+    { name: 'SI-DI-DIT', link: '/contact' },
+    { name: 'KCB-KCD-KCDBR', link: '/contact' },
+    { name: 'UF', link: '/contact' },
+    { name: 'PX', link: '/contact' },
+    { name: 'ZHP', link: '/contact' },
   ];
-  menu4Opciones: any [] =[
-    {name: 'Plantas industriales, almacenes y bodegas', link: '/home'}, 
-    {name: 'Campanas de extracción de cocinas', link: '/about'}, 
-    {name: 'Granjas de pollo', link: '/contact'},
-    {name: 'Ganaderías', link: '/contact'},
-    {name: 'Invernaderos', link: '/contact'},
-    {name: 'Cuartos de máquinas', link: '/contact'},
-    {name: 'Torres de enfriamiento', link: '/contact'},
-    {name: 'Enfriamiento de transformadores de potencia', link: '/contact'},
-    {name: 'Estacionamientos', link: '/contact'},
-    {name: 'Ventilación en túneles y minas', link: '/contact'},
-    {name: 'Atmósferas corrosivas/explosivas', link: '/contact'},
-    {name: 'Cortinas de aire', link: '/contact'},
-    {name: 'Cuartos de pre-enfriado', link: '/contact'},
-    {name: 'Cuartos de baterías con extractores a prueba de explosión', link: '/contact'},
-    {name: 'Recirculadores portátiles', link: '/contact'},
-    {name: 'Extractores para colección de polvo', link: '/contact'},
+  menu4Opciones: any[] = [
+    { name: 'Plantas industriales, almacenes y bodegas', link: '/home' },
+    { name: 'Campanas de extracción de cocinas', link: '/about' },
+    { name: 'Granjas de pollo', link: '/contact' },
+    { name: 'Ganaderías', link: '/contact' },
+    { name: 'Invernaderos', link: '/contact' },
+    { name: 'Cuartos de máquinas', link: '/contact' },
+    { name: 'Torres de enfriamiento', link: '/contact' },
+    { name: 'Enfriamiento de transformadores de potencia', link: '/contact' },
+    { name: 'Estacionamientos', link: '/contact' },
+    { name: 'Ventilación en túneles y minas', link: '/contact' },
+    { name: 'Atmósferas corrosivas/explosivas', link: '/contact' },
+    { name: 'Cortinas de aire', link: '/contact' },
+    { name: 'Cuartos de pre-enfriado', link: '/contact' },
+    { name: 'Cuartos de baterías con extractores a prueba de explosión', link: '/contact' },
+    { name: 'Recirculadores portátiles', link: '/contact' },
+    { name: 'Extractores para colección de polvo', link: '/contact' },
   ];
-  menu5Opciones: any [] =[
-    {name: 'Cliente', link: '/home'}, 
-    {name: 'Proveedor', link: '/about'}, 
-  
+  menu5Opciones: any[] = [
+    { name: 'Cliente', link: '/home' },
+    { name: 'Proveedor', link: '/about' },
+
   ];
   constructor(
     private _router: Router
-  ){
-    
+  ) {
+
   }
 
-  redirectHome(){
+  redirectHome() {
     this._router.navigate(['']);
   }
 
-  redirectPage(){
+  redirectPage() {
     this._router.navigate(['404']);
   }
 }