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
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); transform: rotate(180deg);
display: inline-block; display: inline-block;
} }
@media screen and (max-height: 600px) {
/* Your CSS rules here */
footer {
display: none;
}
}
</style> </style>

39
src/routes/+page.svelte
View file

@ -94,7 +94,7 @@
<div <div
id="wrapper" 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 <div
id="loader" id="loader"
@ -123,7 +123,8 @@
<p id="title" class="mb-6 text-center text-[#00e5ff]">🐙 Scaricatore 🐙</p> <p id="title" class="mb-6 text-center text-[#00e5ff]">🐙 Scaricatore 🐙</p>
<form class="space-y-6"> <form class="space-y-6">
<!-- Source selection --> <!-- Source selection -->
<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> <label for="source" class="mb-2 block text-[#00e5ff]"> Choose Source: </label>
<select <select
id="source" id="source"
@ -137,6 +138,21 @@
</select> </select>
</div> </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 --> <!-- Link Input -->
<div> <div>
<label for="link" class="mb-2 block text-[#00e5ff]"> Enter Video Link: </label> <label for="link" class="mb-2 block text-[#00e5ff]"> Enter Video Link: </label>
@ -151,21 +167,6 @@
/> />
</div> </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 --> <!-- Metadata -->
<div> <div>
<label for="metadata" class="mb-2 block text-[#00e5ff]" <label for="metadata" class="mb-2 block text-[#00e5ff]"
@ -230,7 +231,8 @@
font-size: 10px; font-size: 10px;
} }
} }
@media (min-width: 1024px) {
@media (min-width: 1400px) {
* { * {
font-size: 12px; font-size: 12px;
} }
@ -239,6 +241,7 @@
#loader { #loader {
display: none; display: none;
} }
#loader.downloading { #loader.downloading {
display: grid; display: grid;
justify-items: center; justify-items: center;