Spaces:
Running
Running
Commit
•
0dc668e
1
Parent(s):
deacdff
Update index.html
Browse files- index.html +44 -37
index.html
CHANGED
@@ -47,28 +47,35 @@
|
|
47 |
border-top-left-radius: 11px;
|
48 |
border-top-right-radius: 11px;
|
49 |
}
|
50 |
-
|
51 |
-
|
52 |
-
font-size: 20px; /* Adjust font size for smaller screens */
|
53 |
-
}
|
54 |
-
|
55 |
-
.description {
|
56 |
-
font-size: 12px; /* Adjust font size for smaller screens */
|
57 |
}
|
58 |
-
|
59 |
-
|
60 |
-
|
61 |
-
|
62 |
-
|
63 |
-
|
64 |
-
/*
|
65 |
-
|
66 |
-
|
67 |
-
|
68 |
-
|
69 |
-
|
70 |
-
|
71 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
72 |
/* Define initial font sizes */
|
73 |
</style>
|
74 |
</head>
|
@@ -304,8 +311,8 @@ audio {
|
|
304 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
305 |
</div>
|
306 |
<div class="p-3">
|
307 |
-
<h1
|
308 |
-
<p
|
309 |
|
310 |
<audio controls class="d-none" id="audio">
|
311 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -320,8 +327,8 @@ audio {
|
|
320 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
321 |
</div>
|
322 |
<div class="p-3">
|
323 |
-
<h1
|
324 |
-
<p
|
325 |
|
326 |
<audio controls class="d-none" id="audio">
|
327 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -336,8 +343,8 @@ audio {
|
|
336 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
337 |
</div>
|
338 |
<div class="p-3">
|
339 |
-
<h1
|
340 |
-
<p
|
341 |
|
342 |
<audio controls class="d-none" id="audio">
|
343 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -352,8 +359,8 @@ audio {
|
|
352 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
353 |
</div>
|
354 |
<div class="p-3">
|
355 |
-
<h1
|
356 |
-
<p
|
357 |
|
358 |
<audio controls class="d-none" id="audio">
|
359 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -373,8 +380,8 @@ audio {
|
|
373 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
374 |
</div>
|
375 |
<div class="p-3">
|
376 |
-
<h1
|
377 |
-
<p
|
378 |
|
379 |
<audio controls class="d-none" id="audio">
|
380 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -389,8 +396,8 @@ audio {
|
|
389 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
390 |
</div>
|
391 |
<div class="p-3">
|
392 |
-
<h1
|
393 |
-
<p
|
394 |
|
395 |
<audio controls class="d-none" id="audio">
|
396 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -405,8 +412,8 @@ audio {
|
|
405 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
406 |
</div>
|
407 |
<div class="p-3">
|
408 |
-
<h1
|
409 |
-
<p
|
410 |
|
411 |
<audio controls class="d-none" id="audio">
|
412 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
@@ -421,8 +428,8 @@ audio {
|
|
421 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
422 |
</div>
|
423 |
<div class="p-3">
|
424 |
-
<h1
|
425 |
-
<p
|
426 |
|
427 |
<audio controls class="d-none" id="audio">
|
428 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
47 |
border-top-left-radius: 11px;
|
48 |
border-top-right-radius: 11px;
|
49 |
}
|
50 |
+
.title {
|
51 |
+
font-size: 25px;
|
|
|
|
|
|
|
|
|
|
|
52 |
}
|
53 |
+
|
54 |
+
.description {
|
55 |
+
font-size: 18px;
|
56 |
+
}
|
57 |
+
@media (max-width: 767px) {
|
58 |
+
.title {
|
59 |
+
font-size: 20px; /* Adjust font size for smaller screens */
|
60 |
+
}
|
61 |
+
|
62 |
+
.description {
|
63 |
+
font-size: 12px; /* Adjust font size for smaller screens */
|
64 |
+
}
|
65 |
+
}
|
66 |
+
/* Default styles for the audio tag */
|
67 |
+
audio {
|
68 |
+
width: 100%; /* Set the audio tag to take the full width */
|
69 |
+
}
|
70 |
+
|
71 |
+
/* Media query for smaller screens (adjust as needed) */
|
72 |
+
@media (max-width: 767px) {
|
73 |
+
audio {
|
74 |
+
width: 80%; /* Adjust the width for smaller screens */
|
75 |
+
max-width: 300px; /* Set a maximum width for better mobile view */
|
76 |
+
margin: 0 auto; /* Center the audio tag */
|
77 |
+
}
|
78 |
+
}
|
79 |
/* Define initial font sizes */
|
80 |
</style>
|
81 |
</head>
|
|
|
311 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
312 |
</div>
|
313 |
<div class="p-3">
|
314 |
+
<h1 class="title">Heeriye</h1>
|
315 |
+
<p class="description">Description</p>
|
316 |
|
317 |
<audio controls class="d-none" id="audio">
|
318 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
327 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
328 |
</div>
|
329 |
<div class="p-3">
|
330 |
+
<h1 class="title">Heeriye</h1>
|
331 |
+
<p class="description">Description</p>
|
332 |
|
333 |
<audio controls class="d-none" id="audio">
|
334 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
343 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
344 |
</div>
|
345 |
<div class="p-3">
|
346 |
+
<h1 class="title">Heeriye</h1>
|
347 |
+
<p class="description">Description</p>
|
348 |
|
349 |
<audio controls class="d-none" id="audio">
|
350 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
359 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
360 |
</div>
|
361 |
<div class="p-3">
|
362 |
+
<h1 class="title">Heeriye</h1>
|
363 |
+
<p class="description">Description</p>
|
364 |
|
365 |
<audio controls class="d-none" id="audio">
|
366 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
380 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
381 |
</div>
|
382 |
<div class="p-3">
|
383 |
+
<h1 class="title">Heeriye</h1>
|
384 |
+
<p class="description">Description</p>
|
385 |
|
386 |
<audio controls class="d-none" id="audio">
|
387 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
396 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
397 |
</div>
|
398 |
<div class="p-3">
|
399 |
+
<h1 class="title">Heeriye</h1>
|
400 |
+
<p class="description">Description</p>
|
401 |
|
402 |
<audio controls class="d-none" id="audio">
|
403 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
412 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
413 |
</div>
|
414 |
<div class="p-3">
|
415 |
+
<h1 class="title">Heeriye</h1>
|
416 |
+
<p class="description">Description</p>
|
417 |
|
418 |
<audio controls class="d-none" id="audio">
|
419 |
<source src="ranjha1.mp3" type="audio/mp3" />
|
|
|
428 |
<img src="https://i.ytimg.com/vi/7cPvRJ92e50/mqdefault.jpg" style="width: 100%;" alt="" class="song">
|
429 |
</div>
|
430 |
<div class="p-3">
|
431 |
+
<h1 class="title">Heeriye</h1>
|
432 |
+
<p class="description">Description</p>
|
433 |
|
434 |
<audio controls class="d-none" id="audio">
|
435 |
<source src="ranjha1.mp3" type="audio/mp3" />
|