Add color to search button background
This commit is contained in:
parent
483098215e
commit
da0e0c8b18
3 changed files with 10 additions and 9 deletions
|
@ -825,9 +825,11 @@
|
|||
width: 32px;
|
||||
align-items: center;
|
||||
margin-right: 1rem;
|
||||
background: transparent;
|
||||
background: rgba(100, 100, 100, 0.5);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
border-radius: 100vmax;
|
||||
box-shadow: var(--ciderShadow-Generic);
|
||||
|
||||
> ._svg-icon {
|
||||
width: 18px;
|
||||
|
|
|
@ -13640,9 +13640,11 @@ input[type=checkbox][switch]:checked:active::before {
|
|||
width: 32px;
|
||||
align-items: center;
|
||||
margin-right: 1rem;
|
||||
background: transparent;
|
||||
background: rgba(100, 100, 100, 0.5);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
border-radius: 100vmax;
|
||||
box-shadow: var(--ciderShadow-Generic);
|
||||
}
|
||||
.playlist-page .playlist-display .playlistInfo .playlist-info .search-btn > ._svg-icon {
|
||||
width: 18px;
|
||||
|
|
|
@ -108,15 +108,12 @@
|
|||
{{app.getLz('term.confirm')}}
|
||||
</button>
|
||||
<div style="display: flex; float: right;">
|
||||
<button :class="['search-btn', showSearch ? 'active' : '']"
|
||||
@click="toggleSearch()"
|
||||
:aria-label="showSearch ? app.getLz('term.hideSearch') : app.getLz('term.showSearch')">
|
||||
<svg-icon :style="{ 'background': '#' + hasHeroObject()?.textColor4 ?? '' }"
|
||||
:url="showSearch ? './assets/search-alt.svg' : './assets/search.svg'">
|
||||
<button :style="{ 'background': '#' + hasHeroObject()?.textColor4 ?? '' }" :class="['search-btn', showSearch ? 'active' : '']" @click="toggleSearch()" :aria-label="showSearch ? app.getLz('term.hideSearch') : app.getLz('term.showSearch')">
|
||||
<svg-icon :style="{ 'width': '15px', 'background-color': '#' + hasHeroObject()?.bgColor ?? '' }" :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>
|
||||
<button :style="{ 'background': '#' + hasHeroObject()?.textColor4 ?? '' }" class="more-btn-round" @click="menu" :aria-label="app.getLz('term.more')">
|
||||
<div :style="{ 'background-color': '#' + hasHeroObject()?.bgColor ?? '' }" class="svg-icon"></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue