Make playlist search icon use hero color

This commit is contained in:
Pedro Galhardo 2022-07-01 10:10:24 +01:00
parent eaf3523180
commit ea828a97e9
No known key found for this signature in database
GPG key ID: 4740524CD85770A9
4 changed files with 8 additions and 21 deletions

View file

@ -111,7 +111,9 @@
<button :class="['search-btn', showSearch ? 'active' : '']"
@click="toggleSearch()"
:aria-label="showSearch ? app.getLz('term.hideSearch') : app.getLz('term.showSearch')">
<svg-icon :url="showSearch ? './assets/search-alt.svg' : './assets/search.svg'"></svg-icon>
<svg-icon :style="{ 'background': '#' + hasHeroObject()?.textColor4 ?? '' }"
:url="showSearch ? './assets/search-alt.svg' : './assets/search.svg'">
</svg-icon>
</button>
<button class="more-btn-round" @click="menu" :aria-label="app.getLz('term.more')">
<div class="svg-icon"></div>
@ -841,18 +843,12 @@
},
toggleSearch() {
this.showSearch = !this.showSearch;
if (!this.showSearch && this.searchQuery != "") {
// Clear search query if the search bar becomes hidden
this.searchQuery = "";
this.search();
} else if (this.showSearch) {
// Ensure search bar is visible
document.querySelector(".tab-pane.active").scrollTo({
top: 0,
left: 0,
behavior: "smooth"
});
// Focus search bar
this.$nextTick(() => {
this.$refs["search-bar"].focus();