reformating my portfolio

CodeYourFuture · Oct 25, 2024 · 494bbc8 · 494bbc8
1 parent 319c245
commit 494bbc8
Show file tree

Hide file tree

Showing 2 changed files with 76 additions and 15 deletions.
diff --git a/index.html b/index.html
@@ -9,7 +9,7 @@
       content="The technical portfolio of trainee name"
     />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <!-- suppress FOUC-->
+
     <style>
       html {
         animation: fade-in 1s;
@@ -38,7 +38,7 @@
   </head>
   <body>
     <header>
-      <h1>My Name</h1>
+      <h1>Emmanuel Gessessew</h1>
       <nav>
         <ul>
           <li><a href="#about">About Me</a></li>
@@ -51,34 +51,47 @@ <h1>My Name</h1>
       <section id="about">
         <header><h2>About Me</h2></header>
         <p>
-          Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nulla nisi
-          excepturi quidem, eum rem doloribus quam aspernatur hic enim eligendi
-          commodi minima ullam necessitatibus, cumque blanditiis, nihil magni
-          amet consectetur?
+          Hi, I’m Emmanuel, a passionate and dedicated software developer. I’ve always been fascinated by technology and its ability to solve real-world problems, which led me to pursue a career in software development. I’m currently sharpening my skills through courses at Code Your Future (CYF), where I’ve had the opportunity to dive deeper into various programming languages and software development practices.
+          <br>
+          I thrive on challenges that require creative thinking and problem-solving, whether it’s designing user-friendly applications or tackling complex backend systems. My goal is to continually learn, grow, and apply my skills to build impactful solutions that make a difference.
+          <br>
+          Outside of coding, I am a lifelong learner, always seeking new ways to grow both professionally and personally. Whether it’s through continuous education or tackling new challenges, I am passionate about making a meaningful impact through technology.
         </p>
       </section>
       <section id="projects">
         <header><h2>Projects Showcase</h2></header>
         <p>
-          Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nulla nisi
-          excepturi quidem, eum rem doloribus quam aspernatur hic enim eligendi
-          commodi minima ullam necessitatibus, cumque blanditiis, nihil magni
-          amet consectetur?
+          I am excited to present my portfolio, highlighting key projects that demonstrate my skills and experience.
+           Below, you’ll find links to each project, offering a deeper dive into my work. Click through to explore the details, insights, and results behind each project:
         </p>
+        <ul>
+          <li>
+            <a href="https://github.com/Emmanuelgessessew/Mekellelhometown.git">Mekellelhometown</a> – For my hometown project, I built a dedicated page celebrating Mekelle.
+          </li>
+          <li>
+            <a href="https://github.com/Emmanuelgessessew/Module-User-Focused-Data.git">Wireframe</a> – A completed a wireframe project on Git, where I outlined its functions and benefits. 
+          </li>
+          <li>
+            <a href="https://github.com/Emmanuelgessessew/Module-User-Focused-Data.git">Form</a> –I  designed an engaging form for a T-shirt fundraiser, focusing on user friendly form design to encourage participation and make the ordering process seamless.
+          </li>
+        </ul>
       </section>
       <section id="contact">
         <header><h2>Contact me</h2></header>
         <p>
-          Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nulla nisi
-          excepturi quidem, eum rem doloribus quam aspernatur hic enim eligendi
-          commodi minima ullam necessitatibus, cumque blanditiis, nihil magni
-          amet consectetur?
+          I'm always excited to connect with like-minded professionals, collaborate on projects, or simply chat about tech, design, and innovation.
+           Whether you have a question about my work, a potential project in mind, or just want to reach out, I'd love to hear from you!
         </p>
+        <div class="contact-links">
+          <p><a href="mailto:[email protected]">Email:</a> [email protected]</p>
+          <p><a href="https://www.linkedin.com/in/emmanuel-gessessew-447a102b5">LinkedIn:</a> linkedin.com/in/emmanuel-gessessew-447a102b5</p>
+          <p><a href="https://github.com/Emmanuelgessessew">GitHub:</a> github.com/Emmanuelgessessew</p>
+        </div>
       </section>
     </main>
     <footer>
       <h3>
-        <a href="https://github.com/CodeYourFuture/Portfolio"
+        <a href="https://github.com/Emmanuelgessessew/Portfolio.git"
           ><svg
             focusable="false"
             role="presentation"

diff --git a/style.css b/style.css
@@ -55,3 +55,51 @@ section p {
   line-height: 1.5;
   max-width: 55ch;
 }
+
+.contact-links {
+  text-align: center;
+  margin: 1.5em 0;
+  font-family: Arial, sans-serif;
+}
+
+.contact-links p {
+  margin: 0.3em 0;
+  color: #333333;
+}
+
+.contact-links strong {
+  font-weight: bold;
+  color: #555555;
+}
+
+.contact-links a {
+  color: #006
+}
+
+
+ ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+ li {
+  background-color: hwb(0 98% 2% / 0.317);
+  border: 1px solid #ddd;
+  border-radius: 5px;
+  margin: 10px 0;
+  padding: 15px;
+  transition: background-color 0.3s;
+}
+
+ li:hover {
+  background-color: #e0e0e0;
+}
+
+ a {
+  text-decoration: none;
+  color: #007bff;
+  font-weight: bold;
+}
+ a:hover {
+  text-decoration: underline;
+}