Spaces:
Running
Running
cutechicken
commited on
Commit
โข
eade4f6
1
Parent(s):
79d8666
Update index.html
Browse files- index.html +91 -12
index.html
CHANGED
@@ -164,6 +164,72 @@
|
|
164 |
text-transform: uppercase;
|
165 |
letter-spacing: 2px;
|
166 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
167 |
|
168 |
#gameStats {
|
169 |
position: absolute;
|
@@ -242,19 +308,32 @@
|
|
242 |
|
243 |
|
244 |
<div id="gameContainer">
|
245 |
-
|
246 |
-
|
247 |
-
|
248 |
-
<div id="time">Time: 180s</div>
|
249 |
-
</div>
|
250 |
-
<div id="crosshair"></div>
|
251 |
-
<div id="healthBar"><div id="health"></div></div>
|
252 |
-
<div id="ammo">Ammo: 10/10</div>
|
253 |
-
<div id="turretInfo">Turret Angle: 0ยฐ</div>
|
254 |
-
<div id="minimap"></div>
|
255 |
-
<div id="ammo">10/10</div>
|
256 |
<div id="time">Time: 180s</div>
|
257 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
258 |
|
259 |
</div>
|
260 |
|
|
|
164 |
text-transform: uppercase;
|
165 |
letter-spacing: 2px;
|
166 |
}
|
167 |
+
#ammoDisplay {
|
168 |
+
position: absolute;
|
169 |
+
bottom: 20px;
|
170 |
+
right: 20px;
|
171 |
+
color: #0f0;
|
172 |
+
background: rgba(0,20,0,0.7);
|
173 |
+
padding: 10px;
|
174 |
+
font-size: 20px;
|
175 |
+
z-index: 1001;
|
176 |
+
border: 1px solid #0f0;
|
177 |
+
border-radius: 5px;
|
178 |
+
}
|
179 |
+
|
180 |
+
#reloadingText {
|
181 |
+
position: absolute;
|
182 |
+
top: 50%;
|
183 |
+
left: 50%;
|
184 |
+
transform: translate(-50%, -50%);
|
185 |
+
color: #ff0000;
|
186 |
+
font-size: 24px;
|
187 |
+
font-weight: bold;
|
188 |
+
display: none;
|
189 |
+
z-index: 1002;
|
190 |
+
}
|
191 |
+
|
192 |
+
#radar {
|
193 |
+
position: absolute;
|
194 |
+
bottom: 20px;
|
195 |
+
left: 20px;
|
196 |
+
width: 200px;
|
197 |
+
height: 200px;
|
198 |
+
background: rgba(0,20,0,0.3);
|
199 |
+
border: 2px solid #0f0;
|
200 |
+
border-radius: 50%;
|
201 |
+
z-index: 1001;
|
202 |
+
overflow: hidden;
|
203 |
+
}
|
204 |
+
|
205 |
+
#radarLine {
|
206 |
+
position: absolute;
|
207 |
+
top: 50%;
|
208 |
+
left: 50%;
|
209 |
+
width: 50%;
|
210 |
+
height: 2px;
|
211 |
+
background: #0f0;
|
212 |
+
transform-origin: left center;
|
213 |
+
animation: radar-sweep 4s infinite linear;
|
214 |
+
}
|
215 |
+
|
216 |
+
.enemy-dot {
|
217 |
+
position: absolute;
|
218 |
+
width: 6px;
|
219 |
+
height: 6px;
|
220 |
+
background: #ff0000;
|
221 |
+
border-radius: 50%;
|
222 |
+
transform: translate(-50%, -50%);
|
223 |
+
}
|
224 |
+
|
225 |
+
@keyframes radar-sweep {
|
226 |
+
from {
|
227 |
+
transform: rotate(0deg);
|
228 |
+
}
|
229 |
+
to {
|
230 |
+
transform: rotate(360deg);
|
231 |
+
}
|
232 |
+
}
|
233 |
|
234 |
#gameStats {
|
235 |
position: absolute;
|
|
|
308 |
|
309 |
|
310 |
<div id="gameContainer">
|
311 |
+
<div id="gameTitle">Tank Combat Simulator</div>
|
312 |
+
<div id="gameStats">
|
313 |
+
<div id="score">Score: 0</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
314 |
<div id="time">Time: 180s</div>
|
315 |
+
</div>
|
316 |
+
<div id="crosshair"></div>
|
317 |
+
|
318 |
+
<!-- ์ฒด๋ ฅ๋ฐ -->
|
319 |
+
<div id="healthBar">
|
320 |
+
<div id="health"></div>
|
321 |
+
</div>
|
322 |
+
|
323 |
+
<!-- ํฌํ ์ ๋ณด -->
|
324 |
+
<div id="turretInfo">Turret Angle: 0ยฐ</div>
|
325 |
+
|
326 |
+
<!-- ์๋ก์ด ํ์ฝ ์์คํ
-->
|
327 |
+
<div id="ammoDisplay">APFSDS: 1/1</div>
|
328 |
+
|
329 |
+
<!-- ๋ฆฌ๋ก๋ฉ ํ
์คํธ -->
|
330 |
+
<div id="reloadingText">RELOADING...</div>
|
331 |
+
|
332 |
+
<!-- ๋ ์ด๋ -->
|
333 |
+
<div id="radar">
|
334 |
+
<div id="radarLine"></div>
|
335 |
+
</div>
|
336 |
+
</div>
|
337 |
|
338 |
</div>
|
339 |
|