From 689c2489573904f5b740c7b6b3cd941855561ec0 Mon Sep 17 00:00:00 2001
From: xHyroM <generalkubo@gmail.com>
Date: Sun, 14 May 2023 18:20:28 +0200
Subject: [PATCH] feat: cf pages, workers, github actions, skills -> technology

Technology is better title than skills, because yeh
---
 src/components/widgets/TechIcon.astro |  5 ++--
 src/pages/about.astro                 | 35 ++++++++++++++++++++++-----
 2 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/src/components/widgets/TechIcon.astro b/src/components/widgets/TechIcon.astro
index 5cbb07b..88ec601 100644
--- a/src/components/widgets/TechIcon.astro
+++ b/src/components/widgets/TechIcon.astro
@@ -5,14 +5,15 @@ import { Icon } from "astro-icon";
 type Props = {
   name: string;
   icon: string;
+  color?: string;
 };
 
-const { name, icon } = Astro.props as Props;
+const { name, icon, color } = Astro.props as Props;
 ---
 
 <li class="p-2">
   <Tooltips interactive={false} delay={[15, 150]} placement="top" />
   <span title={name}>
-    <Icon name={icon} class="h-10 w-10" />
+    <Icon name={icon} color={color} class="h-10 w-10" />
   </span>
 </li>
diff --git a/src/pages/about.astro b/src/pages/about.astro
index 1843e75..7791f7c 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -78,9 +78,22 @@ const skills = [
     icon: "mdi:github",
   },
   {
-    name: "CloudFlare",
+    name: "GitHub Actions",
+    icon: "devicon:githubactions",
+  },
+  {
+    name: "Cloudflare",
     icon: "logos:cloudflare",
   },
+  {
+    name: "Cloudflare Pages",
+    icon: "simple-icons:cloudflarepages",
+    color: "#f48120",
+  },
+  {
+    name: "Cloudflare Workers",
+    icon: "logos:cloudflare-workers-icon",
+  },
 ];
 ---
 
@@ -143,23 +156,33 @@ const skills = [
 
       <section>
         <h1 class="w-full py-10 text-center text-4xl font-extrabold text-white">
-          Skills
+          Technology
         </h1>
 
-        <p class="mb-4">
-          My skill set spans various programming languages, databases, and
-          frameworks.
+        <div class="mb-4">
+          <p class="mb-4">
+            Below you can see the technologies I work with and use frequently.
+          </p>
 
           <ul
             class="mx-auto mb-4 flex w-fit flex-wrap items-center justify-center rounded-md border border-neutral-800"
           >
             {
               skills.map((skill) => (
-                <TechIcon icon={skill.icon} name={skill.name} />
+                <TechIcon
+                  icon={skill.icon}
+                  color={skill.color}
+                  name={skill.name}
+                />
               ))
             }
           </ul>
 
+          I'm still learning with some things like Go and Rust, so I don't have
+          a perfect grasp of them, but I've included them in this list anyway.
+        </div>
+
+        <p class="mb-4">
           Continuous learning is an essential aspect of my professional journey,
           and while I do not claim to be a master of any programming language,
           my expertise in various languages is continually evolving. As a