LukeParke/OpenAPI.gg
1
0
Fork 0
mirror of https://github.com/LukeHagar/OpenAPI.gg.git synced 2025-12-06 04:20:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Moved to stats page

Browse Source
This commit is contained in:
Luke Hagar
2024-05-24 22:03:11 -05:00
parent 6473e60893
commit f035b17c36
3 changed files with 67 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/routes/+page.svelte
View File

@@ -1,50 +1,23 @@
<script lang="ts">
import { openApiStore, operationCount, pathCount } from '$lib';
const stats = [
{
title: 'Paths',
value: pathCount($openApiStore)
},
{
title: 'Operation IDs',
value: operationCount($openApiStore)
}
];
</script>
<div class="w-full h-full flex flex-col">
<div class="flex flex-row gap-4 justify-center">
{#each stats as stat}
<div class="card w-52 p-10 text-center flex flex-col gap-4">
<h2 class="text-lg">{stat.title}</h2>
<p class="text-lg">
{stat.value}
</p>
</div>
{/each}
</div>
<div class="flex flex-col items-center justify-center grow">
<h1 class="h1">
<span
class="bg-gradient-to-br from-blue-500 to-cyan-300 bg-clip-text text-transparent box-decoration-clone"
>
Design.
</span>
</h1>
<h1 class="h1">
<span
class="bg-gradient-to-br from-red-500 to-yellow-500 bg-clip-text text-transparent box-decoration-clone"
>
Build.
</span>
</h1>
<h1 class="h1">
<span
class="bg-gradient-to-br from-pink-500 to-violet-500 bg-clip-text text-transparent box-decoration-clone"
>
Deploy.
</span>
</h1>
</div>
<div class="w-full h-full flex flex-col items-center justify-center grow">
<h1 class="h1">
<span
class="bg-gradient-to-br from-blue-500 to-cyan-300 bg-clip-text text-transparent box-decoration-clone"
>
Design.
</span>
</h1>
<h1 class="h1">
<span
class="bg-gradient-to-br from-red-500 to-yellow-500 bg-clip-text text-transparent box-decoration-clone"
>
Build.
</span>
</h1>
<h1 class="h1">
<span
class="bg-gradient-to-br from-pink-500 to-violet-500 bg-clip-text text-transparent box-decoration-clone"
>
Deploy.
</span>
</h1>
</div>

18
src/routes/FancyAppRail.svelte
View File

@@ -124,6 +124,24 @@
</svg>
Paths
</AppRailAnchor>
<AppRailAnchor href="/stats" selected={$page.url.pathname === '/stats'}>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-6 mx-auto"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M7.5 14.25v2.25m3-4.5v4.5m3-6.75v6.75m3-9v9M6 20.25h12A2.25 2.25 0 0 0 20.25 18V6A2.25 2.25 0 0 0 18 3.75H6A2.25 2.25 0 0 0 3.75 6v12A2.25 2.25 0 0 0 6 20.25Z"
/>
</svg>
Stats
</AppRailAnchor>
<svelte:fragment slot="trail">
<FileButton
bind:files

27
src/routes/stats/+page.svelte Normal file
View File

@@ -0,0 +1,27 @@
<script lang="ts">
import { openApiStore, operationCount, pathCount } from '$lib';
const stats = [
{
title: 'Paths',
value: pathCount($openApiStore)
},
{
title: 'Operation IDs',
value: operationCount($openApiStore)
}
];
</script>
<div class="flex flex-row gap-4 justify-center">
{#each stats as stat}
<div
class="border-token rounded-container-token bg-surface-backdrop-token w-52 p-10 text-center flex flex-col gap-4"
>
<h2 class="text-lg">{stat.title}</h2>
<p class="text-lg">
{stat.value}
</p>
</div>
{/each}
</div>