Merge pull request #382 from veritocapito/main

ej HTML semantico
undefined-academy · Jan 14, 2024 · df65c1e · df65c1e
2 parents 8145fe1 + 195ea36
commit df65c1e
Show file tree

Hide file tree

Showing 3 changed files with 143 additions and 0 deletions.
diff --git a/student-cvs/VeronicaCapobianco-6597/index.html b/student-cvs/VeronicaCapobianco-6597/index.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="./styles.css">
+        <title>Veronica Capobianco</title>
+    </head>
+
+    <body>
+        <header>
+            <h1>Veronica Capobianco</h1>
+            <h2>FrontEnd Developer / Buenos Aires - Argentina</h2>
+        </header>
+        <main>
+            <h3>Sobre mi</h3>
+            <figure>
+                <img src="./profile.png" alt="imagen de perfil" width="200">
+            </figure>
+            <ul>
+                <li>🌱 Actualmente me estoy capacitando en <strong>Javascript, React and Nodejs</strong></li>
+                <li>📫 Escribime a <a href="mailto:[email protected]">[email protected]</a></li>
+                <li>✨Conecta conmigo aquí: <a
+                        href="/https://linkedin.com/in/vscapobianco">linkedin.com/in/vscapobianco</a></li>
+            </ul>
+        </main>
+        <section>
+            <h3>Proyectos</h3>
+            <p>👨‍💻 Todos mis trabajos estan disponibles en mi 
+                <a href="https://portfolio-workertech.vercel.app/">Portfolio</a>
+            </p>
+        </section>
+        <section>
+            <h3>Dejame tu mensaje</h3>
+            <form id="contact_form">
+              <div class="row">
+                <label class="required" for="name">Nombre:</label>
+                <input id="name" class="input" name="name" type="text" />
+                <span id="name_validation" class="error_message"></span>
+              </div>
+              <div class="row">
+                <label class="required" for="email">Email:</label>
+                <input id="email" class="input" name="email" type="text" />
+                <span id="email_validation" class="error_message"></span>
+              </div>
+              <div class="row">
+                <label class="required" for="message">Mensaje:</label>
+                <textarea id="message" class="input" name="message" rows="7" cols="30"></textarea>
+                <span id="message_validation" class="error_message"></span>
+              </div>
+
+                <input id="submit_button" type="submit" value="Enviar mensaje" class="btn" />
+            </form>
+        </section>
+        <footer>
+            <p>2024 - @veritocapito</p>
+        </footer>
+
+    </body>
+
+</html>
diff --git a/student-cvs/VeronicaCapobianco-6597/profile.png b/student-cvs/VeronicaCapobianco-6597/profile.png
diff --git a/student-cvs/VeronicaCapobianco-6597/styles.css b/student-cvs/VeronicaCapobianco-6597/styles.css
@@ -0,0 +1,81 @@
+body {
+	max-width: 600px;
+	margin: 0 auto;
+	background: #313132;
+	color: #cebebe;
+	font-family: monospace;
+	font-size: 14px;
+}
+
+*{
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+}
+
+h1{
+	font-size: 48px;
+	color: chartreuse;
+}
+
+h2 {
+	font-style: italic;
+}
+
+h3{
+	color: yellowgreen;
+	font-size: 20px;
+}
+
+main, section{
+	padding: 50px 0;
+}
+
+a{
+	text-decoration: none;
+	color: yellowgreen;
+}
+
+p {
+	line-height: 1.5;
+}
+
+figure, form{
+	max-width: 300px;
+	padding: 50px 0;
+	margin: 0 auto;
+}
+
+input, textarea{
+	width: 100%;
+	padding: 8px;
+	margin: 10px 0;
+	background-color: #cebebe;
+	border-radius: 5px;
+	border: none;
+}
+
+textarea{
+	resize: none;
+}
+
+.btn{
+	cursor: pointer;
+	background-color: yellowgreen;
+	font-weight: bold;
+	color: #313132;
+	border: none;
+}
+
+.btn:hover{
+	opacity: 0.8;
+}
+
+footer{
+	text-align: center;
+	padding: 8px;
+	color: yellowgreen;
+}
+
+
+