p1otek/winterfail
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: Mobile menu button in top-left corner

Browse Source
This commit is contained in:
DiTus
2026-03-21 08:18:57 +01:00
parent 03a1262100
commit ee58df6169
2 changed files with 36 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
index.html
View File

@ -47,10 +47,25 @@
<!-- Top Navigation Bar -->
<header class="bg-[#0f131e] fixed top-0 w-full z-[60] h-16 px-6 flex items-center justify-between border-b border-[#1b1f2b]">
<div class="flex items-center space-x-3 bg-[#1a2333] px-3 py-1.5 rounded-md cursor-pointer border border-[#2d3a4f]">
<span class="material-symbols-outlined text-sm text-[#8fa2b3]">search</span>
<span class="font-bold text-sm text-[#dfe2f2]">BTC/USD</span>
<span class="material-symbols-outlined text-sm text-[#8fa2b3]">chevron_right</span>
<div class="flex items-center gap-3">
<!-- Mobile Menu Button -->
<button id="mobileMenuBtn" class="md:hidden w-10 h-10 flex items-center justify-center text-[#8fa2b3] hover:text-white hover:bg-[#2d3a4f] rounded-md transition-colors z-50">
<span class="material-symbols-outlined text-lg">menu</span>
</button>
<!-- Search/Symbol Button -->
<div class="hidden md:flex items-center space-x-3 bg-[#1a2333] px-3 py-1.5 rounded-md cursor-pointer border border-[#2d3a4f]">
<span class="material-symbols-outlined text-sm text-[#8fa2b3]">search</span>
<span class="font-bold text-sm text-[#dfe2f2]">BTC/USD</span>
<span class="material-symbols-outlined text-sm text-[#8fa2b3]">chevron_right</span>
</div>
<!-- Mobile Search -->
<div class="md:hidden flex items-center bg-[#1a2333] px-3 py-1.5 rounded-md cursor-pointer border border-[#2d3a4f]">
<span class="material-symbols-outlined text-sm text-[#8fa2b3]">search</span>
<span class="font-bold text-sm text-[#dfe2f2] ml-2">BTC/USD</span>
<span class="material-symbols-outlined text-sm text-[#8fa2b3] ml-2">chevron_right</span>
</div>
</div>
<div class="hidden md:flex items-center gap-2 mr-4">
@ -243,8 +258,10 @@
</button>
</div>
<!-- We need to preserve the ID 'sidebarToggleBtn' if JS binds to it -->
<button id="sidebarToggleBtn" class="hidden"></button>
<!-- Desktop Sidebar Toggle -->
<button id="sidebarToggleBtn" class="md:flex hidden w-8 h-8 bg-[#1a2333] border border-[#2d3a4f] text-gray-300 flex items-center justify-center rounded hover:bg-[#2d3a4f] transition-colors" title="Toggle Sidebar">
<span class="material-symbols-outlined text-sm">menu</span>
</button>
<div class="flex-1 overflow-y-auto p-0 sidebar-content bg-[#0d1421]">
<div class="sidebar-tab-panel active h-full" id="tab-indicators">

14
js/app.js
View File

@ -32,12 +32,24 @@ window.updateIndicatorCandles = drawIndicatorsOnChart;
window.IndicatorRegistry = IndicatorRegistry;
document.addEventListener('DOMContentLoaded', async () => {
// Attach toggle sidebar event listener
// Attach toggle sidebar event listeners
const toggleBtn = document.getElementById('sidebarToggleBtn');
if (toggleBtn) {
toggleBtn.addEventListener('click', toggleSidebar);
}
// Mobile menu button
const mobileMenuBtn = document.getElementById('mobileMenuBtn');
if (mobileMenuBtn) {
mobileMenuBtn.addEventListener('click', (e) => {
e.stopPropagation();
const sidebar = document.getElementById('rightSidebar');
if (sidebar) {
sidebar.classList.toggle('collapsed');
}
});
}
// Initialize timezone selector
const timezoneSelect = document.getElementById('timezoneSelect');
const settingsPopup = document.getElementById('settingsPopup');