Skip to content

Fabián Núñez, Introducción al Desarrollo web (G103) #166

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
fanuneza wants to merge 5 commits into
base: main
Choose a base branch
from
Open

Fabián Núñez, Introducción al Desarrollo web (G103) #166

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
38654f4
Nuevo copy y cambio de tamaño del textarea
fanuneza Jul 3, 2025
a739e10
Fix typo
fanuneza Jul 3, 2025
a0b1888
Buttons to uppercase
fanuneza Jul 3, 2025
162682b
Improved margins
fanuneza Jul 3, 2025
874684f
Improved Contact Form
fanuneza Jul 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 11 additions & 2 deletions assets/css/estilos.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,11 @@ body {
background-position: left;
}

#Hero-Section button,
#Contacto button {
text-transform: uppercase;
}

/* Mis trabajos */

#Mis-trabajos .image-top {
Expand All @@ -27,13 +32,17 @@ body {
color: #373a3c;
}

#Contacto textarea {
min-height: 150px;
}

@media (max-width: 768px) {
#Contacto form label {
font-weight: 400;
}

.navbar-brand{
.navbar-brand {
width: 100px;
}

}
}
85 changes: 40 additions & 45 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<!-- Fork de Fabián Núñez, Introducción al Desarrollo web (G103) -->

<!DOCTYPE html>
<html lang="en">
<html lang="es">

<head>
<meta charset="UTF-8">
Expand Down Expand Up @@ -30,7 +32,7 @@
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0 fs-5">
<li class="nav-item">
<a class="nav-link" href="#">Acerca de mi</a>
<a class="nav-link" href="#">Acerca de mí</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Trabajos</a>
Expand All @@ -45,16 +47,16 @@
</div>
</nav>

<header id="Hero-Section" class="text-light text-end py-5 mt-5">
<header id="Hero-Section" class="text-light text-end py-5 mt-3">
<div class="container">
<div class="ms-auto col-12 col-md-7 ">
<h1 class="display-1 fw-bold my-5">
Comidas del fin <br> del mundo
Olivia Ross: <br> Comidas del fin <br> del mundo
</h1>
<p class="my-5">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, accusamus iusto quibusdam
dignissimos labore sequi. Cupiditate reiciendis eius dolore, illum adipisci harum voluptas iste
mollitia inventore provident labore voluptatum nemo.
Descubro sabores extremos en cada rincón del planeta, desde los hielos de la Patagonia hasta los
mercados más bulliciosos. A través de mi lente, cada plato se convierte en un viaje que despierta al
paladar y al espíritu aventurero.
</p>
<div class="mb-5 pb-5">
<button class="btn btn-lg btn-outline-info text-light me-4">Trabajos</button>
Expand All @@ -68,11 +70,12 @@ <h1 class="display-1 fw-bold my-5">
<section id="Acerca-de-mi" class="container text-center my-5">


<h2 class="display-3 fw-bold my-4">Acerca de mi</h2>
<h2 class="display-3 fw-bold my-4">Acerca de mí</h2>

<p class="my-4">
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Odio quisquam distinctio, odit laborum aliquam
earum itaque cum sequi, dolorem optio vol
Como fotógrafa y narradora visual, vivo para capturar momentos y sabores que despiertan emociones. Mi pasión
es contar historias auténticas a través de cada imagen, inspirando a otros a explorar el mundo con
curiosidad.
</p>


Expand All @@ -81,30 +84,27 @@ <h2 class="display-3 fw-bold my-4">Acerca de mi</h2>
<i class="fas fa-camera fa-3x my-3"></i>
<h3 class="my-3 fw-bold">Fotógrafa de comida</h3>
<p class="my-3">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat.
Capturo la esencia de cada plato con cuidadoso detalle: texturas, colores y formas que transmiten
sabor antes de probarlo. Mi objetivo es contar historias culinarias que despierten el hambre y el
asombro en cada imagen.
</p>
</div>
<div class="col-12 col-md-4">
<i class="fas fa-bullhorn fa-3x my-3"></i>
<h3 class="my-3 fw-bold">Crítica culinaria</h3>
<p class="my-3">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat.
Pruebo y analizo propuestas gastronómicas con ojo crítico y paladar exigente, valorando técnica,
equilibrio y presentación. Mis reseñas ofrecen al lector una guía honesta para descubrir lo mejor de
la cocina local e internacional.
</p>
</div>
<div class="col-12 col-md-4">
<i class="far fa-map fa-3x my-3"></i>
<h3 class="my-3 fw-bold">Bloggera de viajes</h3>
<p class="my-3">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat.
Recorro destinos remotos en busca de tradiciones y sabores únicos, documentando experiencias que
mezclan cultura, paisaje y gastronomía. Mis relatos invitan al lector a soñar con rutas por
descubrir y aromas por saborear.
</p>
</div>
</div>
Expand All @@ -113,19 +113,18 @@ <h3 class="my-3 fw-bold">Bloggera de viajes</h3>

