diff --git a/templates/index.html b/templates/index.html
index 1f625ac..44623b2 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,25 +1,22 @@
-
+
Set Overview
-
-
+
+
+
+
+
-
-
-
+
+
+
+
@@ -169,7 +245,7 @@ body {
@@ -436,7 +512,7 @@ document.addEventListener('DOMContentLoaded', function () {
const themeDropdown = document.getElementById('themeDropdown');
// Retrieve all unique values from the
elements
- const themes = [];
+ const themes = ['Show all'];
const themeLinks = document.querySelectorAll('.set_theme');
themeLinks.forEach(function(link) {
const themeId = link.textContent.trim();
@@ -447,24 +523,29 @@ document.addEventListener('DOMContentLoaded', function () {
// Create options for the dropdown list
themes.forEach(function(theme) {
- const option = document.createElement('option');
+ const option = document.createElement('a');
+ option.className = "navbar-item";
option.value = theme;
option.textContent = theme;
themeDropdown.appendChild(option);
+ option.addEventListener('click', function() {
+ filterGridItems(theme);
+ });
});
// Add event listener to filter grid items
- themeDropdown.addEventListener('change', function() {
- const selectedTheme = themeDropdown.value;
- filterGridItems(selectedTheme);
- });
+// themeDropdown.addEventListener('click', function() {
+// console.log($(this));
+// const selectedTheme = themeDropdown.value;
+// filterGridItems(selectedTheme);
+// });
function filterGridItems(selectedTheme) {
const gridItems = document.querySelectorAll('.grid-item');
gridItems.forEach(function(item) {
const themeLink = item.querySelector('.set_theme');
const themeId = themeLink.textContent.trim();
- if (!selectedTheme || themeId === selectedTheme) {
+ if (!selectedTheme || themeId === selectedTheme || selectedTheme == "Show all") {
item.style.display = 'block'; // Show the grid item
} else {
item.style.display = 'none'; // Hide the grid item
@@ -473,7 +554,17 @@ document.addEventListener('DOMContentLoaded', function () {
}
});
+$(document).ready(function() {
+// Check for click events on the navbar burger icon
+$(".navbar-burger").click(function() {
+
+ // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
+ $(".navbar-burger").toggleClass("is-active");
+ $(".navbar-menu").toggleClass("is-active");
+
+});
+});