refactor: add more technologies

zyrouge · Dec 21, 2024 · 92fd09e · 92fd09e
1 parent 13b6a63
commit 92fd09e
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 4 deletions.
diff --git a/public/static/images/android-studio.png b/public/static/images/android-studio.png
diff --git a/public/static/images/java.png b/public/static/images/java.png
diff --git a/src/components/home/ProjectItem.astro b/src/components/home/ProjectItem.astro
@@ -25,6 +25,7 @@ const { name, description, link, image, tags, backgroundColor } = Astro.props;
         class="max-h-[40%] max-w-[60%] sm:max-w-[40%]"
         src={image}
         alt={`${name}'s logo`}
+        loading="lazy"
     />
     <p
         class="pt-24 text-lg text-center"

diff --git a/src/components/home/Technologies.astro b/src/components/home/Technologies.astro
@@ -7,11 +7,12 @@ import Item from "~/components/home/TechnologyItem.astro";
     <Item name="Node.js" image={StaticAssets.nodejs} type="Language" />
     <Item name="JavaScript" image={StaticAssets.javascript} type="Language" />
     <Item name="Typescript" image={StaticAssets.typescript} type="Language" />
-    <Item name="HTML" image={StaticAssets.html} type="Language" />
-    <Item name="CSS" image={StaticAssets.css} type="Language" />
+    <Item name="Go" image={StaticAssets.go} type="Language" />
     <Item name="Dart" image={StaticAssets.dart} type="Language" />
     <Item name="Kotlin" image={StaticAssets.kotlin} type="Language" />
-    <Item name="Go" image={StaticAssets.go} type="Language" />
+    <Item name="Java" image={StaticAssets.java} type="Language" />
+    <Item name="HTML" image={StaticAssets.html} type="Language" />
+    <Item name="CSS" image={StaticAssets.css} type="Language" />
     <Item name="Bash" image={StaticAssets.bash} type="Language" />
 
     <Item name="Flutter" image={StaticAssets.flutter} type="App Framework" />
@@ -34,6 +35,7 @@ import Item from "~/components/home/TechnologyItem.astro";
     <Item name="Linux" image={StaticAssets.linux} type="Operating System" />
     <Item name="Git" image={StaticAssets.git} type="Version Control" />
     <Item name="VS Code" image={StaticAssets.vscode} type="Editor" />
+    <Item name="Android Studio" image={StaticAssets.androidStudio} type="IDE" />
     <Item name="Figma" image={StaticAssets.figma} type="Graphic Design" />
     <Item name="Podman" image={StaticAssets.podman} type="Containerization" />
 </div>
diff --git a/src/components/home/TechnologyItem.astro b/src/components/home/TechnologyItem.astro
@@ -12,7 +12,12 @@ const { name, type, image } = Astro.props;
     <div
         class="u-flex gap-4 px-4 py-2 bg-secondary-950 border border-secondary-900"
     >
-        <img class="h-auto w-8" src={image} alt={`${name}'s logo`} />
+        <img
+            class="h-auto w-8"
+            src={image}
+            alt={`${name}'s logo`}
+            loading="lazy"
+        />
         <p class="self-stretch w-[1px] bg-secondary-900"></p>
         <div class="w-full">
             <p>{name}</p>

diff --git a/src/core/urls.ts b/src/core/urls.ts
@@ -42,6 +42,8 @@ export class StaticAssets {
     static bash = `${images}/bash.png`;
     static podman = `${images}/podman.png`;
     static pho = `${images}/pho.svg`;
+    static androidStudio = `${images}/android-studio.png`;
+    static java = `${images}/java.png`;
 }
 
 export class ExternalAssets {}