search results pill added to artist grid
This commit is contained in:
@@ -254,6 +254,30 @@ export class ArtistsView extends LitElement {
|
|||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.search-indicator {
|
||||||
|
position: absolute;
|
||||||
|
top: 8px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
z-index: 5;
|
||||||
|
pointer-events: none;
|
||||||
|
background: var(
|
||||||
|
--yj-bg-overlay,
|
||||||
|
#495057
|
||||||
|
);
|
||||||
|
color: var(
|
||||||
|
--yj-text-secondary,
|
||||||
|
#b3b3b3
|
||||||
|
);
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 4px 14px;
|
||||||
|
border-radius: 12px;
|
||||||
|
border: 1px solid
|
||||||
|
var(--yj-border-subtle, #555);
|
||||||
|
white-space: nowrap;
|
||||||
|
opacity: 0.92;
|
||||||
|
}
|
||||||
|
|
||||||
.loading-message,
|
.loading-message,
|
||||||
.empty-message {
|
.empty-message {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -949,6 +973,15 @@ export class ArtistsView extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return html`
|
return html`
|
||||||
|
${this.searchCtrl.term
|
||||||
|
? html`<div
|
||||||
|
class="search-indicator"
|
||||||
|
>
|
||||||
|
Showing results for
|
||||||
|
“${this.searchCtrl
|
||||||
|
.term}”
|
||||||
|
</div>`
|
||||||
|
: nothing}
|
||||||
<div class="grid-scroll-container">
|
<div class="grid-scroll-container">
|
||||||
<lit-virtualizer
|
<lit-virtualizer
|
||||||
.items=${entries}
|
.items=${entries}
|
||||||
|
|||||||
Reference in New Issue
Block a user