feat: Adds Vicente's HTML readme

code-differently · Mar 1, 2024 · 84ff6e5 · 84ff6e5
1 parent 279e36f
commit 84ff6e5
Show file tree

Hide file tree

Showing 2 changed files with 113 additions and 0 deletions.
diff --git a/lesson_01/VicenteVigueras/index.html b/lesson_01/VicenteVigueras/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <h1>How to Work with Vicente Vigueras</h1>
+
+    <h2>Introduction</h2>
+    <p>Here are some things about me:</p>
+    <ol>
+        <li>I proudly drop the fact that I'm from Chile every chance I get</li>
+        <li>I am bilingual</li>
+        <li>I love the outdoors</li>
+        <li>I am an active person; biking, snowboarding, soccer, and gym.</li>
+    </ol>
+    <p>Also, this is where I grew up:</p>
+    <img id="santiago_chile" src="https://storage.googleapis.com/chile-travel-newsite-static-content/2021/08/Vitrina_Centro_santiago.jpg" alt="santiago, chile">
+
+    <h2>My Work Hours</h2>
+    <p>I am a morning person, whether it is working, studying, exercising, or doing an activity with friends/family, I enjoy being up early.</p>
+    <p>Regardless of my schedule, if somebody reaches out to me with a logical and reasonable inquiry. I will undoubtedly help them with a sense of urgency. I am always available to help others.</p>
+
+    <h2>Best Way to Communicate with Me</h2>
+    <p>It really depends. If it is about a critical part of a project, information about opportunities within a company, or even a congratulatory email for achieving a milestone, I will always prefer an email to keep track of this.</p>
+    <p>However, in the practical sense, Microsoft Teams is a great tool to stay connected easily. I can instantly send and respond to messages without the formality and time-consuming effort of emails.</p>
+
+    <img id="duck_gif" src="https://media.tenor.com/XclFYuGpS5UAAAAM/dancing-duck.gif" alt="duck dancing"> 
+
+
+    <h2>How Do I Give Feedback</h2>
+    <p>Preferably in person; if not, through Zoom. I firmly believe that feedback is most effective when conveyed through an active conversation. This approach allows room for clarification in case of misunderstandings and serves to broaden the conversation, facilitating the development of a growth-oriented plan.</p>
+    <h2>Goals and Interests</h2>
+    <p>I have always been intrigued by the future—where our society is heading, the wellbeing of our planet’s ecosystem, and space. I think technology will undeniably play a big role in the development of the human race. One of my goals is to have informed opinions on these topics, share my vision, and show leadership. While this may seem open-ended, here are some things I will do to quantify my goals:</p>
+<ol class="custom-list">
+    <li>Completing this software development program will represent a significant milestone, marking the beginning of my career in technology</li>
+    <li>Applying for an entry job as a software developer (Or as I call it, "software engineer") and start developing my career.</li>
+    <li>Continuing my education in College to earn a bachelor's degree in Computer Science.</li>
+
+</ol>
+
+</body>
+</html>
+
+
+
+
+
+
diff --git a/lesson_01/VicenteVigueras/style.css b/lesson_01/VicenteVigueras/style.css
@@ -0,0 +1,61 @@
+
+
+body {
+    font-family: sans-serif; 
+    line-height: 1.6;
+    min-width: 200px;
+    max-width: 980px;
+    margin: 0 auto;
+    padding: 45px;
+    background-color: #ffffff;  
+    color: #000000;  
+    margin-bottom: 16px
+  }
+
+
+
+  h1, h2 {
+    position: relative;
+
+  }
+
+
+/* underlines titles github style */
+  h1::after, h2::after {
+    content: "";
+    display: block;
+    border-bottom: 1px solid #e1e4e8;
+    margin-top: 0.3em;
+  }
+
+
+/* Adjust the margin between list items as needed */
+ol.custom-list li {
+    margin-bottom: 16px; 
+}
+
+
+/* Maintain the aspect ratio of the image */
+img#santiago_chile {
+
+    max-width: 100%;
+    height: auto; 
+  }
+
+
+
+/* Supposedly adjusts size for other devices such as smartphones/ipads */
+@media (max-width: 767px) {
+    .body {
+        padding: 15px;
+    }
+}
+
+
+/* Dark mode styles when user prefers dark mode */
+@media (prefers-color-scheme: dark) {
+body {
+  background-color: #333333;  /* Dark background color */
+  color: #ffffff;  /* Light text color */
+}
+}