From 8e181781e5e1c37d91083ac22917edaca3fdccdc Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Thu, 17 Oct 2024 14:34:35 -0700
Subject: fix: inconsistent sizing on background of icons

---
 src/components/Link.astro | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/Link.astro b/src/components/Link.astro
index 9a6708d..6a7c7ca 100644
--- a/src/components/Link.astro
+++ b/src/components/Link.astro
@@ -20,7 +20,6 @@ const { icon, title, description, url } = Astro.props;
         <p class="link-description">{description}</p>
     </div>
 </a>
-
 <style>
     .link {
         padding: 0.75rem;
@@ -40,11 +39,7 @@ const { icon, title, description, url } = Astro.props;
     }
 
     .link-icon {
-        width: 3rem;
-        height: 3rem;
         margin-right: 1.125rem;
-        background: var(--pink-darker);
-        border-radius: 0.5rem;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -53,6 +48,15 @@ const { icon, title, description, url } = Astro.props;
     .link-icon i {
         font-size: 1.5rem;
         color: var(--zinc-50);
+        background: var(--pink-darker);
+        padding: 10%;
+        border-radius: 0.5rem;
+        background-size: cover;
+        width: 3rem;
+        height: 3rem;
+        display: flex;
+        justify-content: center;
+        align-items: center;
     }
 
     .link-title {
-- 
cgit v1.2.3