From 38f4fb54fd69716173c8f58ef2b0871c954ddc97 Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Sun, 29 Dec 2024 14:00:41 +0500
Subject: [PATCH] edit pack preview card image size

---
 index.html          |  4 ++--
 static/tailwind.css | 20 ++++++++++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 8f92f0c..5ae17c9 100644
--- a/index.html
+++ b/index.html
@@ -14,9 +14,9 @@
     <div class="container flex flex-col items-center justify-center min-h-screen gap-4 p-4 mx-auto">
 
         <div class="flex-col hidden gap-4 w-full md:w-[600px]" id="preview_sticker_pack">
-            <div class="flex flex-col items-center justify-center gap-4 p-4 rounded-lg shadow-lg md:flex-row bg-stone-800 text-slate-200"
+            <div class="flex flex-wrap items-center justify-around gap-4 p-4 rounded-lg shadow-lg md:flex-row bg-stone-800 text-slate-200"
                 id="preview_sticker_pack">
-                <img src="static/images/cinny.png" class="object-contain w-64" alt="" id="preview_sticker_pack_image" />
+                <img src="static/images/cinny.png" class="object-contain w-32 md:w-64" alt="" id="preview_sticker_pack_image" />
                 <div class="flex flex-col justify-center gap-2">
                     <p class="text-4xl text-bold" id="preview_sticker_pack_name">
                         {sticker_pack_name}
diff --git a/static/tailwind.css b/static/tailwind.css
index 2df884f..c251f09 100644
--- a/static/tailwind.css
+++ b/static/tailwind.css
@@ -661,6 +661,10 @@ video {
   width: 6rem;
 }
 
+.w-32 {
+  width: 8rem;
+}
+
 .max-w-\[90\%\] {
   max-width: 90%;
 }
@@ -681,6 +685,14 @@ video {
   justify-content: center;
 }
 
+.justify-between {
+  justify-content: space-between;
+}
+
+.justify-around {
+  justify-content: space-around;
+}
+
 .gap-2 {
   gap: 0.5rem;
 }
@@ -859,6 +871,10 @@ video {
     width: 5rem;
   }
 
+  .md\:w-64 {
+    width: 16rem;
+  }
+
   .md\:max-w-\[768px\] {
     max-width: 768px;
   }
@@ -867,6 +883,10 @@ video {
     flex-direction: row;
   }
 
+  .md\:items-center {
+    align-items: center;
+  }
+
   .md\:whitespace-pre {
     white-space: pre;
   }