35 lines
		
	
	
	
		
			1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			35 lines
		
	
	
	
		
			1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| (() => {
 | |
|     const darkThemes = ['ayu', 'navy', 'coal'];
 | |
|     const lightThemes = ['light', 'rust'];
 | |
| 
 | |
|     const classList = document.getElementsByTagName('html')[0].classList;
 | |
| 
 | |
|     let lastThemeWasLight = true;
 | |
|     for (const cssClass of classList) {
 | |
|         if (darkThemes.includes(cssClass)) {
 | |
|             lastThemeWasLight = false;
 | |
|             break;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     const theme = lastThemeWasLight ? 'default' : 'dark';
 | |
|     mermaid.initialize({ startOnLoad: true, theme });
 | |
| 
 | |
|     // Simplest way to make mermaid re-render the diagrams in the new theme is via refreshing the page
 | |
| 
 | |
|     for (const darkTheme of darkThemes) {
 | |
|         document.getElementById(darkTheme).addEventListener('click', () => {
 | |
|             if (lastThemeWasLight) {
 | |
|                 window.location.reload();
 | |
|             }
 | |
|         });
 | |
|     }
 | |
| 
 | |
|     for (const lightTheme of lightThemes) {
 | |
|         document.getElementById(lightTheme).addEventListener('click', () => {
 | |
|             if (!lastThemeWasLight) {
 | |
|                 window.location.reload();
 | |
|             }
 | |
|         });
 | |
|     }
 | |
| })();
 |