From e4e5ec5b2c528264481d19164263792d4263cc7f Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Sun, 15 Sep 2024 23:09:06 +0500
Subject: [PATCH] refactor: update main block bg sizing

---
 index.html          | 19 +++++++++++--------
 static/tailwind.css | 36 ++++++++++++++++++++++++++++++++++++
 2 files changed, 47 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index dcd8d0d..a32d964 100644
--- a/index.html
+++ b/index.html
@@ -26,7 +26,7 @@
     </header>
     <div class="container h-screen" id="section_landing">
         <div class="text-white h-full max-h-[60vh] relative">
-            <div class="bg-bg-pink w-full h-full max-h-[60vh] max-w-[45.25%] absolute top-0 right-0 -z-10"></div>
+            <div class="bg-bg-pink w-full h-full max-h-[60vh] max-w-[46.25%] absolute top-0 right-0 -z-10"></div>
             <div class="flex items-center justify-center gap-12 px-8 py-8">
                 <img src="./static/avatar_512.png" alt="" class="w-[256px] lg:w-[372px] 2xl:w-[512px]" />
                 <div>
@@ -37,7 +37,7 @@
             </div>
         </div>
         <div class="flex text-white h-full max-h-[40vh]">
-            <div class="max-w-[54.75%] bg-bg-gray py-4 w-full h-full">
+            <div class="max-w-[53.75%] bg-bg-gray py-4 w-full h-full">
                 <div class="flex items-center justify-between gap-2 px-4">
                     <img src="./static/file_icon.svg" alt="" class="w-[30px] h-[37px]" />
                     <p class="text-3xl text-bg-pink">yaml</p>
@@ -277,13 +277,16 @@
                                 </div>
                             </div>
                         </a>
-                        <div class="bg-white text-black w-[200px] h-[81px] px-4 py-2 flex gap-2 items-center">
-                            <img class="w-10" alt="" src="./static/assets/discord-mark-blue.png" />
-                            <div class="flex flex-col gap-1">
-                                <p class="font-medium text-[24px] leading-[1]">Discord</p>
-                                <p class="font-light text-[14px] leading-[1]">radiquum</p>
+                        <a class="w-[200px] h-[81px] border-transparent border-2 border-solid transition-[border-color]"
+                            target="_blank" referrerpolicy="origin">
+                            <div class="flex items-center w-full h-full gap-2 px-4 py-2 text-black bg-white">
+                                <img class="w-10" alt="" src="./static/assets/discord-mark-blue.png" />
+                                <div class="flex flex-col gap-1">
+                                    <p class="font-medium text-[24px] leading-[1]">Discord</p>
+                                    <p class="font-light text-[14px] leading-[1]">radiquum</p>
+                                </div>
                             </div>
-                        </div>
+                        </a>
                     </div>
                 </div>
                 <!-- Friends Links -->
diff --git a/static/tailwind.css b/static/tailwind.css
index dc5ffcd..2616be1 100644
--- a/static/tailwind.css
+++ b/static/tailwind.css
@@ -737,6 +737,10 @@ video {
   height: 375px;
 }
 
+.h-\[77px\] {
+  height: 77px;
+}
+
 .max-h-\[40vh\] {
   max-height: 40vh;
 }
@@ -830,6 +834,10 @@ video {
   width: 422px;
 }
 
+.w-\[196px\] {
+  width: 196px;
+}
+
 .max-w-\[1200px\] {
   max-width: 1200px;
 }
@@ -846,6 +854,34 @@ video {
   max-width: 54.75%;
 }
 
+.max-w-\[55\%\] {
+  max-width: 55%;
+}
+
+.max-w-\[58\%\] {
+  max-width: 58%;
+}
+
+.max-w-\[47\%\] {
+  max-width: 47%;
+}
+
+.max-w-\[46\%\] {
+  max-width: 46%;
+}
+
+.max-w-\[46\.25\%\] {
+  max-width: 46.25%;
+}
+
+.max-w-\[52\.75\%\] {
+  max-width: 52.75%;
+}
+
+.max-w-\[53\.75\%\] {
+  max-width: 53.75%;
+}
+
 .scroll-mt-24 {
   scroll-margin-top: 6rem;
 }