natalia.cancino
/
FrontPastel
1
0
Fork 0
Code Issues Pull Requests Packages Projects 1 Releases Wiki Activity

Modificacion Inicio

This commit is contained in:
prunzinho 2024-05-06 08:29:57 -06:00
parent e280e37940
commit 726e494475
2 changed files with 9 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/AppInicio.css
View File

@ -164,9 +164,9 @@ html {
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
border: 2px solid #fff;
border-radius: 2rem; border-radius: 2rem;
background-color: #fff;
height: 4.4rem; height: 4.4rem;
overflow: hidden; overflow: hidden;
} }
@ -198,7 +198,7 @@ html {
.btn-search i { .btn-search i {
font-size: 2rem; font-size: 2rem;
color: #fff; color: var(--primary-color);
} }
/* ********************************** */ /* ********************************** */
@ -306,7 +306,7 @@ html {
.container-categories { .container-categories {
display: grid; display: grid;
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(2, 1fr);
gap: 3rem; gap: 3rem;
} }

142
frontend/src/AppInicio.jsx
View File

@ -90,10 +90,8 @@ function App() {
</ul> </ul>
<form class="search-form"> <form class="search-form">
<input type="search" placeholder="Buscar..." />
<button class="btn-search">
<FaMagnifyingGlass className="icono-lupa" />
</button>
</form> </form>
</nav> </nav>
</div> </div>
@ -116,17 +114,14 @@ function App() {
<h1 class="heading-1">Mejores Categorías</h1> <h1 class="heading-1">Mejores Categorías</h1>
<div class="container-categories"> <div class="container-categories">
<div class="card-category category-moca"> <div class="card-category category-moca">
<p>Pastel 4 leches</p> <p>Pasteles Personalizados</p>
<span>Ver más</span> <span>Ver más</span>
</div> </div>
<div class="card-category category-expreso"> <div class="card-category category-expreso">
<p>Pastel de Chocolate</p> <p>Pasteles en linea </p>
<span>Ver más</span>
</div>
<div class="card-category category-capuchino">
<p>Pastel de Zarza</p>
<span>Ver más</span> <span>Ver más</span>
</div> </div>
</div> </div>
</section> </section>
@ -268,133 +263,6 @@ function App() {
</div> </div>
<div class="container-products">
<div class="card-product">
<div class="container-img">
<img src={PastelEditado5} alt="Cafe Irish" />
<span class="discount">-13%</span>
<div class="button-group">
<span>
<FaRegEye className="icono-eye"/>
</span>
<span>
<CiHeart className="icono-heart"/>
</span>
</div>
</div>
<div class="content-card-product">
<div class="stars">
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-regular fa-star"></i>
</div>
<h3>Pastel Frambuesa</h3>
<span class="add-cart">
<LuShoppingBasket className="icono-basket-card"/>
</span>
<p class="price">$300 </p>
</div>
</div>
<div class="card-product">
<div class="container-img">
<img
src={PastelEditado6}
alt="Cafe incafe-ingles.jpg"
/>
<span class="discount">-22%</span>
<div class="button-group">
<span>
<FaRegEye className="icono-eye"/>
</span>
<span>
<CiHeart className="icono-heart"/>
</span>
</div>
</div>
<div class="content-card-product">
<div class="stars">
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-regular fa-star"></i>
<i class="fa-regular fa-star"></i>
</div>
<h3>Pastel de Moka</h3>
<span class="add-cart">
<LuShoppingBasket className="icono-basket-card"/>
</span>
<p class="price">$390 <span>$500</span></p>
</div>
</div>
<div class="card-product">
<div class="container-img">
<img
src={PastelEditado3}
alt="Cafe Australiano"
/>
<span class="discount">-22%</span>
<div class="button-group">
<span>
<FaRegEye className="icono-eye"/>
</span>
<span>
<CiHeart className="icono-heart"/>
</span>
</div>
</div>
<div class="content-card-product">
<div class="stars">
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
</div>
<h3>Pastel de Chocolate</h3>
<span class="add-cart">
<LuShoppingBasket className="icono-basket-card"/>
</span>
<p class="price">$3.20</p>
</div>
</div>
<div class="card-product">
<div class="container-img">
<img src={PastelEditado4} alt="Moka" />
<div class="button-group">
<span>
<FaRegEye className="icono-eye"/>
</span>
<span>
<CiHeart className="icono-heart"/>
</span>
</div>
</div>
<div class="content-card-product">
<div class="stars">
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-solid fa-star"></i>
<i class="fa-regular fa-star"></i>
</div>
<h3>Pastel de Zanahoria</h3>
<span class="add-cart">
<LuShoppingBasket className="icono-basket-card"/>
</span>
<p class="price">$450</p>
</div>
</div>
</div>
</section> </section>