Skip to content

Commit 9291465

Browse files
ttamxttamx
committed
resposive
1 parent 4b5e4d9 commit 9291465

1 file changed

Lines changed: 33 additions & 30 deletions

File tree

‎src/pages/index.astro‎

Lines changed: 33 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ import discord from "../assets/discord.png";
3636
></span
3737
>
3838
</h2> -->
39-
<div class="text-2xl pt-3">
39+
<div class="text-xl md:text-2xl pt-3">
4040
<p>
4141
จัดขึ้น วันที่
4242
<span
@@ -92,90 +92,92 @@ import discord from "../assets/discord.png";
9292
<h2 class="text-3xl font-bold">
9393
ราย<span class="text-blue-400">ละเอีย</span>ด
9494
</h2>
95-
<p class="text-2xl">
96-
มีโจทย์วันละ 3 ข้อ แต่ละข้<span class="text-teal-400"
95+
<div class="flex flex-col md:flex-row items-center justify-center text-2xl gap-1">
96+
<span>มีโจทย์วันละ 3 ข้อ</span>
97+
<span>แต่ละข้<span class="text-teal-400"
9798
>อมีคะแนนเ</span
9899
>ท่ากันที่ <span class="text-yellow-500"
99100
><a href="#people">💯</a> คะแ</span
100101
>นน
101-
</p>
102+
</span>
103+
</div>
102104
</div>
103105
</div>
104106

105107
<div class="h-screen" id="people">
106108
<div class="h-full flex flex-col justify-center items-center">
107109
<div
108-
class="grid items-center justify-center grid-cols-3 gap-2 text-center"
110+
class="grid items-center justify-center grid-cols-3 gap-2 text-center text-l lg:text-2xl"
109111
>
110-
<h2 class="col-span-3 text-3xl font-bold my-5">
112+
<h2 class="col-span-3 text-2xl md:text-3xl font-bold my-5">
111113
Problems ถูก <span class="text-cyan-300">provided</span> โดย
112114
</h2>
113115
<a href="https://codeforces.com/profile/kunzaZa183"
114-
><p class="text-2xl pt-1 font-bold text-yellow-500">
116+
><p class="pt-1 font-bold text-yellow-500">
115117
kunzaZa183
116118
</p></a
117119
>
118120
<a href="https://codeforces.com/profile/ttamx"
119-
><p class="text-2xl pt-1 text-red-500 font-bold">ttamx</p></a
121+
><p class="pt-1 text-red-500 font-bold">ttamx</p></a
120122
>
121123
<a href="https://codeforces.com/profile/omsincoconut"
122-
><p class="text-2xl pt-1 font-bold text-yellow-500">
124+
><p class="pt-1 font-bold text-yellow-500">
123125
omsincoconut
124126
</p></a
125127
>
126128
<a href="https://codeforces.com/profile/spycoderyt"
127-
><p class="text-2xl pt-1 font-bold text-blue-500">
129+
><p class="pt-1 font-bold text-blue-500">
128130
spycoderyt
129131
</p></a
130132
>
131133
<a href="https://codeforces.com/profile/IceBorworntat"
132-
><p class="text-2xl pt-1 font-bold text-purple-400">
134+
><p class="pt-1 font-bold text-purple-400">
133135
Hydrolyzed~
134136
</p></a
135137
>
136138
<a href="https://codeforces.com/profile/blackslex"
137-
><p class="text-2xl pt-1 font-bold text-blue-500">blackslex</p></a
139+
><p class="pt-1 font-bold text-blue-500">blackslex</p></a
138140
>
139141
<a href="https://codeforces.com/profile/NortGlG"
140-
><p class="text-2xl pt-1 font-bold text-purple-400">NortGlG</p></a
142+
><p class="pt-1 font-bold text-purple-400">NortGlG</p></a
141143
>
142144
<a href="https://codeforces.com/profile/RuffLogix"
143-
><p class="text-2xl pt-1 font-bold text-green-600">
145+
><p class="pt-1 font-bold text-green-600">
144146
RuffLogix
145147
</p></a
146148
>
147149
<a href="https://codeforces.com/profile/sleepntsheep"
148-
><p class="text-2xl pt-1 font-bold text-purple-400">
150+
><p class="pt-1 font-bold text-purple-400">
149151
sleepntsheep
150152
</p></a
151153
>
152-
<h2 class="col-span-3 text-3xl font-bold my-5">
154+
<h2 class="col-span-3 text-2xl md:text-3xl font-bold my-5">
153155
โจทย์ had been <span class="text-pink-300">ทดสอบed</span> by
154156
</h2>
155157
<a href="https://codeforces.com/profile/thawin.ice"
156-
><p class="text-2xl pt-1 font-bold text-purple-400">
158+
><p class="pt-1 font-bold text-purple-400">
157159
thawin.ice
158160
</p></a
159161
>
160162
<a href="https://codeforces.com/profile/peteza"
161-
><p class="text-2xl pt-1 font-bold text-yellow-500">peteza</p></a
163+
><p class="pt-1 font-bold text-yellow-500">peteza</p></a
162164
>
163165
<a href="https://codeforces.com/profile/8pete8"
164-
><p class="text-2xl pt-1 font-bold text-purple-400">8pete8</p></a
166+
><p class="pt-1 font-bold text-purple-400">8pete8</p></a
165167
>
166168
<a href="https://codeforces.com/profile/Spad2e"
167-
><p class="text-2xl pt-1 font-bold text-blue-500">Spad2e</p></a
169+
><p class="pt-1 font-bold text-blue-500">Spad2e</p></a
168170
>
169171
<a href="https://codeforces.com/profile/pakpim"
170-
><p class="text-2xl pt-1 font-bold text-purple-400">pakpim</p></a
172+
><p class="pt-1 font-bold text-purple-400">pakpim</p></a
171173
>
172174
<a href="https://codeforces.com/profile/Marszpace"
173-
><p class="text-2xl pt-1 font-bold text-blue-500">Marszpace</p></a
175+
><p class="pt-1 font-bold text-blue-500">Marszpace</p></a
174176
>
175177
</div>
176178
<h2 class="text-3xl font-bold pt-3 text-slate-800">Sponsored โดย</h2>
177179
<a href="#prize"
178-
><p class="text-2xl pt-1 font-bold text-slate-800">icy</p></a
180+
><p class="pt-1 font-bold text-slate-800">icy</p></a
179181
>
180182
</div>
181183
</div>
@@ -194,8 +196,8 @@ import discord from "../assets/discord.png";
194196
</div>
195197

