-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
141 lines (120 loc) · 6.68 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="images/m.JPEG">
<!-- BOOTSTRAP 5 -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- BOOTSTRAP 5 PERSONALIZACIÓN -->
<link rel="stylesheet" href="css/estilos.css">
<!-- ICONOS BOOTSTRAP 5 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<title>Carrito de Compras</title>
</head>
<body class="bg-light d-flex flex-column min-vh-100 mt-5">
<!-- NAVEGADOR -->
<nav class="navbar navbar-dark bg-dark navbar-expand-md fixed-top ">
<div class="container ">
<a href="index.html" class="navbar-brand">
<img src="images/logo2.JPG" alt="Logo" width="110px" height="50px" class="img-fluid ">
</a>
<button type="button" class="navbar-toggler ms-auto p-2 px-3 mx-2" data-bs-toggle="collapse" data-bs-target="#menu-principal"
aria-expanded="false" aria-controls="menu-principal" aria-label="boton menu principal" >
<i class="bi bi-list"></i>
</button>
<button type="button" class="navbar-toggler p-2 px-3 mx-2 position-relative" aria-controls="carrito" aria-label="boton carrito">
<a href="carrito.html"><i class="bi bi-cart-fill"></i><span class="badgeMenu badge rounded-pill bg-secondary position-absolute start-100 translate-middle ">
0
</span></a>
</button>
<div class="collapse navbar-collapse" id="menu-principal">
<ul class="navbar-nav ms-auto ">
<li class="nav-item "><a href="index.html" class="nav-link">Inicio</a></li>
<li class="nav-item "><a href="productos.html" class="nav-link">Productos</a></li>
<li class="nav-item "><a href="nosotros.html" class="nav-link ">Nosotros</a></li>
<li class="nav-item d-none d-md-flex"><a href="carrito.html" class="nav-link position-relative">
Ver Carrito <i class="bi bi-cart-fill"></i><span class="badgeMenu2 badge rounded-pill bg-secondary position-absolute start-100 translate-middle">
0
</span></a></li>
</ul>
</div>
</div>
</nav>
<br>
<!-- SLIDERS -->
<section class="container my-4 mt-2 border border-primary rounded p-0 p-sm-3 bg-primary flex-shrink-0">
<article id="carousel" class="carousel carousel-dark slide" data-bs-ride="carousel-indicators">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
</div>
<!-- ITEMS -->
<div class="carousel-inner">
<div class="carousel-item active">
<a href="nosotros.html" target="_self">
<img src="images/banner_ubicacion.jpg" class="img-fluid w-100 h-100" alt="Ubicacion" title="Ubicacion">
</a>
</div>
<div class="carousel-item">
<a href="productos.html" target="_self">
<img src="images/banner_desc.jpg" class="img-fluid w-100 h-100" alt="Oferta" title="Oferta">
</a>
</div>
</div>
<!-- BOTONES ITEMS -->
<button class="carousel-control-prev" type="button" data-bs-target="#carousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</article>
</section>
<section class="container my-4 mt-2 border border-primary rounded bg-primary flex-shrink-0">
<div class="row">
<article class="container col-6 col-md-3 text-start p-2 border border-primary rounded shadow-lg bg-light bg-primary ">
<div class="card fixed-height-info">
<div class="card-body text-center">
<i class="bi bi-shop display-2 text-primary"></i>
<h3 class="card-subtitle ">Servicio en local</h3>
</div>
</article>
<article class="container col-6 col-md-3 text-start p-2 border border-primary rounded shadow-lg bg-light bg-primary ">
<div class="card fixed-height-info">
<div class="card-body text-center">
<i class="bi bi-truck display-2 text-primary"></i>
<h3 class="card-subtitle ">Servicio de despacho</h3>
</div>
</article>
<article class="container col-6 col-md-3 text-start p-2 border border-primary rounded shadow-lg bg-light bg-primary ">
<div class="card fixed-height-info">
<div class="card-body text-center">
<i class="bi bi-geo-alt display-2 text-primary"></i>
<h3 class="card-subtitle ">Ubicación accesible</h3>
</div>
</article>
<article class="container col-6 col-md-3 text-start p-2 border border-primary rounded shadow-lg bg-light bg-primary ">
<div class="card fixed-height-info">
<div class="card-body text-center">
<i class="bi bi-clock display-2 text-primary"></i>
<h3 class="card-subtitle ">Abierto hasta las 12pm</h3>
</div>
</article>
</div>
</section>
<!-- PIE DE PÁGINA -->
<footer class="footer bg-dark text-light p-3 m-0 text-center mt-auto py-3">
<p class="">Eva 2 Front End</p>
<p class="">~ Sebastián López ~</p>
</footer>
<!-- BOOTSTRAP 5 - JS - JQUERY - POPPER -->
<script src="js/jquery-3.7.0.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>