Projets/ObsiGate
1
1
Fork 0
Code Issues 16 Pull Requests Actions Packages Projects Releases 16 Wiki Activity

Replace native select dropdowns with custom styled dropdowns featuring improved visual consistency, dark mode support, and enhanced accessibility with ARIA attributes

Browse Source
This commit is contained in:
bruno
2026-03-22 00:56:55 -04:00
parent 29c1618472
commit 565c3c8a27
3 changed files with 300 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/index.html
+19 -7
View File
@@ -95,9 +95,16 @@
</span>
<span class="menu-list-content">
<span class="menu-list-title">Vault</span>
<select id="vault-filter" class="menu-select menu-list-select">
<option value="all">Tous les vaults</option>
</select>
<div class="custom-dropdown" id="vault-filter-dropdown">
<button class="custom-dropdown-trigger" type="button" aria-haspopup="listbox" aria-expanded="false">
<span class="custom-dropdown-selected">Tous les vaults</span>
<i data-lucide="chevron-down" style="width:14px;height:14px"></i>
</button>
<ul class="custom-dropdown-menu" role="listbox" id="vault-filter-options">
<li role="option" data-value="all" class="custom-dropdown-option selected">Tous les vaults</li>
</ul>
<input type="hidden" id="vault-filter" value="all">
</div>
</span>
</label>
<button class="menu-list-row menu-list-button" id="theme-toggle" type="button" role="menuitem">
@@ -139,10 +146,15 @@
</div>
<div class="sidebar-tree" id="sidebar-tree">
<div class="sidebar-quick-select">
<select id="vault-quick-select" class="menu-select sidebar-quick-select-control">
<option value="all">Tous les vaults</option>
</select>
<div class="custom-dropdown sidebar-dropdown" id="vault-quick-select-dropdown">
<button class="custom-dropdown-trigger" type="button" aria-haspopup="listbox" aria-expanded="false">
<span class="custom-dropdown-selected">Tous les vaults</span>
<i data-lucide="chevron-down" style="width:14px;height:14px"></i>
</button>
<ul class="custom-dropdown-menu" role="listbox" id="vault-quick-select-options">
<li role="option" data-value="all" class="custom-dropdown-option selected">Tous les vaults</li>
</ul>
<input type="hidden" id="vault-quick-select" value="all">
</div>
<button class="sidebar-panel-toggle" id="vault-panel-toggle" type="button" aria-expanded="true" aria-controls="vault-panel-content">
<span class="sidebar-section-title">Vaults</span>