From d665d296a37eff3a265240c922c5d75d08ab4246 Mon Sep 17 00:00:00 2001
From: Corson-Dosch <hcorson-dosch@usgs.gov>
Date: Thu, 20 Mar 2025 11:57:09 -0500
Subject: [PATCH] fix accordion button click event for symbol
---
src/components/FindexGlobalThreatsViz.vue | 7 +++----
1 file changed, 3 insertions(+), 4 deletions(-)
diff --git a/src/components/FindexGlobalThreatsViz.vue b/src/components/FindexGlobalThreatsViz.vue
index 559eb5c..852a651 100644
--- a/src/components/FindexGlobalThreatsViz.vue
+++ b/src/components/FindexGlobalThreatsViz.vue
@@ -79,7 +79,7 @@
<div v-for="item, index in subCategoryData.subThreatText" :key="index" class="accordion-container" :class="`${tab.tabContentTitleID}-accordion`">
<button class="accordion" :class="[`${tab.tabContentTitleID}-bkgd`, { 'active': item.activeOnLoad }]" @click="accordionClick">
<h4 class="accordion-button-text" v-html="item.heading"></h4>
- <span class="symbol"></span>
+ <span class="accordion-button-text symbol"></span>
</button>
<div class="panel" :class="[{ 'active': item.activeOnLoad }]">
<p v-if="!primaryCategorySelected" v-html="item.text" />
@@ -195,12 +195,11 @@
return new URL(`../assets/images/${file}`, import.meta.url).href
}
function accordionClick(event) {
- // Pull class associated with target
+ // Pull class(es) associated with target
const targetClass = event.target.classList.value
- console.log(targetClass)
// If the target is the button text, target the parent button element
// Otherwise if the target is the button, target it directly
- const accordion = targetClass == 'accordion-button-text' ? event.target.parentElement : event.target
+ const accordion = targetClass.includes('accordion-button-text') ? event.target.parentElement : event.target
accordion.classList.toggle("active");
const panel = accordion.nextElementSibling;
panel.classList.toggle("active");
--
GitLab