Make user dropdown menu consistent across all pages

- Update index.html dropdown to match player.html and broker.html
- Add Wallet and Profile Settings links with icons
- Add dropdown divider for visual separation
- Add UI Consistency Requirements section to AI.PROMPT
- Document header and dropdown menu consistency requirements
parent d3a94841
...@@ -54,6 +54,18 @@ The website serves as the primary interface for two types of users: ...@@ -54,6 +54,18 @@ The website serves as the primary interface for two types of users:
- **Essential**: Focus on core functionality without unnecessary features - **Essential**: Focus on core functionality without unnecessary features
- **User-friendly**: Intuitive navigation and clear calls-to-action - **User-friendly**: Intuitive navigation and clear calls-to-action
- **Performance**: Fast loading times and efficient resource usage - **Performance**: Fast loading times and efficient resource usage
- **Consistency**: All pages must have consistent UI elements, especially the header and user dropdown menu
## UI Consistency Requirements
- **Header Navigation**: The header and user dropdown menu must be consistent across ALL pages of the website
- **User Dropdown Menu**: All dropdown menus should have the same items and styling:
- Dashboard (with appropriate icon)
- Wallet (💰)
- Profile Settings (⚙️)
- Divider
- Logout (🚪)
- **Balance Display**: The balance button should have a readable background with proper contrast
- **Dropdown Styling**: Solid background (#2a2a2a), border, and shadow for visibility
## API Integration Notes ## API Integration Notes
- All API calls are made to the mbetterc backend - All API calls are made to the mbetterc backend
......
...@@ -36,8 +36,11 @@ ...@@ -36,8 +36,11 @@
<span class="dropdown-arrow"></span> <span class="dropdown-arrow"></span>
</div> </div>
<div id="user-dropdown" class="user-dropdown" style="display: none;"> <div id="user-dropdown" class="user-dropdown" style="display: none;">
<a href="#" onclick="goToDashboard()" class="dropdown-item">Dashboard</a> <a href="#" onclick="goToDashboard()" class="dropdown-item">📊 Dashboard</a>
<a href="#" onclick="logout()" class="dropdown-item">Logout</a> <a href="wallet.html" class="dropdown-item">💰 Wallet</a>
<a href="profile.html" class="dropdown-item">⚙️ Profile Settings</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item" onclick="logout(); return false;">🚪 Logout</a>
</div> </div>
</div> </div>
</nav> </nav>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment