Sha256: 0936760d5ce32cb3c5e1a3e35071753c852fa68e0f287820f13176c6ee26bcd0
Contents?: true
Size: 1.26 KB
Versions: 62
Compression:
Stored size: 1.26 KB
Contents
// hello_controller.js
import { Controller } from "stimulus"
export default class extends Controller {
static targets = [ "dropdown", "button" ]
connect() {
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
const theme = localStorage.getItem('good_job-theme');
if (!["light", "dark"].includes(theme)) {
this.setTheme(this.autoTheme());
}
});
this.setTheme(this.getStoredTheme() || 'light');
}
change(event) {
const theme = event.params.value;
localStorage.setItem('good_job-theme', theme);
this.setTheme(theme);
}
setTheme(theme) {
document.documentElement.setAttribute('data-bs-theme', theme === 'auto' ? this.autoTheme() : theme);
this.buttonTargets.forEach((button) => {
button.classList.remove('active');
if (button.dataset.themeValueParam === theme) {
button.classList.add('active');
}
});
const svg = this.buttonTargets.filter(b => b.matches(".active"))[0]?.querySelector('svg');
this.dropdownTarget.querySelector('svg').outerHTML = svg.outerHTML;
}
getStoredTheme() {
return localStorage.getItem('good_job-theme');
}
autoTheme() {
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
}
}
Version data entries
62 entries across 62 versions & 1 rubygems