fixed layout in "on page" section

This commit is contained in:
2026-02-11 11:38:35 +03:00
parent 26e3bac589
commit 4932b20991
17 changed files with 127 additions and 31 deletions

View File

@@ -865,11 +865,55 @@ body {
user-select: none;
}
.page-highlights-filters-wrap {
display: flex;
flex-direction: column;
gap: 6px;
flex-shrink: 0;
}
.page-highlights-filters-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
flex-shrink: 0;
}
.page-highlights-filters-actions .page-highlights-filter-link {
font-size: var(--text-xs);
font-weight: 500;
color: var(--text-color);
opacity: 0.7;
background: none;
border: none;
padding: 0;
cursor: pointer;
text-decoration: underline;
text-underline-offset: 2px;
transition: opacity 0.2s, color 0.2s;
}
.page-highlights-filters-actions .page-highlights-filter-link:hover {
opacity: 1;
color: var(--accent);
}
.page-highlights-filters-actions span[aria-hidden="true"] {
font-size: var(--text-xs);
color: var(--text-color);
opacity: 0.5;
user-select: none;
}
.page-highlights-filters {
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: center;
max-height: 62px;
overflow-y: auto;
overflow-x: hidden;
}
.page-highlights-filter-chip {

View File

@@ -210,7 +210,10 @@
</span>
<span class="page-highlights-group-label" data-i18n="group_by_list">Group by list</span>
</label>
<div id="pageHighlightsListFilters" class="page-highlights-filters"></div>
<div class="page-highlights-filters-wrap">
<div id="pageHighlightsFiltersActions" class="page-highlights-filters-actions" hidden></div>
<div id="pageHighlightsListFilters" class="page-highlights-filters"></div>
</div>
</div>
<div id="pageHighlightsList" class="page-highlights-list"></div>
</div>