Commit 8c68a0e91e8685f6f097abe2672cc7cb3c363c8d
1 parent
14c393de40
Exists in
master
Agregadas animations..
Showing
2 changed files
with
15 additions
and
2 deletions
Show diff stats
src/app/components/sidebar/sidebar.component.html
... | ... | @@ -9,7 +9,8 @@ |
9 | 9 | <div class="overflow-scroll px-1 mb-1 w-100"> |
10 | 10 | <!-- PRODUCTOS CARRITO --> |
11 | 11 | <div class="row m-0" |
12 | - *ngFor="let producto of productosCarrito; let i = index"> | |
12 | + *ngFor="let producto of productosCarrito; let i = index" | |
13 | + [@EnterLeave]="flyIn"> | |
13 | 14 | <div class="col p-0 my-1 bg-white border-0 rounded-sm"> |
14 | 15 | <div class="row m-0"> |
15 | 16 | <div class="col-6 pl-1 pr-0 my-auto"> |
src/app/components/sidebar/sidebar.component.ts
... | ... | @@ -3,11 +3,24 @@ import { Producto } from 'src/app/wrappers/producto'; |
3 | 3 | import { appSettings } from 'src/etc/AppSettings'; |
4 | 4 | import { ProductoService } from 'src/app/services/producto.service'; |
5 | 5 | import { Router } from '@angular/router'; |
6 | +import { trigger, state, style, transition, animate } from '@angular/animations'; | |
6 | 7 | |
7 | 8 | @Component({ |
8 | 9 | selector: 'app-sidebar', |
9 | 10 | templateUrl: './sidebar.component.html', |
10 | 11 | styleUrls: ['./sidebar.component.scss'], |
12 | + animations: [ | |
13 | + trigger('EnterLeave', [ | |
14 | + state('flyIn', style({ transform: 'translateX(0)' })), | |
15 | + transition(':enter', [ | |
16 | + style({ transform: 'translateX(-100%)' }), | |
17 | + animate('0.3s ease-in') | |
18 | + ]), | |
19 | + transition(':leave', [ | |
20 | + animate('0.3s ease-out', style({ transform: 'translateX(-100%)' })) | |
21 | + ]) | |
22 | + ]) | |
23 | + ] | |
11 | 24 | }) |
12 | 25 | export class SidebarComponent implements OnInit { |
13 | 26 | |
... | ... | @@ -74,7 +87,6 @@ export class SidebarComponent implements OnInit { |
74 | 87 | this.cantTotal -= producto.cantidad; |
75 | 88 | this.total -= producto.PreVen * producto.cantidad; |
76 | 89 | this.productosCarrito.splice(index, 1); |
77 | - return; | |
78 | 90 | } |
79 | 91 | |
80 | 92 | personalizarPromo(producto: Producto, index) { |