diff --git a/frontend/src/AppInicio.jsx b/frontend/src/AppInicio.jsx index 4ae9b44..bfa061f 100644 --- a/frontend/src/AppInicio.jsx +++ b/frontend/src/AppInicio.jsx @@ -44,6 +44,18 @@ function App() { navigate("/"); }; + const redirectToChocolate = ()=>{ + navigate("/Pasteles/ChocolateBlanco") + }; + + const redirectToMoka = ()=>{ + navigate("/Pasteles/PastelMoka") + }; + + const redirectToChocolate2 = ()=>{ + navigate("/Pasteles/PastelChocolate") + }; + return ( <> @@ -114,11 +126,11 @@ function App() {

Pasteles Personalizados

- Ver más + Ver más

Pasteles en linea

- Ver más + Ver más
@@ -129,8 +141,7 @@ function App() {
Destacados - Más recientes - Mejores Vendidos +
@@ -140,12 +151,7 @@ function App() { Cafe Irish -10%
- - - - - - +
@@ -158,8 +164,8 @@ function App() {

Pastel Chocolate Blanco

- - + +

$603$670

@@ -173,12 +179,7 @@ function App() { /> -30%
- - - - - - +
@@ -191,8 +192,9 @@ function App() {

Pastel de Moka

- - + + +

$560 $800

@@ -206,12 +208,7 @@ function App() { />
- - - - - - +
@@ -224,8 +221,8 @@ function App() {

Pastel de Chocolate

- - + +

$350

@@ -235,12 +232,7 @@ function App() {
Moka
- - - - - - +
@@ -253,8 +245,8 @@ function App() {

Pastel de Zanahoria

- - + +

$450

diff --git a/frontend/src/Pasteles.jsx b/frontend/src/Pasteles.jsx index 147b4de..b8c6bbb 100644 --- a/frontend/src/Pasteles.jsx +++ b/frontend/src/Pasteles.jsx @@ -40,10 +40,34 @@ function AppPasteles() { }; const redirectInicio = () => { - // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); }; + const redirectToChocolate = ()=>{ + navigate("/Pasteles/ChocolateBlanco") + }; + + const redirectToMoka = ()=>{ + navigate("/Pasteles/PastelMoka") + }; + + const redirectToChocolate2 = ()=>{ + navigate("/Pasteles/PastelChocolate") + }; + + const redirectToPastelZanahoria = ()=>{ + navigate("/Pasteles/PastelZanahoria") + }; + + const redirectToPastelFrambuesa = ()=>{ + navigate("/Pasteles/PastelFrambuesa") + }; + + const redirectToPastelCajeta = ()=>{ + navigate("/Pasteles/PastelCajeta") + }; + return ( <> @@ -92,7 +116,7 @@ function AppPasteles() {
@@ -121,16 +145,11 @@ function AppPasteles() {
- Cafe Irish + Pastel Chocolate Blanco -10%
- - - - - - +
@@ -143,27 +162,20 @@ function AppPasteles() {

Pastel Chocolate Blanco

- - + +

$603$670

-
+
Cafe incafe-ingles.jpg -30%
- - - - - -
@@ -176,8 +188,8 @@ function AppPasteles() {

Pastel de Moka

- - + +

$560 $800

@@ -189,14 +201,7 @@ function AppPasteles() { src={PastelEditado3} alt="Cafe Australiano" /> -
- - - - - -
@@ -209,8 +214,8 @@ function AppPasteles() {

Pastel de Chocolate

- - + +

$350

@@ -220,12 +225,8 @@ function AppPasteles() {
Moka
- - - - - - + +
@@ -238,8 +239,8 @@ function AppPasteles() {

Pastel de Zanahoria

- - + +

$450

@@ -250,12 +251,8 @@ function AppPasteles() { Cafe Irish -13%
- - - - - - + +
@@ -268,8 +265,8 @@ function AppPasteles() {

Pastel Frambuesa

- - + +

$300

@@ -283,12 +280,8 @@ function AppPasteles() { /> -22%
- - - - - - + +
@@ -300,9 +293,9 @@ function AppPasteles() { -

Pastel de Moka

- - +

Pastel de Cajeta

+ +

$390 $500

@@ -311,111 +304,11 @@ function AppPasteles() {
- - -
-
- Cafe Australiano - -22% -
- - - - - - - -
-
-
-
- - - - - -
-

Pastel de Chocolate

- - - -

$3.20

-
-
- -
-
- Moka -
- - - - - - - -
-
-
-
- - - - - -
-

Pastel de Zanahoria

- - - -

$450

-
-
- -
-
- Cafe incafe-ingles.jpg - -22% -
- - - - - - - -
-
-
-
- - - - - -
-

Pastel de Moka

- - - -

$390 $500

-
-
- - - - diff --git a/frontend/src/Pasteles/ChocolateBlanco.css b/frontend/src/Pasteles/ChocolateBlanco.css new file mode 100644 index 0000000..f87e124 --- /dev/null +++ b/frontend/src/Pasteles/ChocolateBlanco.css @@ -0,0 +1,580 @@ +@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;500;700&display=swap'); + + + + +.main-pers-pastel { + display: flex; + gap: 30px; + margin-bottom: 80px; + font-family: 'Ubuntu'; + max-width: 1200px; + margin: 0 auto; + margin-top: 20px; + + +} + +.titulo-Pastel{ + font-size: 25px; +} + +/* ********************************** */ +/* HEADER */ +/* ********************************** */ +.container-hero { + background-color: var(--background-color); +} + +.hero { + display: flex; + justify-content: space-between; + align-items: center; + padding: 2rem 0; +} + +.customer-support { + display: flex; + align-items: center; + gap: 2rem; +} + +.customer-support i { + font-size: 3.3rem; +} + +.content-customer-support { + display: flex; + flex-direction: column; +} + +.container-logo { + display: flex; + align-items: center; + gap: 0.5rem; +} + +.container-logo i { + font-size: 3rem; +} + +.container-logo h1 a { + text-decoration: none; + color: #000; + font-size: 3rem; + text-transform: uppercase; + letter-spacing: -1px; +} + +.container-user { + display: flex; + gap: 1rem; + cursor: pointer; +} + +.container-user .fa-user { + font-size: 3rem; + color: var(--primary-color); + padding-right: 2.5rem; + border-right: 1px solid #e2e2e2; +} + +.container-user .fa-basket-shopping { + font-size: 3rem; + color: var(--primary-color); + padding-left: 1rem; +} + +.content-shopping-cart { + display: flex; + flex-direction: column; +} + +/* ************* NAVBAR ************* */ +.container-navbar { + background-color: var(--primary-color); +} + +.navbar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem 0; + color: white; +} + +.navbar .fa-bars { + display: none; +} + +.menu { + display: flex; + gap: 2rem; + +} + +.menu li { + list-style: none; +} + +.menu a { + text-decoration: none; + font-size: 1.3rem; + color: var(--dark-color); + font-weight: 600; + text-transform: uppercase; + position: relative; + color: white; +} + +.menu a::after { + content: ''; + width: 1.5rem; + height: 1px; + background-color: #fff; + position: absolute; + bottom: -3px; + left: 50%; + transform: translate(-50%, 50%); + opacity: 0; + transition: all 0.3s ease; +} + +.menu a:hover::after { + opacity: 1; +} + +.menu a:hover { + color: #fff; +} + +.search-form { + position: relative; + display: flex; + align-items: center; + border: 2px solid #fff; + border-radius: 2rem; + background-color: #fff; + height: 4.4rem; + overflow: hidden; +} + +.search-form input { + outline: none; + font-family: inherit; + border: none; + width: 25rem; + font-size: 1.4rem; + padding: 0 2rem; + color: #777; + cursor: pointer; +} + +.search-form input::-webkit-search-cancel-button { + appearance: none; +} + +.search-form .btn-search { + border: none; + background-color: var(--primary-color); + display: flex; + align-items: center; + justify-content: center; + height: 100%; + padding: 1rem; +} + +.btn-search i { + font-size: 2rem; + color: #fff; +} + + +.container-title { + padding: 30px; + background-color: #eee; + margin-bottom: 50px; + color: #222; +} + + + + + + +.chocolate-blanco { + background-color: #f7f7f9; + background-image: url('/assets/pastel-zarza.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} + +.container-info-product { + flex: 1; + display: flex; + flex-direction: column; +} + +.container-price { + padding-bottom: 20px; + border-bottom: 1px solid #e4e4e4; + display: flex; + align-items: center; + justify-content: space-between; +} + +.container-price span { + font-size: 24px; + font-weight: 300; +} + +.container-details-product { + padding: 30px 0; + padding-bottom: 0px; +} + +.opcionesPers{ + +} + +.textPersPastel{ + font-size: 18px; + font-weight: 900; + margin-bottom: 10px; +} + +.pastel-Type{ + font-size: 18px; + font-weight: 900; + font-weight: lighter; + margin-bottom: 10px; +} + +.pastel-Type1{ + font-size: 18px; + font-weight: lighter; + margin-bottom: 10px; + color: #8B374A; +} + +.botones-pastel{ + display: flex; + gap: 4; + margin-bottom: 20px; + +} + +.boton-1{ + margin-right: 10px; + border: none; + color: white; + padding: 14px 28px; + cursor: pointer; + border-radius: 5px; + background-color: #8B374A +} + +.boton-1:hover { + background-color: #4b1e29; /* Cambia el color al pasar el cursor sobre el botón */ + } + + .boton-1:active { + transform: scale(0.90); /* Reduce ligeramente el tamaño del botón cuando se hace clic */ + } + + .boton-2{ + margin-right: 10px; + border: none; + color: white; + padding: 14px 28px; + cursor: pointer; + border-radius: 5px; + background-color: #8B374A +} + +.boton-2:hover { + background-color: #4b1e29; /* Cambia el color al pasar el cursor sobre el botón */ + } + + .boton-2:active { + transform: scale(0.90); /* Reduce ligeramente el tamaño del botón cuando se hace clic */ + } + + .boton-3{ + margin-right: 10px; + border: none; + color: white; + padding: 14px 28px; + cursor: pointer; + border-radius: 5px; + background-color: #8B374A +} + +.boton-3:hover { + background-color: #4b1e29; /* Cambia el color al pasar el cursor sobre el botón */ + } + + .boton-3:active { + transform: scale(0.90); /* Reduce ligeramente el tamaño del botón cuando se hace clic */ + } + + .boton-4{ + border: none; + color: white; + padding: 14px 28px; + cursor: pointer; + border-radius: 5px; + background-color: #8B374A +} + +.boton-4:hover { + background-color: #4b1e29; /* Cambia el color al pasar el cursor sobre el botón */ + } + + .boton-4:active { + transform: scale(0.90); /* Reduce ligeramente el tamaño del botón cuando se hace clic */ + } + +.label-text-pers{ + margin-top: 10px; + font-size: 16px; + font-weight: lighter; + margin-bottom: 10px; + +} + +.input-text-pers{ + margin-top: 10px; + font-size: 16px; + margin-bottom: 10px; + text-indent: 5px; + width: 100%; + height: 50px; + +} + +.form-group { + display: flex; + align-items: center; + gap: 20px; + margin-bottom: 15px; +} + +.form-group label { + width: 100px; + color: #222; + font-weight: 700; +} + +.form-group select { + width: 300px; + border: none; + padding: 12px 15px; + background-color: #f7f7f7; + outline: none; + color: #666; +} + +.btn-clean { + border: none; + background: none; + color: #666; + margin-left: 120px; + cursor: pointer; +} + +.btn-clean:hover { + color: #1bbeb4; +} + +.container-add-cart { + display: flex; + gap: 20px; + padding-bottom: 30px; + border-bottom: 1px solid #e4e4e4; +} + +.container-quantity { + position: relative; +} + +.input-quantity { + background-color: #f7f7f7; + border: none; + padding: 10px; + width: 60px; + height: 100%; + color: #666; + font-weight: 500; + line-height: 0; +} + +.input-quantity:focus { + outline: none; +} + +.input-quantity::-webkit-inner-spin-button, +.input-quantity::-webkit-outer-spin-button { + -webkit-appearance: none; + appearance: none; +} + + +.fa-chevron-down:hover { + color: #1bbeb4; +} + +.fa-chevron-up:hover { + color: #1bbeb4; +} + +.btn-add-to-cart{ + border: none; + color: white; + padding: 14px 28px; + cursor: pointer; + border-radius: 5px; + background-color: #8B374A +} + +.btn-add-to-cart:hover { + background-color: #4b1e29; /* Cambia el color al pasar el cursor sobre el botón */ + } + + .btn-add-to-cart:active { + transform: scale(0.90); /* Reduce ligeramente el tamaño del botón cuando se hace clic */ + } + +.hidden { + display: none; +} + +.container-description, +.container-additional-information, +.container-reviews { + display: flex; + flex-direction: column; + border-bottom: 1px solid #e4e4e4; + padding: 10px 0; +} + +.title-description, +.title-additional-information, +.title-reviews { + display: flex; + align-items: center; + justify-content: space-between; + cursor: pointer; +} + +.title-description h4, +.title-additional-information h4, +.title-reviews h4 { + font-weight: 300; + color: #666; + font-size: 14px; +} + +.text-description, +.text-additional-information, +.text-reviews { + font-size: 13px; + color: #252525; + line-height: 22px; + margin-top: 25px; +} + +.container-social { + display: flex; + justify-content: space-between; + padding: 10px 0; + align-items: center; + border-bottom: 1px solid #e4e4e4; +} + +.container-social span { + font-weight: 300; + color: #252525; +} + +.container-buttons-social { + display: flex; + gap: 15px; + align-items: center; +} + +.container-buttons-social a:link, +.container-buttons-social a:visited { + color: #666; + font-size: 15px; +} + +.container-buttons-social a:hover { + color: #1bbeb4; +} + +.container-related-products h2 { + text-align: center; + margin-bottom: 30px; +} + +.card-list-products { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 25px; +} + +.card { + cursor: pointer; +} + +.card-img { + background: transparent; + margin-bottom: 15px; +} + +.card-img img { + height: 400px; + object-fit: cover; + box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2); +} + +.info-card { + display: flex; + justify-content: space-between; +} + +.text-product { + color: #252525; + font-weight: 300; + line-height: 1.4; +} + +.text-product h3{ + color: inherit; + font-weight: inherit; + font-size: 15px; +} + +.text-product h3:hover{ + color: #1bbeb4; +} + +.text-product p{ + color: #666; + font-size: 13px; +} + +.text-product p:hover{ + color: #1bbeb4; +} + +footer { + padding: 30px; + background-color: #eee; + margin-top: 50px; + color: #222; +} \ No newline at end of file diff --git a/frontend/src/Pasteles/ChocolateBlanco.jsx b/frontend/src/Pasteles/ChocolateBlanco.jsx new file mode 100644 index 0000000..2bdd63a --- /dev/null +++ b/frontend/src/Pasteles/ChocolateBlanco.jsx @@ -0,0 +1,245 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function ChocolateBlanco() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ {} +
+
+
+ +

Pastel De Chocolate

+ +
+ +
+
+
+

Precio:

$400

+ +

Tamaño:

Grande

+ +
+
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default ChocolateBlanco; \ No newline at end of file diff --git a/frontend/src/Pasteles/PastelCajeta.jsx b/frontend/src/Pasteles/PastelCajeta.jsx new file mode 100644 index 0000000..5c0d687 --- /dev/null +++ b/frontend/src/Pasteles/PastelCajeta.jsx @@ -0,0 +1,246 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function PastelCajeta() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ {} +
+
+
+ +

Pastel De Chocolate

+ +
+ +
+
+
+

Precio:

$400

+ +

Tamaño:

Grande

+ +
+
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default PastelCajeta; \ No newline at end of file diff --git a/frontend/src/Pasteles/PastelChocolate.jsx b/frontend/src/Pasteles/PastelChocolate.jsx new file mode 100644 index 0000000..eb4515c --- /dev/null +++ b/frontend/src/Pasteles/PastelChocolate.jsx @@ -0,0 +1,246 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function PastelChocolate() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ +
+
+
+ +

Pastel De Chocolate

+ +
+ +
+
+
+

Personaliza tu pastel

+
+

Tipo de Pastel

+ +
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default PastelChocolate; \ No newline at end of file diff --git a/frontend/src/Pasteles/PastelFrambuesa.jsx b/frontend/src/Pasteles/PastelFrambuesa.jsx new file mode 100644 index 0000000..eb7bbcd --- /dev/null +++ b/frontend/src/Pasteles/PastelFrambuesa.jsx @@ -0,0 +1,245 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function PastelFrambuesa() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ {} +
+
+
+ +

Pastel De Chocolate

+ +
+ +
+
+
+

Precio:

$400

+ +

Tamaño:

Grande

+ +
+
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default PastelFrambuesa; \ No newline at end of file diff --git a/frontend/src/Pasteles/PastelMoka.jsx b/frontend/src/Pasteles/PastelMoka.jsx new file mode 100644 index 0000000..1dc2160 --- /dev/null +++ b/frontend/src/Pasteles/PastelMoka.jsx @@ -0,0 +1,246 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function PastelMoka() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ +
+
+
+ +

Pastel De Moka

+ +
+ +
+
+
+

Personaliza tu pastel

+
+

Tipo de Pastel

+ +
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default PastelMoka; \ No newline at end of file diff --git a/frontend/src/Pasteles/PastelZanahoria.jsx b/frontend/src/Pasteles/PastelZanahoria.jsx new file mode 100644 index 0000000..a6459c0 --- /dev/null +++ b/frontend/src/Pasteles/PastelZanahoria.jsx @@ -0,0 +1,245 @@ +import React, { useState } from "react"; + +import { RiCustomerService2Fill } from "react-icons/ri"; +import { FaUser } from "react-icons/fa"; +import { LuShoppingBasket } from "react-icons/lu"; +import { FaMagnifyingGlass } from "react-icons/fa6"; +import { CiHeart } from "react-icons/ci"; +import { FaRegEye } from "react-icons/fa"; +import { CiShare2 } from "react-icons/ci"; +import { useNavigate } from "react-router-dom"; +import './ChocolateBlanco.css'; + + +function PastelZanahoria() { + const navigate = useNavigate(); + + const redirectPersonalizarPastelArcoiris = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/PersonalizarPastel/PastelArcoiris"); + }; + + const redirectToPedidos = () => { + navigate("/Pedidos"); + + }; + + const redirectToPasteles = () => { + navigate("/Pasteles"); + }; + + const redirectInicio = () => { + // Redirige a la página del hotel cuando se hace clic en el botón + navigate("/"); + }; + + + return ( + <> + +
+ +
+
+
+ +
+ + Soporte al cliente + 123-456-7890 + +
+
+ + + +
+ + +
+ Carrito + (0) +
+
+
+
+ + +
+ +
+ + +
+ +
+
+ {} +
+
+
+ +

Pastel De Chocolate

+ +
+ +
+
+
+

Precio:

$400

+ +

Tamaño:

Grande

+ +
+
+
+ +
+
+
+
+ +
+ +
+ +
+
+

Descripción

+ +
+
+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. + Laboriosam iure provident atque voluptatibus reiciendis quae + rerum, maxime placeat enim cupiditate voluptatum, temporibus + quis iusto. Enim eum qui delectus deleniti similique? Lorem, + ipsum dolor sit amet consectetur adipisicing elit. Sint autem + magni earum est dolorem saepe perferendis repellat ipsam + laudantium cum assumenda quidem quam, vero similique? Iusto + officiis quod blanditiis iste? +

+
+
+ +
+
+

Información adicional

+ +
+
+

-----------

+
+
+ +
+
+

Reseñas

+ +
+
+

-----------

+
+
+ +
+ Compartir +
+ + + + + +
+
+
+
+ + + + ); +} + +export default PastelZanahoria; \ No newline at end of file diff --git a/frontend/src/PersPastelStyle.css b/frontend/src/PersPastelStyle.css index 6a0fcc3..1ca6eea 100644 --- a/frontend/src/PersPastelStyle.css +++ b/frontend/src/PersPastelStyle.css @@ -207,6 +207,67 @@ background-size: 100% auto; } + + +.container-img-2 { + background-color: #f7f7f9; + background-image: url('assets/Edicion21.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} +.container-img-3 { + background-color: #f7f7f9; + background-image: url('assets/Edicion12.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} +.container-img-4 { + background-color: #f7f7f9; + background-image: url('assets/Edicion13.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} +.container-img-5 { + background-color: #f7f7f9; + background-image: url('assets/Edicion14.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} + +.container-img-6 { + background-color: #f7f7f9; + background-image: url('assets/Edicion15.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} + +.container-img-7 { + background-color: #f7f7f9; + background-image: url('assets/Edicion16.jpg'); + flex: 1; + width: 55%; + height: 100%; + padding-top: 60.4%; + background-size: 100% auto; +} + + + .imgPastel{ flex: 1; width: 100%; diff --git a/frontend/src/assets/Edicion12.jpg b/frontend/src/assets/Edicion12.jpg new file mode 100644 index 0000000..824e201 Binary files /dev/null and b/frontend/src/assets/Edicion12.jpg differ diff --git a/frontend/src/assets/Edicion13.jpg b/frontend/src/assets/Edicion13.jpg new file mode 100644 index 0000000..79de260 Binary files /dev/null and b/frontend/src/assets/Edicion13.jpg differ diff --git a/frontend/src/assets/Edicion14.jpg b/frontend/src/assets/Edicion14.jpg new file mode 100644 index 0000000..4d97d70 Binary files /dev/null and b/frontend/src/assets/Edicion14.jpg differ diff --git a/frontend/src/assets/Edicion15.jpg b/frontend/src/assets/Edicion15.jpg new file mode 100644 index 0000000..3eec966 Binary files /dev/null and b/frontend/src/assets/Edicion15.jpg differ diff --git a/frontend/src/assets/Edicion16.jpg b/frontend/src/assets/Edicion16.jpg new file mode 100644 index 0000000..b9cbd2d Binary files /dev/null and b/frontend/src/assets/Edicion16.jpg differ diff --git a/frontend/src/assets/Edicion21.jpg b/frontend/src/assets/Edicion21.jpg new file mode 100644 index 0000000..c1dd29a Binary files /dev/null and b/frontend/src/assets/Edicion21.jpg differ diff --git a/frontend/src/main.jsx b/frontend/src/main.jsx index bf71533..d0932ce 100644 --- a/frontend/src/main.jsx +++ b/frontend/src/main.jsx @@ -6,7 +6,12 @@ import PersPastel1 from './PersPastel1.jsx' import Pedidos from './Pedidos.jsx' import Pasteles from './Pasteles.jsx' import LoginForm from './LoginForm.jsx'; - +import ChocolateBlanco from './Pasteles/ChocolateBlanco.jsx'; +import PastelMoka from './Pasteles/PastelMoka.jsx'; +import PastelChocolate from './Pasteles/PastelChocolate.jsx'; +import PastelZanahoria from './Pasteles/PastelZanahoria.jsx'; +import PastelFrambuesa from './Pasteles/PastelFrambuesa.jsx'; +import PastelCajeta from './Pasteles/PastelCajeta.jsx'; createRoot(document.getElementById('root')).render( @@ -17,6 +22,12 @@ createRoot(document.getElementById('root')).render( }/> }/> }/> + }/> + }/> + }/> + }/> + }/> + }/> ,