<section id="Mis-trabajos" class="my-5 p-5 bg-info">

<h2 class="display-4 fw-bold text-center text-light mb-3">Mis trabajos</h2>
<h2 class="display-4 fw-bold text-center text-light mb-4">Mis trabajos</h2>

<div class="row">
<div class="col-12 col-sm-4 py-2">
<div class="card">
<div class="card h-100">
<div class="image-top" style="background-image: url(assets/img/card-1.jpg)"></div>
<div class="card-body">
<h5 class="card-title fw-bold">Asado en la Patagonia</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Explicabo iure sint, perspiciatis distinctio molestias nihil
repudiandae neque rem adipisci repellendus libero illo quo
blanditiis, velit quasi ad, recusandae voluptates officia.
Acompañé a una familia de gauchos junto al fuego, capturando el humo y la camaradería que
rodean el ritual del asado. Cada fotografía refleja el paisaje helado, el crepitar de la
leña y la pasión ancestral que une a los comensales.
</p>
<button type="button" class="btn btn-outline-info">
Ver más
Expand All @@ -134,15 +133,14 @@ <h5 class="card-title fw-bold">Asado en la Patagonia</h5>
</div>
</div>
<div class="col-12 col-sm-4 py-2">
<div class="card">
<div class="card h-100">
<div class="image-top" style="background-image: url(assets/img/card-2.jpg)"></div>
<div class="card-body">
<h5 class="card-title fw-bold">Papas del fin del mundo</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Deserunt a culpa doloremque voluptatem dicta nam. Maxime ipsum,
consequatur quos error fuga excepturi quo. Laudantium optio
pariatur laboriosam modi, ea molestias?
Exploré las variedades autóctonas de papa en zonas australes, retratando matices de color y
formas que hablan de historia y resiliencia. Mis imágenes destacan la labor de los
agricultores y la riqueza de un cultivo milenario.
</p>
<button type="button" class="btn btn-outline-info">
Ver más
Expand All @@ -151,15 +149,14 @@ <h5 class="card-title fw-bold">Papas del fin del mundo</h5>
</div>
</div>
<div class="col-12 col-sm-4 py-2">
<div class="card">
<div class="card h-100">
<div class="image-top" style="background-image: url(assets/img/card-3.jpg)"></div>
<div class="card-body">
<h5 class="card-title fw-bold">Salmones de Alaska</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Obcaecati facere quibusdam sint id laborum magni velit ducimus
corporis facilis qui architecto dolor, accusamus eveniet
exercitationem fugit. Quod autem neque ducimus.
Realicé una serie fotográfica en los estuarios donde migran los salmones, mostrando su
brillante escama bajo la luz del amanecer. Capté la fuerza del agua y la elegancia del
movimiento en cada salto.
</p>
<button type="button" class="btn btn-outline-info">
Ver más
Expand All @@ -173,15 +170,13 @@ <h5 class="card-title fw-bold">Salmones de Alaska</h5>



<section id="Contacto" class="container my-5">
<section id="Contacto" class="container my-5 w-50">

<h2 class="display-4 fw-bold text-center my-4">Contáctame</h2>

<p class="text-center my-4 d-none d-md-block">Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Doloribus
sapiente, autem delectus totam expedita
animi corporis dolorem qui magnam, aspernatur officiis quasi culpa tempora est commodi. Voluptate beatae
tempora quaerat?</p>
<p class="text-center my-4 d-none d-md-block">Si quieres dar vida a tu proyecto con imágenes que inspiren o una
reseña detallada, no dudes en escribirme. Estoy disponible para colaboraciones, sesiones editoriales o
cualquier propuesta que eleve tu marca culinaria o de viajes.</p>

<form>

Expand Down Expand Up @@ -215,7 +210,7 @@ <h2 class="display-4 fw-bold text-center my-4">Contáctame</h2>


<footer class="bg-dark text-center text-light p-4">
<p class="mb-0">Olivia Ros 2019. Todos los derechos reservados.</p>
<p class="mb-0">Olivia Ros 2025. Todos los derechos reservados.</p>
</footer>


Expand Down