Add daisyui integration, remove Header and page components, and update layout structure

This commit is contained in:
2025-10-23 11:20:55 -03:00
parent 577261bf67
commit 9d17ad1271
14 changed files with 111 additions and 85 deletions

View File

@@ -0,0 +1,12 @@
<script>
const { children } = $props();
</script>
<div class="max-w-[1600px w-full">
<main
id="container-central"
class="m-3 rounded-xl shadow-sm overflow-y-auto p-4"
>
{@render children()}
</main>
</div>

View File

@@ -0,0 +1,8 @@
<div class="space-y-4">
<h2 class="text-2xl font-bold text-brand-dark">Dashboard</h2>
<div class="grid md:grid-cols-3 gap-4">
<div class="p-4 rounded-xl border">Bem-vindo ao SGSE.</div>
<div class="p-4 rounded-xl border">Selecione um setor no menu lateral.</div>
<div class="p-4 rounded-xl border">KPIs e gráficos virão aqui.</div>
</div>
</div>

View File

@@ -0,0 +1 @@
<h1 class="text-2xl font-bold">Recursos Humanos</h1>

View File

@@ -1,16 +1,16 @@
<script lang="ts">
import '../app.css';
import Header from '../components/Header.svelte';
import { PUBLIC_CONVEX_URL } from '$env/static/public';
import { setupConvex } from 'convex-svelte';
import "../app.css";
import Header from "$lib/components/Header.svelte";
import Sidebar from "$lib/components/Sidebar.svelte";
import { PUBLIC_CONVEX_URL } from "$env/static/public";
import { setupConvex } from "convex-svelte";
const { children } = $props();
setupConvex(PUBLIC_CONVEX_URL);
const { children } = $props();
setupConvex(PUBLIC_CONVEX_URL);
</script>
<div class="grid h-svh grid-rows-[auto_1fr]">
<Header />
<main class="overflow-y-auto">
{@render children()}
</main>
<div>
<div class="flex">
<Sidebar>{@render children()}</Sidebar>
</div>
</div>

View File

@@ -1,43 +0,0 @@
<script lang="ts">
import { useQuery } from 'convex-svelte';
import { api } from "@sgse-app/backend/convex/_generated/api";
const healthCheck = useQuery(api.healthCheck.get, {});
const TITLE_TEXT = `
██████╗ ███████╗████████╗████████╗███████╗██████╗
██╔══██╗██╔════╝╚══██╔══╝╚══██╔══╝██╔════╝██╔══██╗
██████╔╝█████╗ ██║ ██║ █████╗ ██████╔╝
██╔══██╗██╔══╝ ██║ ██║ ██╔══╝ ██╔══██╗
██████╔╝███████╗ ██║ ██║ ███████╗██║ ██║
╚═════╝ ╚══════╝ ╚═╝ ╚═╝ ╚══════╝╚═╝ ╚═╝
████████╗ ███████╗████████╗ █████╗ ██████╗██╗ ██╗
╚══██╔══╝ ██╔════╝╚══██╔══╝██╔══██╗██╔════╝██║ ██╔╝
██║ ███████╗ ██║ ███████║██║ █████╔╝
██║ ╚════██║ ██║ ██╔══██║██║ ██╔═██╗
██║ ███████║ ██║ ██║ ██║╚██████╗██║ ██╗
╚═╝ ╚══════╝ ╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═╝
`;
</script>
<div class="container mx-auto max-w-3xl px-4 py-2">
<pre class="overflow-x-auto font-mono text-sm">{TITLE_TEXT}</pre>
<div class="grid gap-6">
<section class="rounded-lg border p-4">
<h2 class="mb-2 font-medium">API Status</h2>
<div class="flex items-center gap-2">
<div
class={`h-2 w-2 rounded-full ${healthCheck.data ? "bg-green-500" : "bg-red-500"}`}
></div>
<span class="text-muted-foreground text-sm">
{healthCheck.isLoading
? "Checking..."
: healthCheck.data
? "Connected"
: "Disconnected"}
</span>
</div>
</section>
</div>
</div>