This repository has been archived by the owner on Aug 14, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #35 from ssofiasandoval/main
agregar encargo ssofiasandoval
- Loading branch information
Showing
13 changed files
with
430 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,19 @@ | ||
# encargo-04: 1)Añadir a la pagina web una forma de contactar, agregando instagram. 2)Añadir otra forma de portafolio, para que existan más posibilidades de template. | ||
# encargo-04: 1)Añadir a la pagina web una forma de contactar 2)Añadir otra forma de portafolio, para que existan más posibilidades de template. | ||
|
||
Realice diferentes templeate de portafolios, pero que comparten estas principales caracteristicas | ||
|
||
* Acerca de mi: Sección pensada en añadir descripción personal, información de estudios, areas de interes y más. | ||
* Portafolio: Sección pensada en añadir proyectos hechos por los cuales quieres que te | ||
contraten a futuro, cosas que sabes hacer y dominas. | ||
* Hablemos: Sección pensada para contactarte. | ||
* iconos: Al cliquear dirige a los website | ||
|
||
## opción A: | ||
<img width="958" alt="Captura de pantalla 2024-06-08 a la(s) 1 09 52 a m" src="https://github.com/ssofiasandoval/fad9100-2024-1/assets/128400293/38a1266c-2ae0-4c48-8dd5-dd450d020bda"> | ||
|
||
## opción b: | ||
<img width="948" alt="captureb" src="https://github.com/ssofiasandoval/fad9100-2024-1/assets/128400293/1c592ec1-b23c-4de2-a8b2-ad2bbeac2532"> | ||
|
||
## opción c: | ||
<img width="862" alt="Captura de pantalla 2024-06-09 a la(s) 10 02 33 p m" src="https://github.com/ssofiasandoval/fad9100-2024-1/assets/128400293/3cf26278-9f54-4911-a4ca-fd2a6377018c"> | ||
|
||
TODO |
Binary file not shown.
58 changes: 58 additions & 0 deletions
58
bitacoras/ssofiasandoval/encargo-04/aportafolio/index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
<!DOCTYPE html> | ||
<html lang="es"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Sofía Sandoval Labbé - Portafolio</title> | ||
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap" rel="stylesheet"> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"> | ||
<link rel="stylesheet" href="./style.css"> | ||
</head> | ||
<body> | ||
<div class="container"> | ||
<div class="sidebar"> | ||
<h1>Sofía Sandoval Labbé</h1> | ||
<ul> | ||
<li><a href="#acerca-de-mi">Acerca de mí</a></li> | ||
<li><a href="#portafolio">Portafolio</a></li> | ||
<li><a href="#hablemos">Hablemos</a></li> | ||
</ul> | ||
<a href="CV_ssofia.pdf" target="_blank" class="cv-btn">Descargar CV</a> | ||
</div> | ||
<div class="content"> | ||
<section id="acerca-de-mi"> | ||
<h2>Acerca de mí</h2> | ||
<p>Soy Sofía Sandoval Labbé, una apasionada estudiante de diseño interesada en el mundo digital y especializada en UX/UI. Mi objetivo es crear experiencias de usuario intuitivas y atractivas.</p> | ||
</section> | ||
<section id="portafolio"> | ||
<h2>Portafolio</h2> | ||
<div class="carousel"> | ||
<div class="carousel-container"> | ||
<div class="carousel-item"> | ||
<img src="imagen1.jpg" alt="Proyecto 1"> | ||
</div> | ||
<div class="carousel-item"> | ||
<img src="imagen2.jpg" alt="Proyecto 2"> | ||
</div> | ||
<div class="carousel-item"> | ||
<img src="imagen3.jpg" alt="Proyecto 3"> | ||
</div> | ||
</div> | ||
</div> | ||
</section> | ||
<section id="hablemos"> | ||
<h2>Hablemos</h2> | ||
<p>¡Estoy siempre abierta a nuevas oportunidades y colaboraciones! No dudes en ponerte en contacto conmigo.</p> | ||
<div class="contact-icons"> | ||
<a href="https://www.instagram.com/ssofia.sandoval/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/instagram-new.png" alt="Instagram"></a> | ||
<a href="https://www.linkedin.com/in/sofía-sandoval-labbé-531b21240/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/linkedin.png" alt="LinkedIn"></a> | ||
</div> | ||
</section> | ||
</div> | ||
</div> | ||
<footer> | ||
<p>© 2024 Sofía Sandoval Labbé</p> | ||
</footer> | ||
</body> | ||
</html> | ||
|
Binary file not shown.
Binary file added
BIN
+235 KB
bitacoras/ssofiasandoval/encargo-04/bportafolio/Sofía Sandoval Labbé - Portafolio.pdf
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
51 changes: 51 additions & 0 deletions
51
bitacoras/ssofiasandoval/encargo-04/bportafolio/index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
<!DOCTYPE html> | ||
<html lang="es"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Sofía Sandoval Labbé - Portafolio</title> | ||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600&display=swap" rel="stylesheet"> | ||
<link rel="stylesheet" href="./style.css"> | ||
</head> | ||
<body> | ||
<header> | ||
<h1>Hola, soy Sofía</h1> | ||
<p>Estudiante de diseño, interesada en el mundo digital UX/UI</p> | ||
</header> | ||
<nav> | ||
<a href="#sobre-mi">Sobre mí</a> | ||
<a href="#portafolio">Portafolio</a> | ||
<a href="#hablemos">Hablemos</a> | ||
</nav> | ||
<div class="container"> | ||
<section id="sobre-mi" class="section"> | ||
<h2>Sobre mí</h2> | ||
<p>Soy Sofía Sandoval Labbé, estudiante de diseño con una pasión por el mundo digital y el diseño de experiencias de usuario (UX/UI). Mi objetivo es crear interfaces intuitivas y atractivas que mejoren la interacción de los usuarios con la tecnología.</p> | ||
</section> | ||
<section id="portafolio" class="section"> | ||
<h2>Portafolio</h2> | ||
<div class="portfolio-item"> | ||
<h3>Proyecto 1</h3> | ||
<p>Descripción del proyecto 1.</p> | ||
</div> | ||
<div class="portfolio-item"> | ||
<h3>Proyecto 2</h3> | ||
<p>Descripción del proyecto 2.</p> | ||
</div> | ||
<!-- Agrega más proyectos aquí --> | ||
</section> | ||
<section id="hablemos" class="section"> | ||
<h2>Hablemos</h2> | ||
<p>Estoy siempre abierta a nuevas oportunidades y colaboraciones. ¡No dudes en ponerte en contacto conmigo!</p> | ||
<div class="contact-icons"> | ||
<a href="CV_ssofia.pdf" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/resume.png" alt="CV"></a> | ||
<a href="https://www.linkedin.com/in/sof%C3%ADa-sandoval-labb%C3%A9-531b21240/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/linkedin.png" alt="LinkedIn"></a> | ||
<a href="https://www.instagram.com/ssofia.sandoval/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/instagram.png" alt="Instagram"></a> | ||
</div> | ||
</section> | ||
</div> | ||
<footer> | ||
<p>© 2024 Sofía Sandoval Labbé</p> | ||
</footer> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,91 @@ | ||
body { | ||
font-family: 'Montserrat', sans-serif; | ||
margin: 0; | ||
padding: 0; | ||
background-color: #f5f5f5; | ||
color: #333; | ||
} | ||
header { | ||
background-color: #ffffff; | ||
color: #333; | ||
padding: 40px 0; | ||
text-align: center; | ||
border-bottom: 1px solid #ddd; | ||
} | ||
header h1 { | ||
margin: 0; | ||
font-size: 3em; | ||
font-weight: 600; | ||
color: #2C3E50; | ||
} | ||
header p { | ||
margin: 10px 0 0; | ||
font-size: 1.2em; | ||
color: #8e44ad; | ||
} | ||
nav { | ||
background-color: #2C3E50; | ||
padding: 10px 0; | ||
text-align: center; | ||
border-bottom: 1px solid #ddd; | ||
} | ||
nav a { | ||
color: #fff; | ||
margin: 0 15px; | ||
text-decoration: none; | ||
font-size: 1.1em; | ||
font-weight: 400; | ||
} | ||
nav a:hover { | ||
color: #8e44ad; | ||
} | ||
.container { | ||
padding: 40px 20px; | ||
} | ||
.section { | ||
margin-bottom: 60px; | ||
} | ||
h2 { | ||
border-bottom: 2px solid #8e44ad; | ||
padding-bottom: 10px; | ||
font-size: 2.5em; | ||
color: #2C3E50; | ||
font-weight: 600; | ||
} | ||
footer { | ||
background-color: #ffffff; | ||
color: #333; | ||
text-align: center; | ||
padding: 20px 0; | ||
border-top: 1px solid #ddd; | ||
} | ||
.contact-icons { | ||
margin-top: 20px; | ||
} | ||
.contact-icons a { | ||
margin: 0 15px; | ||
text-decoration: none; | ||
} | ||
.contact-icons img { | ||
width: 40px; | ||
height: 40px; | ||
} | ||
.portfolio-item { | ||
margin-bottom: 40px; | ||
padding: 20px; | ||
background-color: #fff; | ||
border: 1px solid #ddd; | ||
border-radius: 8px; | ||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
transition: transform 0.3s, box-shadow 0.3s; | ||
} | ||
.portfolio-item:hover { | ||
transform: translateY(-10px); | ||
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1); | ||
} | ||
.portfolio-item h3 { | ||
margin-top: 0; | ||
font-size: 1.5em; | ||
color: #8e44ad; | ||
font-weight: 600; | ||
} |
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
71 changes: 71 additions & 0 deletions
71
bitacoras/ssofiasandoval/encargo-04/cportafolio/index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
<!DOCTYPE html> | ||
<html lang="es"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Sofía Sandoval Labbé - Portafolio</title> | ||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600&display=swap" rel="stylesheet"> | ||
<link rel="stylesheet" href="./style.css"> | ||
|
||
</head> | ||
<body> | ||
<header> | ||
<h1>Hola, soy Sofía</h1> | ||
<p>Estudiante de diseño, interesada en el mundo digital UX/UI</p> | ||
</header> | ||
<nav> | ||
<a href="#sobre-mi">Sobre mí</a> | ||
<a href="#portafolio">Portafolio</a> | ||
<a href="#hablemos">Hablemos</a> | ||
</nav> | ||
<div class="container"> | ||
<section id="sobre-mi" class="section"> | ||
<h2>Sobre mí</h2> | ||
<p>Soy Sofía Sandoval Labbé, estudiante de diseño con una pasión por el mundo digital y el diseño de experiencias de usuario (UX/UI). Mi objetivo es crear interfaces intuitivas y atractivas que mejoren la interacción de los usuarios con la tecnología.</p> | ||
</section> | ||
<section id="portafolio" class="section"> | ||
<h2>Portafolio</h2> | ||
<div class="portfolio-item"> | ||
<h3>Proyecto 1</h3> | ||
<div class="carousel"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+1+Proyecto+1" class="active" alt="Imagen 1 Proyecto 1"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+2+Proyecto+1" alt="Imagen 2 Proyecto 1"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+3+Proyecto+1" alt="Imagen 3 Proyecto 1"> | ||
<div class="carousel-controls"> | ||
<button onclick="prevSlide(this)">❮</button> | ||
<button onclick="nextSlide(this)">❯</button> | ||
</div> | ||
</div> | ||
<p>Descripción del proyecto 1.</p> | ||
</div> | ||
<div class="portfolio-item"> | ||
<h3>Proyecto 2</h3> | ||
<div class="carousel"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+1+Proyecto+2" class="active" alt="Imagen 1 Proyecto 2"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+2+Proyecto+2" alt="Imagen 2 Proyecto 2"> | ||
<img src="https://via.placeholder.com/600x400?text=Imagen+3+Proyecto+2" alt="Imagen 3 Proyecto 2"> | ||
<div class="carousel-controls"> | ||
<button onclick="prevSlide(this)">❮</button> | ||
<button onclick="nextSlide(this)">❯</button> | ||
</div> | ||
</div> | ||
<p>Descripción del proyecto 2.</p> | ||
</div> | ||
<!-- Agrega más proyectos aquí --> | ||
</section> | ||
<section id="hablemos" class="section"> | ||
<h2>Hablemos</h2> | ||
<p>Estoy siempre abierta a nuevas oportunidades y colaboraciones. ¡No dudes en ponerte en contacto conmigo!</p> | ||
<div class="contact-icons"> | ||
<a href="CV_ssofia.pdf" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/resume.png" alt="CV"></a> | ||
<a href="https://www.linkedin.com/in/sof%C3%ADa-sandoval-labb%C3%A9-531b21240/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/linkedin.png" alt="LinkedIn"></a> | ||
<a href="https://www.instagram.com/ssofia.sandoval/" target="_blank"><img src="https://img.icons8.com/ios-filled/50/000000/instagram.png" alt="Instagram"></a> | ||
</div> | ||
</section> | ||
</div> | ||
<footer> | ||
<p>© 2024 Sofía Sandoval Labbé</p> | ||
</footer> | ||
|
||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
function nextSlide(button) { | ||
const carousel = button.closest('.carousel'); | ||
const slides = carousel.querySelectorAll('img'); | ||
let currentIndex = Array.from(slides).findIndex(slide => slide.classList.contains('active')); | ||
slides[currentIndex].classList.remove('active'); | ||
currentIndex = (currentIndex + 1) % slides.length; | ||
slides[currentIndex].classList.add('active'); | ||
} | ||
|
||
function prevSlide(button) { | ||
const carousel = button.closest('.carousel'); | ||
const slides = carousel.querySelectorAll('img'); | ||
let currentIndex = Array.from(slides).findIndex(slide => slide.classList.contains('active')); | ||
slides[currentIndex].classList.remove('active'); | ||
currentIndex = (currentIndex - 1 + slides.length) % slides.length; | ||
slides[currentIndex].classList.add('active'); | ||
} |
Oops, something went wrong.