From 8992b4244f52168454893ccce2632dd201cef297 Mon Sep 17 00:00:00 2001
From: Szymon Kin <68154191+hoolek77@users.noreply.github.com>
Date: Wed, 26 Oct 2022 21:39:28 +0200
Subject: [PATCH] Restore anchor in skill component (#66)

---
 src/components/organisms/skill.astro | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/organisms/skill.astro b/src/components/organisms/skill.astro
index cb1bb2e..fad0e6a 100644
--- a/src/components/organisms/skill.astro
+++ b/src/components/organisms/skill.astro
@@ -8,12 +8,17 @@ import SkillLevel from './skill-level.astro';
 export interface Props extends LevelledSkill {}
 
 const { url, icon, iconColor, name, level } = Astro.props;
+
+const IconWrapper = url ? 'a' : 'div';
 ---
 
 <div class:list={['flex', 'flex-col', 'gap-2']}>
-  <div class:list={['flex', 'gap-2', 'h-5']}>
-    <Icon client:load name={icon} color={iconColor} size={20} url={url} />
+  <IconWrapper
+    class:list={['flex', 'gap-2', 'h-5']}
+    {...(url && { href: url, target: "_blank", rel: "noopener noreferrer" })}
+  >
+    <Icon client:load name={icon} color={iconColor} size={20} />
     <Typography variant="tile-subtitle" class="text-gray-700">{name}</Typography>
-  </div>
+  </IconWrapper>
   <SkillLevel skillLevel={level} />
 </div>