diff --git a/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue b/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue index f4c7f751c0..55a6a7d571 100644 --- a/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue +++ b/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue @@ -15,8 +15,12 @@ :key="'cat-' + key" appearance="flat-button" class="category-button" + :class="$computedClass({ ':hover': { background: selectedHighlightColor } })" :style="{ background: isCategoryActive(category.value) ? selectedHighlightColor : '', + ':hover': { + background: 'orange!important', + }, }" :text="coreString(category.value)" :disabled=" @@ -63,8 +67,8 @@ @@ -88,8 +92,8 @@ @@ -140,8 +144,8 @@ @@ -213,7 +217,7 @@ computed: { selectedHighlightColor() { // get right color - return this.$themePalette.blue.v_200; + return '#D9E1FD'; }, availableRootCategories() { if (this.searchableLabels) { @@ -324,9 +328,15 @@ }, }, methods: { + isChecked(inputKey, value) { + return this.isSelected(inputKey, value) || this.isEnabledButNotSelected(inputKey, value); + }, isSelected(inputKey, value) { + return this.value[inputKey][value.value] === true; + }, + isEnabledButNotSelected(inputKey, value) { return ( - this.value[inputKey][value.value] === true || + !this.isSelected(inputKey, value) && { languages: this.enabledLanguageOptions, channels: this.enabledChannelOptions,