CaZzzer/vpgen
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

minor layout improvements

Browse Source
This commit is contained in:
Yuri Tatishchev 2024-12-31 19:23:45 -08:00
parent eb2b869015
commit 991355a95a
Signed by: CaZzzer
GPG Key ID: E0EBF441EA424369
4 changed files with 40 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/app.html
View File

@ -6,9 +6,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div class="flex min-h-screen flex-col items-center gap-8 p-4 max-sm:px-2">
<body
data-sveltekit-preload-data="hover"
class="flex min-h-screen flex-col items-center gap-8 p-4 max-sm:px-2"
>
%sveltekit.body%
</div>
</body>
</html>

8
src/routes/+layout.svelte
View File

@ -14,10 +14,10 @@
}
</script>
<header class="flex w-full flex-wrap justify-between gap-x-6 gap-y-4 md:max-w-3xl">
<header class="flex w-full flex-wrap justify-between gap-x-6 gap-y-4 xl:max-w-screen-xl">
<span class="font-bold sm:inline-block">VPGen</span>
<nav>
<ul class="flex flex-wrap items-center gap-6 text-sm">
<nav class="max-w-full">
<ul class="flex items-center gap-6 overflow-x-auto text-sm">
<li><a href="/" class={getNavClass(/^\/$/)}>Home</a></li>
{#if user}
<li><a href="/user" class={getNavClass(/^\/user$/)}>Profile</a></li>
@ -27,7 +27,7 @@
</ul>
</nav>
</header>
<main class="flex min-w-full max-w-full flex-grow flex-col gap-4 md:min-w-[48rem]">
<main class="flex min-w-full max-w-full flex-grow flex-col gap-4 xl:min-w-[1280px]">
{@render children()}
</main>

6
src/routes/+page.svelte
View File

@ -21,7 +21,7 @@
<section id="get-started" class="border-l-2 pl-6">
<p>
To get started,
<Button class="ml-2 p-2" href="/clients?add=New+Client">Create a New Client</Button>
<Button class="ml-2" href="/clients?add=New+Client">Create a New Client</Button>
</p>
</section>
<!-- <section id="using-wireguard">-->
@ -34,8 +34,8 @@
<!-- </details>-->
<!-- </section>-->
{:else}
<AuthForm class="p-4" />
<p>VPGen is a VPN generator that allows you to create and manage VPN connections.</p>
<AuthForm />
<!-- <p>VPGen is a VPN generator that allows you to create and manage VPN connections.</p>-->
{/if}
<style>

13
src/routes/clients/+page.svelte
View File

@ -61,13 +61,13 @@
</Table.Root>
<!--Floating action button for adding a new client-->
<!--Not sure if this is the best place for the input field, will think about it later-->
<div class="mt-auto flex self-end pt-4">
<Dialog.Root bind:open={dialogOpen}>
<Dialog.Trigger class={buttonVariants({ variant: "default" }) + "flex gap-4"}>
<Dialog.Root bind:open={dialogOpen}>
<div class="mt-auto flex self-end pt-4">
<Dialog.Trigger class={buttonVariants({ variant: 'default' }) + ' flex gap-4'}>
<LucidePlus />
Add Client
New Client
</Dialog.Trigger>
</div>
<Dialog.Content class="max-w-xs">
<form class="contents" method="post" action="?/create">
<Dialog.Header class="">
@ -90,5 +90,4 @@
</Dialog.Footer>
</form>
</Dialog.Content>
</Dialog.Root>
</div>
</Dialog.Root>