Skip to content

Commit

Permalink
Merge pull request #80 from BU-Spark/site
Browse files Browse the repository at this point in the history
updated dark/light scheme selection
  • Loading branch information
trgardos authored Aug 8, 2024
2 parents 69a175c + 7416146 commit f82200a
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 16 deletions.
28 changes: 28 additions & 0 deletions websites/fa2024/_includes/header_custom.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<button class="btn js-toggle-dark-mode fs-3">dark color scheme</button>

<script>
document.addEventListener('DOMContentLoaded', function() {
const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');
const currentTheme = localStorage.getItem('theme') || 'light';

if (currentTheme === 'dark') {
jtd.setTheme('dark');
toggleDarkMode.textContent = 'light color scheme';
} else {
jtd.setTheme('light');
toggleDarkMode.textContent = 'dark color scheme';
}

jtd.addEvent(toggleDarkMode, 'click', function() {
if (jtd.getTheme() === 'dark') {
jtd.setTheme('light');
toggleDarkMode.textContent = 'dark color scheme';
localStorage.setItem('theme', 'light');
} else {
jtd.setTheme('dark');
toggleDarkMode.textContent = 'light color scheme';
localStorage.setItem('theme', 'dark');
}
});
});
</script>
2 changes: 2 additions & 0 deletions websites/fa2024/_sass/custom/custom.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
// per https://just-the-docs.com/docs/customization/#override-and-completely-custom-styles

16 changes: 0 additions & 16 deletions websites/fa2024/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,22 +16,6 @@ The Spark! Machine Learning Practicum gives you hands-on experience developing s
for real world challenges.
{: .fs-6 .fs-300}

<button class="btn js-toggle-dark-mode">dark color scheme</button>

<script>
const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');

jtd.addEvent(toggleDarkMode, 'click', function(){
if (jtd.getTheme() === 'dark') {
jtd.setTheme('light');
toggleDarkMode.textContent = 'dark color scheme';
} else {
jtd.setTheme('dark');
toggleDarkMode.textContent = 'light color scheme';
}
});
</script>

---

## Logistics
Expand Down

0 comments on commit f82200a

Please sign in to comment.