style(next): fix broken backdrop blur when scrolling dropdowns

This commit is contained in:
Adorian Doran 2025-02-04 22:24:56 +02:00
parent 7514e2348c
commit bc82cdbd01
3 changed files with 13 additions and 2 deletions

View File

@ -27,7 +27,7 @@ const TPL = `
<span class="editability-active-desc">${t("editability_select.auto")}</span>
<span class="caret"></span>
</button>
<div class="editability-dropdown dropdown-menu dropdown-menu-right">
<div class="editability-dropdown dropdown-menu dropdown-menu-right tn-dropdown-list">
<a class="dropdown-item" href="#" data-editability="auto">
<span class="check">&check;</span>
${t("editability_select.auto")}

View File

@ -40,7 +40,7 @@ const TPL = `
<span class="note-type-desc"></span>
<span class="caret"></span>
</button>
<div class="note-type-dropdown dropdown-menu dropdown-menu-left"></div>
<div class="note-type-dropdown dropdown-menu dropdown-menu-left tn-dropdown-list"></div>
</div>
`;

View File

@ -951,6 +951,9 @@ body.mobile .note-title {
/*
* Menus
*
* Note: apply the "tn-dropdown-list" class for scrollable dropdown menus. Submenus are not
* supported when this class is used.
*/
.dropdown-menu {
@ -982,6 +985,14 @@ body.desktop .dropdown-menu::before {
z-index: -1;
}
body.desktop .dropdown-menu.tn-dropdown-list {
backdrop-filter: var(--dropdown-backdrop-filter);
}
body.desktop .dropdown-menu.tn-dropdown-list::before {
display: none;
}
body.desktop .dropdown-submenu .dropdown-menu::before {
content: unset;
}