Initial Commit

2025-08-14 18:03:08 +01:00
parent 6490b08e08
commit 916c770216
32 changed files with 1595 additions and 10 deletions
@@ -0,0 +1,114 @@
+<template>
+  <section class="text-white mt-18" id="about">
+    <div class="absolute z-0 top-[93rem] inset-x-0 h-64 flex items-start">
+      <div
+        class="h-24 w-64 bg-gradient-to-br from-primary via-secondary blur-2xl to-[#570cac] opacity-20"
+      ></div>
+    </div>
+    <div
+      class="md:grid md:grid-cols-2 gap-8 items-center py-8 px-4 xl:gap-16 sm:py-16 xl:px-16 z-1"
+    >
+      <div data-aos="flip-right">
+        <h2 class="text-4xl font-bold text-white text-left mb-8">
+          My Education
+        </h2>
+        <div class="space-y-8 py-8">
+          <div
+            v-for="el in education"
+            :key="el.id"
+            class="flex items-center md:w-[80%] w-full rounded-xl bg-gray-900 shadow-lg border border-[#1f1641]"
+          >
+            <div class="w-1/4 items-center justify-center flex">
+              <img
+                src="https://img.icons8.com/ios-glyphs/60/ffffff/graduation-cap--v1.png"
+                alt="graduation-cap--v1"
+              />
+            </div>
+            <div class="w-3/4 pl-4 py-2">
+              <h3
+                class="text-2xl font-semibold uppercase text-transparent bg-clip-text bg-gradient-to-r from-primary to-secondary lg:text-xl"
+              >
+                {{ el.institution }}
+              </h3>
+              <p class="text-white">{{ el.course }}</p>
+              <p class="text-gray-400">{{ el.year }}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="mt-4 md:mt-0 text-left flex flex-col z-10 h-full"
+        data-aos="flip-right"
+      >
+        <h2 class="text-4xl font-bold text-white md:text-center text-left mb-4">
+          More
+          <span
+            class="text-transparent bg-clip-text bg-gradient-to-r from-primary to-secondary"
+            >About</span
+          >
+          Me
+        </h2>
+        <p class="text-base lg:text-lg mt-8 py-8 text-justify">
+          I am a Software Engineering student from Portugal with 4+ years of
+          experience from my internships and Self Learning + Personal Projects.
+          I am passionate about technology and always eager to learn more. I am
+          currently pursuing my Bachelor's on Software Engineering after having
+          completed a CTeSP in programming, where I gained a solid foundation in
+          C, .NET, PHP, Java, and MySQL. In my free time I've taken a few online
+          courses on Unity 3D, Swift/SwiftUI, Cypress, Git, React, Golang. I've
+          also had the pleasure to be a QA/QC Intern at VOID Software in Leiria
+          for five months. There, I contributed to the testing and quality
+          assurance of several projects, using Cypress and Cucumber to automate
+          and streamline the testing process and Git to manage the source code
+          and collaborate with the development team. I am always looking for new
+          challenges and opportunities to grow as a developer.
+        </p>
+        <div class="grid grid-cols-3 gap-4 max-w-lg pt-8">
+          <div
+            class="text-center rounded-xl bg-gray-900 shadow-lg border border-[#1f1641] p-3"
+          >
+            <h3 class="text-white font-bold text-xl sm:text-2xl lg:text-3xl">
+              +200
+            </h3>
+            <p class="text-sm sm:text-base text-gray-300">Happy Clients</p>
+          </div>
+          <div
+            class="text-center rounded-xl bg-gray-900 shadow-lg border border-[#1f1641] p-3"
+          >
+            <h3 class="text-white font-bold text-xl sm:text-2xl lg:text-3xl">
+              +4
+            </h3>
+            <p class="text-sm sm:text-base text-gray-300">Years Experience</p>
+          </div>
+          <div
+            class="text-center rounded-xl bg-gray-900 shadow-lg border border-[#1f1641] p-3"
+          >
+            <h3 class="text-white font-bold text-xl sm:text-2xl lg:text-3xl">
+              +300
+            </h3>
+            <p class="text-sm sm:text-base text-gray-300">Projects</p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script setup>
+import { ref } from "vue";
+
+const education = ref([
+  {
+    id: 1,
+    course: "CTeSP in Programing and IT",
+    institution: "Polytechnic of Leiria",
+    year: "2023",
+  },
+  {
+    id: 2,
+    course: "Bachelor's Degree in Software Engineering",
+    institution: "Polytechnic of Leiria",
+    year: "2026 (Expected)",
+  },
+]);
+</script>