Initial commit: Clean DSS implementation
Migrated from design-system-swarm with fresh git history.
Old project history preserved in /home/overbits/apps/design-system-swarm
Core components:
- MCP Server (Python FastAPI with mcp 1.23.1)
- Claude Plugin (agents, commands, skills, strategies, hooks, core)
- DSS Backend (dss-mvp1 - token translation, Figma sync)
- Admin UI (Node.js/React)
- Server (Node.js/Express)
- Storybook integration (dss-mvp1/.storybook)
Self-contained configuration:
- All paths relative or use DSS_BASE_PATH=/home/overbits/dss
- PYTHONPATH configured for dss-mvp1 and dss-claude-plugin
- .env file with all configuration
- Claude plugin uses ${CLAUDE_PLUGIN_ROOT} for portability
Migration completed: $(date)
🤖 Clean migration with full functionality preserved
This commit is contained in:
94
admin-ui/js/core/theme.js
Normal file
94
admin-ui/js/core/theme.js
Normal file
@@ -0,0 +1,94 @@
|
||||
/**
|
||||
* Theme Manager - Handles light/dark theme with cookie persistence
|
||||
*/
|
||||
|
||||
class ThemeManager {
|
||||
constructor() {
|
||||
this.cookieName = 'dss-theme';
|
||||
this.cookieExpireDays = 365;
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
// Load theme from cookie or default to dark
|
||||
const savedTheme = this.getCookie(this.cookieName) || 'dark';
|
||||
this.setTheme(savedTheme, false); // Don't save on init
|
||||
}
|
||||
|
||||
/**
|
||||
* Get cookie value
|
||||
*/
|
||||
getCookie(name) {
|
||||
const value = `; ${document.cookie}`;
|
||||
const parts = value.split(`; ${name}=`);
|
||||
if (parts.length === 2) {
|
||||
return parts.pop().split(';').shift();
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set cookie value
|
||||
*/
|
||||
setCookie(name, value, days) {
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
||||
const expires = `expires=${date.toUTCString()}`;
|
||||
document.cookie = `${name}=${value};${expires};path=/;SameSite=Lax`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set theme (light or dark)
|
||||
*/
|
||||
setTheme(theme, save = true) {
|
||||
const html = document.documentElement;
|
||||
|
||||
if (theme === 'dark') {
|
||||
html.classList.add('dark');
|
||||
html.classList.remove('light');
|
||||
} else {
|
||||
html.classList.add('light');
|
||||
html.classList.remove('dark');
|
||||
}
|
||||
|
||||
// Save to cookie
|
||||
if (save) {
|
||||
this.setCookie(this.cookieName, theme, this.cookieExpireDays);
|
||||
}
|
||||
|
||||
// Dispatch event for other components
|
||||
window.dispatchEvent(new CustomEvent('theme-changed', {
|
||||
detail: { theme }
|
||||
}));
|
||||
|
||||
return theme;
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggle between light and dark
|
||||
*/
|
||||
toggle() {
|
||||
const currentTheme = this.getCurrentTheme();
|
||||
const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
|
||||
return this.setTheme(newTheme);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get current theme
|
||||
*/
|
||||
getCurrentTheme() {
|
||||
return document.documentElement.classList.contains('dark') ? 'dark' : 'light';
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if dark mode is active
|
||||
*/
|
||||
isDark() {
|
||||
return this.getCurrentTheme() === 'dark';
|
||||
}
|
||||
}
|
||||
|
||||
// Create singleton instance
|
||||
const themeManager = new ThemeManager();
|
||||
|
||||
export default themeManager;
|
||||
Reference in New Issue
Block a user