196198
<div class="h-screen" id="register">
197-
<div class="h-full flex flex-row justify-center items-center gap-16">
198-
<div class="h-full flex flex-col justify-center items-center">
199+
<div class="h-full flex flex-col md:flex-row justify-center items-center gap md:gap-16">
200+
<div class="md:h-full flex flex-col justify-center items-center">
199201
<h2 class="text-3xl font-bold">
200202
<!-- ณ ระบบ <span class="text-[#f6c43d]">Cod</span><span
201203
class="text-[#1789CA]"
@@ -205,18 +207,18 @@ import discord from "../assets/discord.png";
205207
</h2>
206208
<!-- <div class="flex justify-center items-center overflow-hidden"
207209
style="width: 120px; height: 40px"> -->
208-
<Image src={cms} alt="sponsor" class="h-1/8 w-auto" />
210+
<Image src={cms} alt="sponsor" class="h-1/2 md:h-1/8 w-auto" />
209211
</div>
210-
<div class="h-full flex flex-col justify-center items-center">
211-
<div class="pt-3 text-2xl flex flex-row">
212+
<div class="md:h-full flex flex-col justify-center items-center">
213+
<div class="text-2xl flex flex-row">
212214
<p class="text-blue-400">ติดต</p>
213215
<p class="text-yellow-200">าม</p>
214216
<p>&nbsp;</p>
215217
<p class="text-green-300">ข้าวสาร</p>
216218
<p>&nbsp;</p>
217219
<p><span>ที่</span></p>
218220
</div>
219-
<Image src={discord} alt="sponsor" class="h-1/8 w-auto" />
221+
<Image src={discord} alt="sponsor" class="h-1/4 md:h-1/8 w-auto" />
220222
<!-- </div> -->
221223
<div class="pt-3 text-2xl flex flex-row">
222224
<p class="text-green-400 py-1">เข้าได้</p>
@@ -298,7 +300,8 @@ import discord from "../assets/discord.png";
298300
document
299301
.getElementById("reveal-prize")!
300302
.classList.remove("bg-purple-400");
301-
document.getElementById("reveal-prize")!.classList.add("text-8xl");
303+
document.getElementById("reveal-prize")!.classList.add("text-6xl");
304+
document.getElementById("reveal-prize")!.classList.add("md:text-8xl");
302305
} else {
303306
document
304307
.querySelector("#register")!

0 commit comments

Comments
 (0)