odo/dl.emersa.it
1
0
Fork 0
Code Issues Pull requests Releases 19 Packages Activity Actions

better css

Browse source
This commit is contained in:
0d0 2025-04-08 21:31:34 +02:00
parent a833c43713
commit 5066c3ba7a
2 changed files with 40 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/routes/+layout.svelte
View file

@ -17,4 +17,11 @@
transform: rotate(180deg);
display: inline-block;
}
@media screen and (max-height: 600px) {
/* Your CSS rules here */
footer {
display: none;
}
}
</style>

63
src/routes/+page.svelte
View file

@ -94,7 +94,7 @@
<div
id="wrapper"
class="relative mx-auto rounded-lg bg-black p-6 text-[#00ff7f] shadow-lg sm:max-w-sm sm:border-4 sm:border-[#00ff7f] md:mt-10 md:max-w-md lg:max-w-lg 2xl:max-w-2xl"
class="relative mx-auto rounded-lg bg-black p-6 text-[#00ff7f] shadow-lg sm:max-w-sm sm:border-4 sm:border-[#00ff7f] sm:mt-10 lg:max-w-lg 2xl:max-w-2xl"
>
<div
id="loader"
@ -123,20 +123,36 @@
<p id="title" class="mb-6 text-center text-[#00e5ff]">🐙 Scaricatore 🐙</p>
<form class="space-y-6">
<!-- Source selection -->
<div>
<label for="source" class="mb-2 block text-[#00e5ff]"> Choose Source: </label>
<select
id="source"
name="source"
bind:value={source}
class="w-full rounded-lg border-4 border-[#00ff7f] bg-[#001a00] px-4 py-3 text-[#00ff7f] focus:border-[#ff3399] focus:outline-none"
>
{#each sources as source}
<option value={source.value}>{source.label}</option>
{/each}
</select>
</div>
<div class="flex justify-between">
<div class="sm:w-2/6 lg:w-3/6">
<label for="source" class="mb-2 block text-[#00e5ff]"> Choose Source: </label>
<select
id="source"
name="source"
bind:value={source}
class="w-full rounded-lg border-4 border-[#00ff7f] bg-[#001a00] px-4 py-3 text-[#00ff7f] focus:border-[#ff3399] focus:outline-none"
>
{#each sources as source}
<option value={source.value}>{source.label}</option>
{/each}
</select>
</div>
<!-- Format Selection -->
<div class="w-2/6">
<label for="format" class="mb-2 block text-[#00e5ff]"> Choose Format: </label>
<select
id="format"
name="format"
bind:value={format}
class="w-full rounded-lg border-4 border-[#00ff7f] bg-[#001a00] px-4 py-3 text-[#00ff7f] focus:border-[#ff3399] focus:outline-none"
>
{#each formats as format}
<option value={format.value}>{format.label}</option>
{/each}
</select>
</div>
</div>
<!-- Link Input -->
<div>
<label for="link" class="mb-2 block text-[#00e5ff]"> Enter Video Link: </label>
@ -151,21 +167,6 @@
/>
</div>
<!-- Format Selection -->
<div>
<label for="format" class="mb-2 block text-[#00e5ff]"> Choose Format: </label>
<select
id="format"
name="format"
bind:value={format}
class="w-full rounded-lg border-4 border-[#00ff7f] bg-[#001a00] px-4 py-3 text-[#00ff7f] focus:border-[#ff3399] focus:outline-none"
>
{#each formats as format}
<option value={format.value}>{format.label}</option>
{/each}
</select>
</div>
<!-- Metadata -->
<div>
<label for="metadata" class="mb-2 block text-[#00e5ff]"
@ -230,7 +231,8 @@
font-size: 10px;
}
}
@media (min-width: 1024px) {
@media (min-width: 1400px) {
* {
font-size: 12px;
}
@ -239,6 +241,7 @@
#loader {
display: none;
}
#loader.downloading {
display: grid;
justify-items: center;