From 83663a9d33c4dec9ce56af0d1753edb58600ceab Mon Sep 17 00:00:00 2001
From: suvodip ghosh <suvodip@siliconpin.com>
Date: Thu, 4 Sep 2025 13:13:52 +0530
Subject: [PATCH] change image size and ratio in drag and tick game

---
 src/pages/drag/index.astro           |  4 ++--
 src/pages/tick/tick_phonics_v1.astro |  3 +++
 src/pages/tick/tick_phonics_v2.astro |  3 +++
 src/pages/tick/tick_phonics_v3.astro |  5 ++++-
 src/pages/tick/v1.astro              | 15 +++++++++------
 src/pages/tick/v2.astro              |  3 +++
 src/pages/tick/v3.astro              |  5 ++++-
 7 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/src/pages/drag/index.astro b/src/pages/drag/index.astro
index f1b4e3e..dcb5217 100644
--- a/src/pages/drag/index.astro
+++ b/src/pages/drag/index.astro
@@ -183,9 +183,9 @@ import Layout from '../../layouts/Layout.astro';
         // console.log(audioData)
         const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
         if(isMobile){
-          imageCustomWidth = "?width=100";
+          imageCustomWidth = "?width=60";
         } else{
-          imageCustomWidth = "?width=100";
+          imageCustomWidth = "?width=60";
         }
         const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
         assetsList.left_image1  = assetsURL + left_image1   + imageCustomWidth;
diff --git a/src/pages/tick/tick_phonics_v1.astro b/src/pages/tick/tick_phonics_v1.astro
index 832270b..69c3205 100644
--- a/src/pages/tick/tick_phonics_v1.astro
+++ b/src/pages/tick/tick_phonics_v1.astro
@@ -549,6 +549,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;
diff --git a/src/pages/tick/tick_phonics_v2.astro b/src/pages/tick/tick_phonics_v2.astro
index cc097ea..7661d8c 100644
--- a/src/pages/tick/tick_phonics_v2.astro
+++ b/src/pages/tick/tick_phonics_v2.astro
@@ -575,6 +575,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6, #image7, #image8, #image9{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6, #label7, #label8, #label9{
         text-align: center;
diff --git a/src/pages/tick/tick_phonics_v3.astro b/src/pages/tick/tick_phonics_v3.astro
index 1ab7b85..3e1e226 100644
--- a/src/pages/tick/tick_phonics_v3.astro
+++ b/src/pages/tick/tick_phonics_v3.astro
@@ -500,7 +500,10 @@ import Layout from "../../layouts/Layout.astro";
         transition: border 0.5s, border-color 0.3s, transform 6s;
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
-        width: 240px;
+        width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;
diff --git a/src/pages/tick/v1.astro b/src/pages/tick/v1.astro
index bd840f0..eba5c15 100644
--- a/src/pages/tick/v1.astro
+++ b/src/pages/tick/v1.astro
@@ -27,7 +27,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a1" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image1" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image1" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label1"></p>
                                     </div>
                                 </label>
@@ -35,7 +35,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a2" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image2" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image2" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label2"></p>
                                     </div>
                                 </label>
@@ -44,7 +44,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a3" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image3" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image3" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label3"></p>
                                     </div>
                                 </label>
@@ -52,7 +52,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a4" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image4" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image4" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label4"></p>
                                     </div>
                                 </label>
@@ -61,7 +61,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a5" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image5" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image5" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label5"></p>
                                     </div>
                                 </label>
@@ -69,7 +69,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a6" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image6" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image6" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label6"></p>
                                     </div>
                                 </label>
@@ -535,6 +535,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;
diff --git a/src/pages/tick/v2.astro b/src/pages/tick/v2.astro
index 67a0d8e..1e168c3 100644
--- a/src/pages/tick/v2.astro
+++ b/src/pages/tick/v2.astro
@@ -561,6 +561,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6, #image7, #image8, #image9{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6, #label7, #label8, #label9{
         text-align: center;
diff --git a/src/pages/tick/v3.astro b/src/pages/tick/v3.astro
index 18a69aa..9f46884 100644
--- a/src/pages/tick/v3.astro
+++ b/src/pages/tick/v3.astro
@@ -511,7 +511,10 @@ import Layout from "../../layouts/Layout.astro";
         transition: border 0.5s, border-color 0.3s, transform 6s;
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
-        width: 240px;
+        width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;