diff --git a/about.html b/about.html new file mode 100644 index 0000000..67e723e --- /dev/null +++ b/about.html @@ -0,0 +1,31 @@ + + + + + + Sobre mí + + + +
+ +
+
+
+

Sobre mí

+

Soy estudiante de ingeniería de sistemas y computación en el X ciclo, apasionado por la programación + y el trabajo en equipo en un entorno dinámico. Tengo experiencia en Python, JavaScript, HTML, CSS y + cloud, me interesa aplicar estos conocimientos en proyectos relacionados con ERP. Mi habilidad para + comunicarme y mantener una documentación ordenada me permite cumplir eficazmente con los + requerimientos de desarrollo asignados y participar de manera constructiva en reuniones de equipo

+
+ Foto de Ana García desarrolando un proyecto +
+ + + \ No newline at end of file diff --git a/assets/github.png b/assets/github.png new file mode 100644 index 0000000..fb02a0a Binary files /dev/null and b/assets/github.png differ diff --git a/assets/imagem.png b/assets/imagem.png new file mode 100644 index 0000000..29f8364 Binary files /dev/null and b/assets/imagem.png differ diff --git a/assets/instagram.png b/assets/instagram.png new file mode 100644 index 0000000..6a6b691 Binary files /dev/null and b/assets/instagram.png differ diff --git a/assets/linkedin.png b/assets/linkedin.png new file mode 100644 index 0000000..f8b8441 Binary files /dev/null and b/assets/linkedin.png differ diff --git a/assets/twitch.png b/assets/twitch.png new file mode 100644 index 0000000..c0b9a85 Binary files /dev/null and b/assets/twitch.png differ diff --git a/assets/twitter-novo.png b/assets/twitter-novo.png new file mode 100644 index 0000000..596624e Binary files /dev/null and b/assets/twitter-novo.png differ diff --git a/assets/twitter.png b/assets/twitter.png new file mode 100644 index 0000000..8c528e0 Binary files /dev/null and b/assets/twitter.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..e22ba31 --- /dev/null +++ b/index.html @@ -0,0 +1,44 @@ + + + + + + + Portafolio + + + + +
+ +
+
+
+

+ Eleve tu negocio digital a otro nivel + con un Front-end de calidad! +

+

¡Hola! Soy Alan Huaman, desarrollador Front-end con + especialización en React, HTML y CSS. Ayudo a pequeños + negocios y diseñadores a llevar a cabo buenas ideas. + ¿Hablamos? + +

+
+

Accede a mis redes

+ + Instagram + + GitHub +
+
+ Foto de Ana García desarrolando un proyecto +
+ + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..bb23446 --- /dev/null +++ b/style.css @@ -0,0 +1,138 @@ +@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat&display=swap'); + +:root{ + --color-primario: #000000; + --color-secundario: #F6F6F6; + --color-terciario: #22D4FD; + --color-hover: #272727; + + --fuente-monserrat: 'Montserrat', sans-serif; + --fuente-krona: 'Krona One', sans-serif; + +} + +* { + padding: 0; + margin:0; +} + +body{ + box-sizing: border-box; + background-color: var(--color-primario); + color: var(--color-secundario); +} + +.header{ + padding: 2% 0% 0% 10%; +} + +.header__menu{ + display: flex; + gap: 80px; + +} + +.header__menu__link{ + font-family: var(--fuente-monserrat); + font-size: 1.5rem; + font-weight: 600; + color: var(--color-terciario); + text-decoration: none; +} + +.presentacion { + padding: 6% 10%; + display: flex; + align-items: center; + justify-content: space-between; + gap: 82px; +} + +.presentacion__contenido{ + width: 50%px; + display: flex; + flex-direction: column; + gap: 40px; +} + +.presentacion__contenido__titulo{ + font-size: 2.25rem; + font-family: var(--fuente-krona); +} + +.titulo-destaque { + color: var(--color-terciario); +} + +.presentacion__contenido__texto{ + font-size: 1.5rem; + font-family: var(--fuente-monserrat); +} + +.presentacion__enlaces{ + display: flex; + justify-content: space-between; + flex-direction: column; + align-items: center; + gap: 32px; +} + +.presentacion__enlaces__subtitulo{ + font-family: var(--fuente-krona); + font-size: 1.5rem; + font-weight: 400; +} + +.presentacion__enlaces__link{ + width: 50%; + padding: 21.5px 0; + border-radius: 8px; + text-align: center; + font-family: var(--fuente-monserrat); + font-size: 1.5rem; + font-weight: 600; + text-decoration: none; + color: var(--color-secundario); + border: 4px solid var(--color-terciario); + display: flex; + justify-content: center; + gap: 10px; +} + +.presentacion__enlaces__link:hover{ + background-color: var(--color-hover); +} + +.presentacion__imagen{ + width: 50%; + border-radius: 20px; +} + +.footer{ + background-color: var(--color-terciario); + padding: 24px; + color: var(--color-primario); + text-align: center; + font-family: var(--fuente-monserrat); + font-size: 1.5rem; + font-weight: 400; +} + +@media (max-width: 1000px){ + .header{ + padding: 10%; + } + + .header__menu{ + justify-content: center; + } + + .presentacion{ + flex-direction: column-reverse; + padding: 5%; + } + + .presentacion__contenido{ + width: auto; + } +} \ No newline at end of file