-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
139 lines (134 loc) · 6.46 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="style.css">
<title>Alura Projects</title>
<link rel="shortcut icon" href="/assets/img/logo.png">
</head>
<body>
<!-- SECCION INICIO -->
<section id="inicio">
<div class="contenido">
<header>
<div class="contenido-header">
<h1><a href="https://github.com/AnderMendoza/Alura-Projects">AP</a></h1>
<nav id="nav" class="">
<ul id="links">
<li><a href="#inicio" class="seleccionado" onclick="seleccionar(this)">INICIO</a></li>
<li><a href="#sobreone" onclick="seleccionar(this)">SOBRE ONE</a></li>
<li><a href="#misproyectos" onclick="seleccionar(this)">MIS PROYECTOS</a></li>
</ul>
</nav>
<!-- Icono del menu responsive -->
<div id="icono-nav" onclick="responsiveMenu()">
<i class="fa-solid fa-bars"></i>
</div>
<!-- Redes sociales -->
<div class="redes">
<a href="https://www.linkedin.com/in/anderson-mendoza-ramos/"><i class="fa-brands fa-linkedin"></i></a>
<a href="https://github.com/AnderMendoza"><i class="fa-brands fa-github"></i></a>
<a href="https://twitter.com/andersonmr5302"><i class="fa-brands fa-twitter-square"></i></a>
</div>
</div>
</header>
<div class="presentacion">
<p class="bienvenida">BIENVENIDOS</p>
<h2>Soy <span>Anderson Mendoza</span>, Desarrollador Web</h2>
<p class="descripcion">En este sitio web inserto todos los proyectos que he realizado en el transcurso de mi formación dentro del programa ONE de Oracle en colaboración con Alura.</p>
<a href="#misproyectos">Ir a proyectos</a>
</div>
</div>
</section>
<!-- SECCION SOBRE ONE -->
<section id="sobreone">
<div class="contenedor-foto">
<img src="/assets/img/oracleAlura.png" alt="">
</div>
<div class="sobreone">
<p class="titulo-seccion">Sobre ONE</p>
<h2>Patrocinado por <span>Oracle y Alura Latam</span> </h2>
<h3>Aprender tecnología vale mucho, pero no necesita tener costo.</h3>
<p>ONE es un programa de educación y empleabilidad con el objetivo social de formar personas en tecnología y conectarlas con el mercado laboral a través de a través de empresas colaboradoras.</p>
<p>El programa equipa a los estudiantes con habilidades técnicas y conductuales para actuar como Jr. Developer, un profesional que trabaja para crear y mejorar sitios web, software y aplicaciones, y los prepara para obtener una oportunidad laboral.</p>
<a href="https://www.oracle.com/pe/education/oracle-next-education/#about-course">Más Información</a>
</div>
</section>
<!-- SECCION MIS PROYECTOS -->
<section id="misproyectos">
<h3 class="titulo-seccion">Mis Proyectos</h3>
<div class="fila">
<div class="proyecto"><a href="/projectCanvas/index.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto1.png" alt="">
<div class="info">
<h4>Mini-Proyectos en Canvas</h4>
<p>Practicando con distintas funciones</p>
</div>
</a>
</div>
<div class="proyecto"><a href="/projectLayouts/index.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto2.png" alt="">
<div class="info">
<h4>Desarrollo Web Apeperia</h4>
<p>Trabajando con layouts mobile</p>
</div>
</a>
</div>
<div class="proyecto"><a href="/projectFlexbox/index.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto3.png" alt="">
<div class="info">
<h4>Desarrollo Web Mini Alura</h4>
<p>Posicionando elementos con Flexbox</p>
</div>
</a>
</div>
</div>
<div class="fila">
<div class="proyecto"><a href="/projectArchitectureCSS/index.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto4.png" alt="">
<div class="info">
<h4>Desarrollo Web Fruta & Fruto</h4>
<p>Practicando las arquitecturas CSS</p>
</div>
</a>
</div>
<div class="proyecto"><a href="/projectDomWithJS/index.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto5.png" alt="">
<div class="info">
<h4>App de tareas</h4>
<p>Practicando DOM con JS</p>
</div>
</a>
</div>
<div class="proyecto"><a href="/projectValidations/registro.html">
<div class="overlay"></div>
<img src="/assets/img/proyecto6.png" alt="">
<div class="info">
<h4>Formulario</h4>
<p>Validaciones en HTML con JS</p>
</div>
</a>
</div>
</div>
</section>
<!-- SECCION FOOTER -->
<footer>
<p>Todos los derechos reservados - 2023</p>
<div class="redes">
<a href="https://www.linkedin.com/in/anderson-mendoza-ramos/"><i class="fa-brands fa-linkedin"></i></a>
<a href="https://github.com/AnderMendoza"><i class="fa-brands fa-github"></i></a>
<a href="https://twitter.com/andersonmr5302"><i class="fa-brands fa-twitter-square"></i></a>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>