elias/url-shortener
1
0
Fork 0
mirror of https://github.com/eliasrenman/url-shortener.git synced 2026-03-16 20:16:06 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: margins

Browse Source
This commit is contained in:
Elias Renman
2025-03-25 12:44:07 +01:00
parent 2a5c3c4154
commit 7706cb96c4
2 changed files with 31 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/App.svelte
View File

@@ -8,7 +8,7 @@
</script> </script>
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
<main class="p-4"> <main>
{#if cookies.includes("access_token")} {#if cookies.includes("access_token")}
<Home /> <Home />
{:else} {:else}

58
web/src/pages/Home/Home.svelte
View File

@@ -6,35 +6,37 @@
const urls = queryUrls(); const urls = queryUrls();
</script> </script>
<Navbar /> <div class="p-4">
<Navbar />
<div class="max-w-3xl mx-auto p-4"> <div class="max-w-3xl mx-auto m-4">
<h1 class="text-2xl font-bold mb-4">URL Shortener</h1> <h1 class="text-2xl font-bold mb-4">URL Shortener</h1>
<!-- Table --> <!-- Table -->
<div class="bg-gray-800 text-white rounded-lg shadow-lg overflow-hidden"> <div class="bg-gray-800 text-white rounded-lg shadow-lg overflow-hidden">
{#if $urls.isLoading} {#if $urls.isLoading}
<p>Loading...</p> <p>Loading...</p>
{:else if $urls.isError} {:else if $urls.isError}
<p>Error: {$urls.error.message}</p> <p>Error: {$urls.error.message}</p>
{:else if $urls.isSuccess} {:else if $urls.isSuccess}
<table class="w-full text-left"> <table class="w-full text-left">
<thead class="bg-gray-900"> <thead class="bg-gray-900">
<tr> <tr>
<th class="p-3">Shortform</th> <th class="p-3">Shortform</th>
<th class="p-3">Destination</th> <th class="p-3">Destination</th>
<th class="p-3">Expires at</th> <th class="p-3">Expires at</th>
<th class="p-3">Actions</th> <th class="p-3">Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{#each $urls.data.data as row} {#each $urls.data.data as row}
<Row {row} /> <Row {row} />
{/each} {/each}
</tbody> </tbody>
</table> </table>
{/if} {/if}
</div>
<Create />
</div> </div>
<Create />
</div> </div>