Files
sgse-app/apps/web/src/routes/+layout.svelte
deyvisonwanderley 031552c836 feat: enhance sidebar and theme utilities for improved UI consistency
- Updated the Sidebar component styles to utilize theme-based classes for better visual consistency.
- Added new utility functions to retrieve and convert theme colors for use in components, enhancing theming capabilities.
- Improved layout logic to ensure the default theme is applied correctly based on user preferences and document readiness.
2025-11-22 22:10:52 -03:00

58 lines
1.9 KiB
Svelte

<script lang="ts">
import "../app.css";
import Sidebar from "$lib/components/Sidebar.svelte";
import { createSvelteAuthClient } from "@mmailaender/convex-better-auth-svelte/svelte";
import { authClient } from "$lib/auth";
// Importar polyfill ANTES de qualquer outro código que possa usar Jitsi
import "$lib/utils/jitsiPolyfill";
import { useQuery } from "convex-svelte";
import { api } from "@sgse-app/backend/convex/_generated/api";
import { aplicarTema, aplicarTemaPadrao } from "$lib/utils/temas";
const { children } = $props();
createSvelteAuthClient({ authClient });
// Buscar usuário atual para aplicar tema
const currentUser = useQuery(api.auth.getCurrentUser, {});
// Aplicar tema quando o usuário for carregado
$effect(() => {
if (typeof document === 'undefined') return;
const htmlElement = document.documentElement;
// Aguardar um pouco para garantir que o DOM está pronto
const timeoutId = setTimeout(() => {
if (currentUser?.data?.temaPreferido) {
// Usuário logado com tema preferido - aplicar tema salvo
aplicarTema(currentUser.data.temaPreferido);
} else if (currentUser !== undefined) {
// Se a query terminou (mesmo que não haja usuário), aplicar tema padrão
if (!htmlElement.getAttribute('data-theme')) {
aplicarTemaPadrao();
}
}
}, 50);
return () => clearTimeout(timeoutId);
});
// Aplicar tema padrão imediatamente ao carregar (antes de verificar usuário)
$effect(() => {
if (typeof document !== 'undefined') {
// Se não há tema aplicado ainda, aplicar o padrão imediatamente
const htmlElement = document.documentElement;
if (!htmlElement.getAttribute('data-theme')) {
aplicarTemaPadrao();
}
}
});
</script>
<div>
<div class="flex">
<Sidebar>{@render children()}</Sidebar>
</div>
</div>