SESP/sgse-app
2
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: implement theme customization and user preferences

Browse Source 
- Added support for user-selected themes, allowing users to customize the appearance of the application.
- Introduced a new `temaPreferido` field in the user schema to store the preferred theme.
- Updated various components to apply the selected theme dynamically based on user preferences.
- Enhanced the UI to include a theme selection interface, enabling users to preview and save their theme choices.
- Implemented a polyfill for BlobBuilder to ensure compatibility across browsers, improving the functionality of the application.
This commit is contained in:
deyvisonwanderley
2025-11-22 22:05:52 -03:00
parent 58ac3a4f1b
commit 37d7318d5a
12 changed files with 1149 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
apps/web/src/app.html
View File

@@ -1,5 +1,5 @@
<!doctype html>
<html lang="en" data-theme="aqua">
<html lang="en" id="html-theme">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
@@ -10,43 +10,112 @@
<script>
// Executar IMEDIATAMENTE, de forma síncrona e bloqueante
// Não usar IIFE assíncrona, executar direto no escopo global
if (typeof window !== 'undefined') {
// Verificar se já foi adicionado
if (!window.__blobBuilderPolyfillAdded) {
// Implementar BlobBuilder usando Blob moderno
function BlobBuilder() {
this.parts = [];
(function() {
'use strict';
// Implementar BlobBuilder usando Blob moderno
function BlobBuilderPolyfill() {
if (!(this instanceof BlobBuilderPolyfill)) {
return new BlobBuilderPolyfill();
}
BlobBuilder.prototype.append = function(data) {
this.parts = [];
}
BlobBuilderPolyfill.prototype.append = function(data) {
if (data instanceof Blob) {
this.parts.push(data);
};
BlobBuilder.prototype.getBlob = function(contentType) {
return new Blob(this.parts, contentType ? { type: contentType } : undefined);
};
// Adicionar em TODOS os locais possíveis, SEM verificação
// (sobrescrever se necessário para garantir que esteja disponível)
window.BlobBuilder = BlobBuilder;
window.WebKitBlobBuilder = BlobBuilder;
window.MozBlobBuilder = BlobBuilder;
window.MSBlobBuilder = BlobBuilder;
// Adicionar no globalThis também
if (typeof globalThis !== 'undefined') {
globalThis.BlobBuilder = BlobBuilder;
globalThis.WebKitBlobBuilder = BlobBuilder;
globalThis.MozBlobBuilder = BlobBuilder;
} else if (typeof data === 'string') {
this.parts.push(data);
} else {
this.parts.push(new Blob([data]));
}
};
BlobBuilderPolyfill.prototype.getBlob = function(contentType) {
return new Blob(this.parts, contentType ? { type: contentType } : undefined);
};
// Função para aplicar o polyfill em todos os contextos possíveis
function aplicarPolyfillBlobBuilder() {
// Aplicar no window (se disponível)
if (typeof window !== 'undefined') {
if (!window.BlobBuilder) {
window.BlobBuilder = BlobBuilderPolyfill;
}
if (!window.WebKitBlobBuilder) {
window.WebKitBlobBuilder = BlobBuilderPolyfill;
}
if (!window.MozBlobBuilder) {
window.MozBlobBuilder = BlobBuilderPolyfill;
}
if (!window.MSBlobBuilder) {
window.MSBlobBuilder = BlobBuilderPolyfill;
}
}
// Marcar como adicionado
window.__blobBuilderPolyfillAdded = true;
// Aplicar no globalThis (se disponível)
if (typeof globalThis !== 'undefined') {
if (!globalThis.BlobBuilder) {
globalThis.BlobBuilder = BlobBuilderPolyfill;
}
if (!globalThis.WebKitBlobBuilder) {
globalThis.WebKitBlobBuilder = BlobBuilderPolyfill;
}
if (!globalThis.MozBlobBuilder) {
globalThis.MozBlobBuilder = BlobBuilderPolyfill;
}
}
// Log apenas se console está disponível
if (console && console.log) {
console.log('✅ Polyfill BlobBuilder adicionado globalmente (via app.html)');
// Aplicar no self (para workers)
if (typeof self !== 'undefined') {
if (!self.BlobBuilder) {
self.BlobBuilder = BlobBuilderPolyfill;
}
if (!self.WebKitBlobBuilder) {
self.WebKitBlobBuilder = BlobBuilderPolyfill;
}
if (!self.MozBlobBuilder) {
self.MozBlobBuilder = BlobBuilderPolyfill;
}
}
// Aplicar no global (Node.js)
if (typeof global !== 'undefined') {
if (!global.BlobBuilder) {
global.BlobBuilder = BlobBuilderPolyfill;
}
if (!global.WebKitBlobBuilder) {
global.WebKitBlobBuilder = BlobBuilderPolyfill;
}
if (!global.MozBlobBuilder) {
global.MozBlobBuilder = BlobBuilderPolyfill;
}
}
}
}
// Aplicar imediatamente
aplicarPolyfillBlobBuilder();
// Aplicar também quando o DOM estiver pronto (caso window não esteja disponível ainda)
if (typeof document !== 'undefined' && document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', aplicarPolyfillBlobBuilder, { once: true });
}
// Log apenas se console está disponível
if (typeof console !== 'undefined' && console.log) {
console.log('✅ Polyfill BlobBuilder adicionado globalmente (via app.html)');
}
})();
// Aplicar tema padrão imediatamente se não houver tema definido
(function() {
if (typeof document !== 'undefined') {
var html = document.documentElement;
if (!html.getAttribute('data-theme')) {
html.setAttribute('data-theme', 'aqua');
}
}
})();
</script>
</head>
<body data-sveltekit-preload-data="hover">