- Add data-wood attribute to collections container for CSS targeting - Update woodPaneling.ts and woodPanelingInit.ts to set/remove attribute - Add CSS variables for wood-specific text colors (dark text on light wood, light text on dark wood) - Add !important rules to override theme colors when wood is active - Replace wood-dark and wood-mahogany textures with darker variants - Add subtle borders to book cards on wood backgrounds
26 lines
929 B
TypeScript
26 lines
929 B
TypeScript
// Early initialization script to prevent flash of wrong background
|
|
// Loads before woodPaneling.js to apply paneling immediately
|
|
|
|
const WOOD_INIT_STORAGE_KEY = 'wood-paneling';
|
|
|
|
// Apply wood paneling immediately (before DOM ready if possible)
|
|
(function() {
|
|
const woodPaneling = localStorage.getItem(WOOD_INIT_STORAGE_KEY) || 'none';
|
|
if (woodPaneling !== 'none') {
|
|
const applyPaneling = () => {
|
|
const container = document.getElementById('collections-container');
|
|
if (container) {
|
|
container.classList.add(`bg-${woodPaneling}`);
|
|
container.setAttribute('data-wood', woodPaneling);
|
|
}
|
|
};
|
|
|
|
// Apply immediately if DOM is ready, otherwise wait
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', applyPaneling);
|
|
} else {
|
|
applyPaneling();
|
|
}
|
|
}
|
|
})();
|