From c7f2880c466ea27ec6eaa5c70c9932e685cb61d8 Mon Sep 17 00:00:00 2001 From: Hassaan Ali Date: Sun, 1 Jun 2025 23:38:56 +0500 Subject: [PATCH] mods page sort buttons improved --- src/components/ModsList.astro | 114 +++------------------------------- 1 file changed, 10 insertions(+), 104 deletions(-) diff --git a/src/components/ModsList.astro b/src/components/ModsList.astro index b2d99ff..fb60a65 100644 --- a/src/components/ModsList.astro +++ b/src/components/ModsList.astro @@ -41,10 +41,8 @@ const totalPages = Math.ceil(allMods.length / defaultLimit) /> -
-
+
+
-
- -
-
@@ -338,13 +307,6 @@ const totalPages = Math.ceil(allMods.length / defaultLimit) } }) } - - document.addEventListener('limit-changed', e => { - if (e instanceof CustomEvent) { - const newLimit = e.detail.value - this.setState({ limit: newLimit, page: 1 }) - } - }) } setState(newState) { // Prevent multiple renders @@ -712,60 +674,4 @@ const totalPages = Math.ceil(allMods.length / defaultLimit) // Initialize the mods search new ModsSearch() - - class CustomDropdown { - constructor() { - this.button = document.getElementById('limit-button') - this.dropdown = document.getElementById('limit-dropdown') - this.valueSpan = document.getElementById('limit-value') - - if (!this.button || !this.dropdown || !this.valueSpan) return - - this.button.addEventListener('click', () => this.toggle()) - this.dropdown.addEventListener('click', e => this.handleOptionClick(e)) - - // Close dropdown when clicking outside - document.addEventListener('click', e => { - if (!this.button?.contains(e.target) && !this.dropdown?.contains(e.target)) { - this.close() - } - }) - } - - toggle() { - const isExpanded = this.button?.getAttribute('aria-expanded') === 'true' - if (isExpanded) { - this.close() - } else { - this.open() - } - } - - open() { - this.button?.setAttribute('aria-expanded', 'true') - this.dropdown?.classList.remove('hidden') - } - - close() { - this.button?.setAttribute('aria-expanded', 'false') - this.dropdown?.classList.add('hidden') - } - - handleOptionClick(e) { - const target = e.target - if (target instanceof HTMLButtonElement && target.dataset.value) { - const value = target.dataset.value - if (this.valueSpan) { - this.valueSpan.textContent = value - } - // Trigger change event for ModsSearch - const event = new CustomEvent('limit-changed', { detail: { value: parseInt(value, 10) } }) - document.dispatchEvent(event) - this.close() - } - } - } - - // Initialize the custom dropdown - new CustomDropdown()