diff --git a/app/javascript/.storybook/preview.js b/app/javascript/.storybook/preview.js index 74d9380fc..d9f157c70 100644 --- a/app/javascript/.storybook/preview.js +++ b/app/javascript/.storybook/preview.js @@ -8,7 +8,7 @@ import '../../assets/javascripts/lib/xss'; import '../../assets/javascripts/utilities/timeAgo'; import './storybook.scss'; -function addStylesheet(theme) { +function addStylesheet(theme = '') { if (theme === '') { return; // default theme } @@ -18,37 +18,52 @@ function addStylesheet(theme) { link.type = 'text/css'; link.rel = 'stylesheet'; - link.href = `themes/${event.target.value}.css`; + link.href = `themes/${theme}.css`; link.id = 'dev-theme'; head.appendChild(link); } -const themeSwitcher = (event) => { - const currentTheme = document.getElementById('dev-theme'); +function themeSwitcher(event) { + const themeNode = document.getElementById('dev-theme'); + const theme = event.target.value; - if (currentTheme) { - currentTheme.parentElement.removeChild(currentTheme); + if (themeNode) { + themeNode.parentElement.removeChild(themeNode); } - addStylesheet(event.target.value); -}; + localStorage.setItem('storybook-crayons-theme', theme); -const themeSwitcherDecorator = (storyFn) => ( -