hotel_pi/frontend/src/themes.js
2026-04-06 21:33:52 -04:00

170 lines
3.3 KiB
JavaScript

// Theme Palette File - Easily swap themes by changing the export
export const themes = {
current: 'coastalModern', // Change this to switch themes
coastalModern: {
name: 'Coastal Modern',
statusBar: '#1B4965',
accentLine: '#FF6F61',
headerBar: {
start: '#1E8E9F',
mid: '#2EC4B6',
end: '#1E8E9F',
},
heroBg: {
start: '#1B6B7A',
mid: '#2EC4B6',
end: '#0F4C5C',
},
navBar: {
start: '#F4E1C1',
mid: '#EFDBAB',
end: '#EAD5A0',
},
borderTrim: '#1B4965',
navElements: '#1B4965',
welcomeText: '#FF6F61',
},
warmEarthy: {
name: 'Warm Earthy',
statusBar: '#A44A3F',
accentLine: '#F26A3D',
headerBar: {
start: '#2D9A8F',
mid: '#3FAF9F',
end: '#2D9A8F',
},
heroBg: {
start: '#8B4538',
mid: '#9D5A4F',
end: '#7A3D33',
},
navBar: {
start: '#F3D9A4',
mid: '#EDD19C',
end: '#E8CA94',
},
borderTrim: '#A44A3F',
navElements: '#A44A3F',
welcomeText: '#A44A3F',
},
tropicalSunset: {
name: 'Tropical Sunset',
statusBar: '#2D1B4E',
accentLine: '#FFD700',
headerBar: {
start: '#FF6B9D',
mid: '#FF8AB5',
end: '#FF6B9D',
},
heroBg: {
start: '#3D2A5E',
mid: '#4A3570',
end: '#2D1B4E',
},
navBar: {
start: '#9B7BA3',
mid: '#8B6B93',
end: '#7B5B83',
},
borderTrim: '#2D1B4E',
navElements: '#2D1B4E',
welcomeText: '#FFD700',
},
ncBeachVibe: {
name: 'NC Beach Vacation',
statusBar: '#1B5E8C',
accentLine: '#FF6B5A',
headerBar: {
start: '#0A4A7D',
mid: '#1B6B9C',
end: '#0A4A7D',
},
heroBg: {
start: '#1A7FA0',
mid: '#2B8BAD',
end: '#0D5A7A',
},
navBar: {
start: '#5BA3C9',
mid: '#4A95BD',
end: '#3A87B1',
},
borderTrim: '#1B5E8C',
navElements: '#1B5E8C',
welcomeText: '#E8C9A0',
},
caribbeanTropical: {
name: 'Caribbean Tropical',
statusBar: '#0B6E6D',
accentLine: '#FFD23F',
headerBar: {
start: '#FF6B35',
mid: '#FF8555',
end: '#FF6B35',
},
heroBg: {
start: '#00B4CC',
mid: '#00D4FF',
end: '#0090B6',
},
navBar: {
start: '#B0E0E6',
mid: '#A8D8E8',
end: '#9FD0EA',
},
borderTrim: '#0B6E6D',
navElements: '#0B6E6D',
welcomeText: '#FFD23F',
},
desertOasis: {
name: 'Desert Oasis',
statusBar: '#A0522D',
accentLine: '#00CED1',
headerBar: {
start: '#FFB347',
mid: '#FFC966',
end: '#FFB347',
},
heroBg: {
start: '#CD853F',
mid: '#D2691E',
end: '#8B4513',
},
navBar: {
start: '#F4E4C1',
mid: '#F0DEB4',
end: '#ECD8A7',
},
borderTrim: '#A0522D',
navElements: '#A0522D',
welcomeText: '#00CED1',
},
};
// Function to get current theme
export const getCurrentTheme = () => {
return themes[themes.current];
};
// Function to switch theme
export const switchTheme = (themeName) => {
if (themes[themeName]) {
themes.current = themeName;
return true;
}
console.error(`Theme "${themeName}" not found`);
return false;
};
// Get all available theme names
export const getAvailableThemes = () => {
return Object.keys(themes).filter(key => key !== 'current');
};