multipleof4/4ev.link
1
0
Fork 0
mirror of https://github.com/multipleof4/4ev.link.git synced 2026-01-13 15:57:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Delete public/index.html

Browse Source
This commit is contained in:
multipleof4
2025-09-26 20:08:24 -07:00
committed by GitHub
parent dad041832a
commit 66db4975fa
1 changed files with 0 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
public/index.html
View File

@@ -1,40 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Link Shortener</title>
<script src="https://cdn.tailwindcss.com"></script>
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://unpkg.com/lucide@latest"></script>
</head>
<body class="bg-gray-900 text-gray-200 antialiased flex items-center justify-center min-h-screen">
<div class="w-full max-w-md p-8 space-y-6 bg-gray-800 rounded-lg shadow-lg"
x-data="{u:'',s:'',e:'',l:false,c:false,
async go(){this.l=!0;this.s=this.e='';try{const r=await fetch('/api/create',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({url:this.u})});if(!r.ok)throw new Error(await r.text()||'Error');const d=await r.json();this.s=d.shortUrl;this.u=''}catch(t){this.e=t.message}finally{this.l=!1}},
copy(){navigator.clipboard.writeText(this.s);this.c=!0;setTimeout(()=>this.c=!1,2e3)}}">
<h1 class="text-3xl font-bold text-center text-white">Shorten a URL</h1>
<form @submit.prevent="go">
<div class="flex items-center border border-gray-600 rounded-md focus-within:ring-2 focus-within:ring-indigo-500">
<input type="url" x-model="u" placeholder="https://example.com" required class="w-full p-3 bg-transparent text-white placeholder-gray-400 focus:outline-none">
<button type="submit" :disabled="l" class="p-3 text-white bg-indigo-600 rounded-r-md hover:bg-indigo-700 disabled:bg-indigo-400 disabled:cursor-not-allowed">
<i x-show="!l" data-lucide="link-2" class="w-5 h-5"></i>
<i x-show="l" data-lucide="loader-2" class="w-5 h-5 animate-spin"></i>
</button>
</div>
</form>
<template x-if="s"><div class="p-4 mt-4 text-center bg-gray-700 border border-green-500 rounded-md">
<p class="text-sm text-gray-400">Your shortened link:</p>
<div class="flex items-center justify-center mt-2 space-x-2">
<a :href="s" target="_blank" class="text-lg font-mono text-green-400 hover:underline" x-text="s"></a>
<button @click="copy()" class="p-1 text-gray-400 hover:text-white">
<i x-show="!c" data-lucide="copy" class="w-5 h-5"></i>
<i x-show="c" data-lucide="check" class="w-5 h-5 text-green-400"></i>
</button>
</div>
</div></template>
<template x-if="e"><div class="p-4 mt-4 text-center text-red-400 bg-gray-700 border border-red-500 rounded-md" x-text="e"></div></template>
</div>
<script>lucide.createIcons()</script>
</body>
</html>