New Style

This commit is contained in:
bingus_violet 2024-03-20 18:43:01 -05:00
parent c466020478
commit dabc5fe169
3 changed files with 122 additions and 55 deletions

View file

@ -17,51 +17,56 @@
</head>
<body>
<h1>Univerter<hr></h1>
<div class="mainDiv">
<h1>Univerter<hr></h1>
<form action="/download" method="get">
<p style="margin-bottom: 1px;">Video URL:</p>
<input required type="url" id="url" placeholder="Enter url" name="url" style="width: 80vw; max-width: 550px">
<p>Quality:</p>
<select required id="quality" name="quality">
<option value="144">144p</option>
<option value="240">240p</option>
<option value="360">360p</option>
<option value="480">480p</option>
<option value="720" selected>720p</option>
<option value="1080">1080p</option>
<option value="1440">1440p</option>
<option value="2160">2160p (4k)</option>
</select>
<p>Format:</p>
<select required id="format" name="format">
<option disabled>Video Formats</option>
<option value="mp4">.mp4</option>
<option value="mkv">.mkv</option>
<option disabled>Audio Formats</option>
<option value="mp3" selected>.mp3</option>
<option value="wav">.wav</option>
<option value="opus">.ogx</option>
</select>
<!-- <br> -->
<!-- <input style="display: inline-block" type="checkbox" id="adv"> -->
<!-- <p style="display: inline-block" for="adv">Enable Advanced options? (Beta)</p> -->
<br>
<input type="submit">
</form>
<br>
<p>Univerter uses yt-dlp as its backend, and supports a wide variety of platforms. yt-dlp's list can be found <a target="_blank" href="https://github.com/yt-dlp/yt-dlp/blob/master/supportedsites.md">here</a>, but be aware many of them wont work.</p>
<form action="/download" method="get">
<p style="margin-bottom: 1px;">Video URL:</p>
<input required type="url" id="url" placeholder="Enter url" name="url">
<div class="grid-container">
<div class="grid-child">
<p>Quality:</p>
<select required id="quality" name="quality">
<option value="144">144p</option>
<option value="240">240p</option>
<option value="360">360p</option>
<option value="480">480p</option>
<option value="720" selected>720p</option>
<option value="1080">1080p</option>
<option value="1440">1440p</option>
<option value="2160">2160p (4k)</option>
</select>
</div>
<div class="grid-child">
<p>Format:</p>
<select required id="format" name="format">
<option disabled>Video Formats</option>
<option value="mp4">.mp4</option>
<option value="mkv">.mkv</option>
<option disabled>Audio Formats</option>
<option value="mp3" selected>.mp3</option>
<option value="wav">.wav</option>
<option value="opus">.ogx</option>
</select>
</div>
</div>
<!-- <br> -->
<!-- <input style="display: inline-block" type="checkbox" id="adv"> -->
<!-- <p style="display: inline-block" for="adv">Enable Advanced options? (Beta)</p> -->
<p><a target="_blank" href="https://ko-fi.com/bingus_violet">Please consider donating</a> or host the website yourself! Anything
helps! (Check <a href="https://codeberg.org/Bingus_Violet/Univerter">Codeberg</a> for more info)</p>
<p>
Powered by <a target="_blank" href="https://github.com/yt-dlp/yt-dlp/">yt-dlp</a>
<br>
Inspired by <a href="https://cobalt.tools">Cobalt</a><br>
</p>
<input type="submit">
</form>
<br>
<p>
Powered by <a target="_blank" href="https://github.com/yt-dlp/yt-dlp/">yt-dlp</a>
<br>
Inspired by <a href="https://cobalt.tools">Cobalt</a><br>
</p>
</div>
</body>
</html>