fix responsive issue

This commit is contained in:
Suvodip
2024-08-01 18:02:27 +05:30
parent fb55f85b6c
commit 2dd6c7143c
7 changed files with 33 additions and 33 deletions

View File

@@ -24,62 +24,62 @@ import Layout from "../../layouts/Layout.astro";
<p id="LearningArea"></p>
<p id="LearningSubArea_copy"></p>
</div> -->
<p class="sm:text-2xl md:text-3xl lg:text-4xl text-center font-[600] text-[#60C6CB] my-4 select-none" id="gameDescription"></p>
<p class="sm:text-2xl md:text-3xl lg:text-3xl text-center font-[600] text-[#60C6CB] my-2 select-none" id="gameDescription"></p>
<form id="contactForm">
<div id="" class="flex flex-row place-content-between gap-4">
<div class="flex flex-col gap-x-6 gap-y-2 place-items-center">
<label for="a1" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image1" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image1" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label1" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image1');" type="checkbox" id="a1" class="round-checkbox-input myCheckbox largerCheckbox" value="a1"/>
<label for="a2" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image2" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image2" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label2" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image2');" type="checkbox" id="a2" class="round-checkbox-input myCheckbox largerCheckbox" value="a2"/>
<label for="a3" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image3" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image3" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label3" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image3');" type="checkbox" id="a3" class="round-checkbox-input myCheckbox largerCheckbox" value="a3"/>
</div>
<div class="flex flex-col gap-x-6 gap-y-2 place-items-center">
<label for="a4" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image4" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image4" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label4" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image4');" type="checkbox" id="a4" class="round-checkbox-input myCheckbox largerCheckbox" value="a4"/>
<label for="a5" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image5" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image5" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label5" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image5');" type="checkbox" id="a5" class="round-checkbox-input myCheckbox largerCheckbox" value="a5"/>
<label for="a6" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image6" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image6" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label6" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image6');" type="checkbox" id="a6" class="round-checkbox-input myCheckbox largerCheckbox" value="a6"/>
</div>
<div class="flex flex-col gap-x-6 gap-y-2 place-items-center">
<label for="a7" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image7" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image7" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label7" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image7');" type="checkbox" id="a7" class="round-checkbox-input myCheckbox largerCheckbox" value="a7"/>
<label for="a8" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image8" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image8" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label8" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image8');" type="checkbox" id="a8" class="round-checkbox-input myCheckbox largerCheckbox" value="a8"/>
<label for="a9" class="round-checkbox-label text-[14px] md:text-2xl">
<img id="image9" src="" alt="" draggable="false" class="select-none sm:w-[100px] h-[120px]" />
<img id="image9" src="" alt="" draggable="false" class="select-none sm:w-[90px] h-[110px]" />
<p id="label9" class="h-[50px] overflow-y-auto"></p>
</label>
<input onclick="checkResult2('image9');" type="checkbox" id="a9" class="round-checkbox-input myCheckbox largerCheckbox" value="a9"/>