suricata/yt2mp3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

commit

Browse Source
This commit is contained in:
suricata
2026-01-11 17:42:29 +00:00
parent 85647d2836
commit c3a861d849
6 changed files with 77 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
app/pages/index.vue
View File

@@ -1,16 +1,17 @@
<script setup lang="ts">
const video = ref(1);
</script>
<template>
<MainHeader :ui_colors="ui_colors_dropdown"/>
<div class="justify-center flex flex-col mt-4 mb-4 w-full">
<h1 class="inter font-bold text-center mt-3 mb-3 text-white white-glow text-5xl md:text-7xl rgb-text">Youtube to MP3</h1>
<h1 class="inter font-bold text-center mt-3 mb-3 text-white white-glow max-sm:text-5xl sm:text-6xl md:text-7xl xl:text-8xl rgb-text">Youtube to MP3</h1>
<div class="w-full flex self-center justify-center">
<UInput
class="self-center w-1/3 geist-mono mt-3 mb-3"
class="self-center geist-mono mt-3 mb-3 max-md:w-3/4 w-2/3 2xl:w-1/2"
:ui="{ base: 'rounded-2xl h-15 text-toned', trailing: 'p-0' }"
placeholder="Search for a YouTube video..." >
<template #trailing>
@@ -20,30 +21,22 @@
</div>
</div>
<div class="w-full max-w-md mx-auto mt-8 p-6 light:bg-zinc-50 dark:bg-zinc-950 rounded-xl" v-if="video">
<div class="video-container">
<LazyYoutube src="https://www.youtube.com/watch?v=-B48W6H2YHE&list=RD-B48W6H2YHE&start_radio=1" />
</div>
<div class="w-full max-w-md mx-auto mt-8 p-6 bg-zinc-950 rounded-xl">
<div class="video-container">
<iframe
class="w-full"
height="315"
src="https://www.youtube.com/embed/vkNHMqQqCtk?si=Jnd3Vx17iDKw-v3f"
title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen></iframe>
</div>
<UFormField id="videoUrl" class="w-full mt-3 mb-4" label="Video URL:" >
<UInput type="text" value="https://www.youtube.com/watch?v=dQw4w9WgXcQ" class="w-full" />
</UFormField>
<UFormField id="outputFile" class="w-full mt-4 mb-3" label="Output File Name:">
<UInput type="text" value="my_audio.mp3" class="w-full" />
</UFormField>
<div class="text-center">
<UButton class="mt-4 rounded-md px-6 py-3 text-white" >Convert to MP3</UButton>
</div>
</div>
<UFormField id="videoUrl" class="w-full mt-3 mb-4" label="Video URL:" >
<UInput type="text" value="https://www.youtube.com/watch?v=dQw4w9WgXcQ" class="w-full" />
</UFormField>
<UFormField id="outputFile" class="w-full mt-4 mb-3" label="Output File Name:">
<UInput type="text" value="my_audio.mp3" class="w-full" />
</UFormField>
<div class="text-center">
<UButton class="mt-4 rounded-md px-6 py-3 text-white">Convert to MP3</UButton>
</div>
</div>
</template>