Simplify header dropdown menu with streamlined list-based layout, remove card-based design, and reduce visual complexity with cleaner styling
This commit is contained in:
+28
-42
@@ -88,50 +88,36 @@
|
||||
<i data-lucide="settings" style="width:18px;height:18px"></i>
|
||||
</button>
|
||||
<div class="header-menu-dropdown" id="header-menu-dropdown">
|
||||
<div class="menu-overview">
|
||||
<div class="menu-overview-badge">⚙️ Réglages rapides</div>
|
||||
<div class="menu-overview-title">Personnalisez votre espace</div>
|
||||
<div class="menu-overview-subtitle">Vault actif, thème et guide d'utilisation en un seul endroit.</div>
|
||||
</div>
|
||||
<div class="menu-section">
|
||||
<div class="menu-label">Vault</div>
|
||||
<div class="menu-field-card">
|
||||
<div class="menu-field-icon">🗂️</div>
|
||||
<div class="menu-field-body">
|
||||
<div class="menu-field-title">Contexte de navigation</div>
|
||||
<select id="vault-filter" class="menu-select">
|
||||
<div class="menu-list" role="menu" aria-label="Options">
|
||||
<label class="menu-list-row menu-list-select-row" for="vault-filter">
|
||||
<span class="menu-list-icon" aria-hidden="true">
|
||||
<i data-lucide="folders" style="width:17px;height:17px"></i>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-divider"></div>
|
||||
<div class="menu-section">
|
||||
<div class="menu-label">Thème</div>
|
||||
<div class="menu-field-card">
|
||||
<div class="menu-field-icon">🌗</div>
|
||||
<div class="menu-field-body">
|
||||
<div class="menu-field-title">Apparence</div>
|
||||
<button class="menu-theme-btn" id="theme-toggle">
|
||||
<i data-lucide="sun" style="width:16px;height:16px"></i>
|
||||
<span id="theme-label">Clair</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-divider"></div>
|
||||
<div class="menu-section">
|
||||
<div class="menu-label">Aide</div>
|
||||
<div class="menu-field-card">
|
||||
<div class="menu-field-icon">💡</div>
|
||||
<div class="menu-field-body">
|
||||
<div class="menu-field-title">Documentation intégrée</div>
|
||||
<button class="menu-theme-btn" id="help-open-btn">
|
||||
<i data-lucide="circle-help" style="width:16px;height:16px"></i>
|
||||
<span>Ouvrir l'aide</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
</label>
|
||||
<button class="menu-list-row menu-list-button" id="theme-toggle" type="button" role="menuitem">
|
||||
<span class="menu-list-icon" aria-hidden="true">
|
||||
<i data-lucide="sun" style="width:17px;height:17px"></i>
|
||||
</span>
|
||||
<span class="menu-list-content">
|
||||
<span class="menu-list-title">Thème</span>
|
||||
<span class="menu-list-subtitle" id="theme-label">Clair</span>
|
||||
</span>
|
||||
</button>
|
||||
<button class="menu-list-row menu-list-button" id="help-open-btn" type="button" role="menuitem">
|
||||
<span class="menu-list-icon" aria-hidden="true">
|
||||
<i data-lucide="circle-help" style="width:17px;height:17px"></i>
|
||||
</span>
|
||||
<span class="menu-list-content">
|
||||
<span class="menu-list-title">Guide d'utilisation</span>
|
||||
<span class="menu-list-subtitle">Ouvrir l'aide</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user