Russell Ballestrini
d3c5e31bde
- Create ui-translations.js with UI_TRANSLATIONS object and translation functions - Create ui-themes.js with theme detection and styling functions - Create language-detection.js with AI-powered language detection - Remove duplicate code from ui.js, reducing from 5600+ to 4741 lines - Fix import assignments and syntax errors - All functionality preserved while improving code organization
92 lines
2.3 KiB
JavaScript
92 lines
2.3 KiB
JavaScript
// Theme detection and styling functionality
|
|
|
|
// Theme detection and styling functions
|
|
export function detectCurrentTheme() {
|
|
const isDark =
|
|
document.documentElement.getAttribute("data-theme") === "dark" ||
|
|
(window.matchMedia?.("(prefers-color-scheme: dark)").matches &&
|
|
!document.documentElement.getAttribute("data-theme"));
|
|
|
|
return isDark ? "dark" : "light";
|
|
}
|
|
|
|
export function getThemeColors(theme = detectCurrentTheme()) {
|
|
if (theme === "dark") {
|
|
return {
|
|
// Main backgrounds
|
|
modalBackground: "#1a1a1a",
|
|
contentBackground: "#2d2d2d",
|
|
panelBackground: "#262626",
|
|
|
|
// Text colors
|
|
primaryText: "#ffffff",
|
|
secondaryText: "#cccccc",
|
|
mutedText: "#999999",
|
|
|
|
// Borders and dividers
|
|
borderColor: "#444444",
|
|
dividerColor: "#333333",
|
|
focusBorder: "#0066cc",
|
|
|
|
// Buttons
|
|
buttonBackground: "#404040",
|
|
buttonHover: "#4a4a4a",
|
|
buttonBorder: "#555555",
|
|
|
|
// Shadows
|
|
lightShadow: "rgba(0, 0, 0, 0.3)",
|
|
heavyShadow: "rgba(0, 0, 0, 0.5)",
|
|
|
|
// Action button styling
|
|
actionBackground: "rgba(255, 255, 255, 0.1)",
|
|
actionHover: "rgba(255, 255, 255, 0.2)",
|
|
actionBorder: "rgba(255, 255, 255, 0.2)",
|
|
};
|
|
}
|
|
return {
|
|
// Main backgrounds
|
|
modalBackground: "#ffffff",
|
|
contentBackground: "#f8f9fa",
|
|
panelBackground: "#f1f3f5",
|
|
|
|
// Text colors
|
|
primaryText: "#212529",
|
|
secondaryText: "#495057",
|
|
mutedText: "#6c757d",
|
|
|
|
// Borders and dividers
|
|
borderColor: "#dee2e6",
|
|
dividerColor: "#e9ecef",
|
|
focusBorder: "#80bdff",
|
|
|
|
// Buttons
|
|
buttonBackground: "#ffffff",
|
|
buttonHover: "#f8f9fa",
|
|
buttonBorder: "#dee2e6",
|
|
|
|
// Shadows
|
|
lightShadow: "rgba(0, 0, 0, 0.1)",
|
|
heavyShadow: "rgba(0, 0, 0, 0.2)",
|
|
|
|
// Action button styling
|
|
actionBackground: "rgba(255, 255, 255, 0.2)",
|
|
actionHover: "rgba(255, 255, 255, 0.3)",
|
|
actionBorder: "rgba(255, 255, 255, 0.3)",
|
|
};
|
|
}
|
|
|
|
// Initialize ChunkFive font with absolute path
|
|
export function initializeChunkFiveFont() {
|
|
const fontFaceStyle = document.createElement("style");
|
|
fontFaceStyle.textContent = `
|
|
@font-face {
|
|
font-family: "ChunkFiveRegular";
|
|
src: url("https://uncloseai.com/css/chunkfive/chunkfive-regular-webfont.woff2") format("woff2"),
|
|
url("https://uncloseai.com/css/chunkfive/chunkfive-regular-webfont.woff") format("woff");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
`;
|
|
document.head.appendChild(fontFaceStyle);
|
|
}
|