Commit 7bfa9873ff62e6c5277297888cb0584bbd53b990
1 parent
be933bc66b
Exists in
master
Cambio estilo
Showing
2 changed files
with
35 additions
and
36 deletions
Show diff stats
src/app/sidebar/sidebar.component.html
1 | -<div class="col-2 col-md-2 offset-10 w-100 h-100 bg-dark text-white"> | |
2 | - <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"> | |
3 | 2 | |
4 | - <h4 class="border-bottom border-white"> Mi compra </h4> | |
3 | + <h4 class="border-bottom border-white"> Mi compra </h4> | |
5 | 4 | |
6 | - <div class="card mt-2 bg-primary"> | |
7 | - <img src="../../assets/descarga.jpg" class="card-img-top" alt="..."> | |
8 | - <div class="card-body row m-0 p-0 px-1 py-1 shadow rounded"> | |
9 | - <div class="col-8 p-0 text-left my-auto"> | |
10 | - <p class="m-0 card-description">Galleta oreo x 199 gs Chocolate</p> | |
11 | - <p class="m-0 card-description"><small>COD: 1234567</small></p> | |
12 | - </div> | |
13 | - <div class="col-4 p-1 text-center my-auto"> | |
14 | - {{90 | currency}} | |
15 | - </div> | |
5 | + <div class="card mt-2 bg-primary"> | |
6 | + <img src="../../assets/descarga.jpg" class="card-img-top" alt="..."> | |
7 | + <div class="card-body row m-0 p-0 px-1 py-1 shadow rounded"> | |
8 | + <div class="col-8 p-0 text-left my-auto"> | |
9 | + <p class="m-0 card-description">Galleta oreo x 199 gs Chocolate</p> | |
10 | + <p class="m-0 card-description"><small>COD: 1234567</small></p> | |
11 | + </div> | |
12 | + <div class="col-4 p-1 text-center my-auto"> | |
13 | + {{90 | currency}} | |
16 | 14 | </div> |
17 | - <div class="row m-0 p-0"> | |
18 | - <div class="col p-1 pb-1 mt-2"> | |
19 | - <button type="button" class="btn btn-light btn-sm float-left my-auto">X</button> | |
20 | - <button type="button" class="btn btn-light btn-sm my-auto">X</button> | |
21 | - <div class="btn-group-sm btn-group float-right my-auto" role="group" aria-label="Basic example"> | |
22 | - <button type="button" class="btn btn-light btn-sm mb-2">+</button> | |
23 | - <label for="" class="border border.white px-1">12</label> | |
24 | - <button type="button" class="btn btn-light btn-sm mb-2">-</button> | |
25 | - </div> | |
15 | + </div> | |
16 | + <div class="row m-0 p-0"> | |
17 | + <div class="col p-1 pb-1 mt-2"> | |
18 | + <button type="button" class="btn btn-light btn-sm float-left my-auto">X</button> | |
19 | + <button type="button" class="btn btn-light btn-sm my-auto">X</button> | |
20 | + <div class="btn-group-sm btn-group float-right my-auto" role="group" aria-label="Basic example"> | |
21 | + <button type="button" class="btn btn-light btn-sm mb-2">+</button> | |
22 | + <label for="" class="border border.white px-1">12</label> | |
23 | + <button type="button" class="btn btn-light btn-sm mb-2">-</button> | |
26 | 24 | </div> |
27 | 25 | </div> |
28 | 26 | </div> |
27 | + </div> | |
29 | 28 | |
30 | - <div class="card mt-auto" style="background: linear-gradient(0deg, rgba(40,112,175,1),rgb(252, 252, 252))"> | |
31 | - <div class="card-body row"> | |
32 | - <div class="col"> | |
33 | - <h4 class="border-bottom border-secondary text-secondary">(1) item</h4> | |
34 | - <h3 class="text-secondary">Total</h3> | |
35 | - <h3 class="text-dark"><strong>{{5000 | currency}}</strong></h3> | |
36 | - </div> | |
37 | - <div class="col p-0"> | |
38 | - <button type="button" class="btn btn-light shadow"><strong>Finalizar y pagar</strong></button> | |
39 | - </div> | |
40 | - <div class="col"> | |
41 | - <button type="button" class="btn btn-light shadow btn-sm">Cancelar</button> | |
42 | - </div> | |
29 | + <div class="card mt-auto blue-gradient"> | |
30 | + <div class="card-body row"> | |
31 | + <div class="col"> | |
32 | + <h4 class="border-bottom border-secondary text-secondary">(1) item</h4> | |
33 | + <h3 class="text-secondary">Total</h3> | |
34 | + <h3 class="text-dark"><strong>{{5000 | currency}}</strong></h3> | |
35 | + </div> | |
36 | + <div class="col 12 p-0"> | |
37 | + <button type="button" class="btn btn-light shadow mb-2"><strong>Finalizar y pagar</strong></button> | |
38 | + <button type="button" class="btn btn-light shadow btn-sm">Cancelar</button> | |
43 | 39 | </div> |
44 | 40 | </div> |
45 | 41 | </div> |
46 | -</div> | |
47 | 42 | \ No newline at end of file |
43 | + </div> | |
48 | 44 | \ No newline at end of file |