This commit is contained in:
2026-09-19 12:50:56 +02:00
parent 1477d56658
commit 15628739b1
12 changed files with 303 additions and 66 deletions
+29 -5
View File
@@ -85,15 +85,35 @@
@media (max-width: 600px) {
.topbar-left, .topbar-right { gap: 4px; }
.topbar-icon-btn { width: 32px; height: 32px; font-size: .78rem; }
#filter-active-summary { max-width: 140px; font-size: .65rem; padding: 4px 6px 4px 9px; gap: 4px; }
#filter-active-clear { width: 16px; height: 16px; font-size: .65rem; }
}
#filter-active-summary {
display: none;
background: rgba(0,0,0,.6); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
border: 1px solid var(--accent); border-radius: 50px;
padding: 6px 12px; font-size: .7rem; font-weight: 700; letter-spacing: .03em;
color: var(--accent); max-width: 190px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
padding: 5px 8px 5px 12px; font-size: .7rem; font-weight: 700; letter-spacing: .03em;
color: var(--accent); max-width: 220px;
align-items: center; gap: 6px;
}
#filter-active-summary.show { display: inline-flex; }
#filter-active-summary-text {
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
#filter-active-clear {
background: none; border: none; padding: 0; margin: 0;
color: var(--accent); cursor: pointer;
display: inline-flex; align-items: center; justify-content: center;
width: 18px; height: 18px; border-radius: 50%;
font-size: .72rem; flex-shrink: 0; opacity: .8;
transition: opacity .15s, background .15s, color .15s, transform .12s;
}
#filter-active-clear:hover {
opacity: 1; background: rgba(255,255,255,.18); color: #fff; transform: scale(1.15);
}
#filter-active-clear:active {
transform: scale(0.92);
}
#filter-active-summary.show { display: block; }
/* ── VOLUME POPUP ─────────────────────────────── */
#volume-popup {
@@ -1001,7 +1021,8 @@
no_comments: "{{ t('scroller.no_comments') }}",
write_comment: "{{ t('scroller.write_comment') }}",
login_required: "{{ t('scroller.login_required') }}",
login_to_comment: "{{ t('scroller.login_to_comment') }}"
login_to_comment: "{{ t('scroller.login_to_comment') }}",
clear_filter: "{{ t('scroller.clear_filter') || 'Clear filter' }}"
};
@if(typeof session !== 'undefined' && session)
window.scrollerUsername = "{{ session.user || '' }}";
@@ -1059,7 +1080,10 @@
<div id="scroller-topbar">
<div class="topbar-left">
<a id="scroller-back" class="topbar-icon-btn" href="/" title="{{ t('scroller.back') }}"><i class="fa-solid fa-arrow-left"></i></a>
<div id="filter-active-summary"></div>
<div id="filter-active-summary">
<span id="filter-active-summary-text"></span>
<button id="filter-active-clear" type="button" title="{{ t('scroller.clear_filter') || 'Clear filter' }}" aria-label="{{ t('scroller.clear_filter') || 'Clear filter' }}"><i class="fa-solid fa-xmark"></i></button>
</div>
</div>
<div class="topbar-right">
<button id="chan-open-btn" class="topbar-icon-btn" title="{{ t('scroller.chan_threads') }}" style="display:none"><i class="fa-solid fa-clover"></i></button>