/home/devscfvi/crypto.devsquantum.com/index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>Crypto Trading Journal</title>
    
    <!-- PWA Meta Tags -->
    <meta name="theme-color" content="#8b5cf6">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="Trading Journal">
    <link rel="apple-touch-icon" href="/icon-192.png">
    <link rel="manifest" href="/manifest.json">
    
    <!-- Tailwind CSS -->
    <script src="https://cdn.tailwindcss.com"></script>
    <script>
        // Suppress production warning (safe for development)
        if (window.tailwind) {
            tailwind.config = {}; // Initializes config, suppresses warning
        }
    </script>


    <!-- Chart.js -->
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    
    <!-- Custom Styles -->
    <link rel="stylesheet" href="css/styles.css">


    <link rel="icon" href="favicon-16x16.png">

    <style>
        body { 
            opacity: 0; 
            transition: opacity 0.2s;
        }
        body.loaded { 
            opacity: 1; 
        }
    </style>

</head>
<body class="bg-slate-950 text-white overflow-x-hidden">
    
    <!-- Main App Container -->
    <div id="app" class="pb-20"></div>
    
    <!-- Bottom Navigation -->
    <nav id="bottom-nav" class="fixed bottom-0 left-0 right-0 glass border-t border-violet-500/20 z-50 safe-area-bottom">
        <div class="flex items-center justify-around py-2 px-1 max-w-screen overflow-x-hidden">
            
            <!-- Calculator -->
            <button onclick="navigateTo('calculator')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="calculator">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 7h6m0 10v-3m-3 3h.01M9 17h.01M9 14h.01M12 14h.01M15 11h.01M12 11h.01M9 11h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">Calc</span>
            </button>
            
            <!-- Trades -->
            <button onclick="navigateTo('history')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="history">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">Trades</span>
            </button>
            
            <!-- Analytics -->
            <button onclick="navigateTo('analytics')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="analytics">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">Stats</span>
            </button>
            
            <!-- Goals -->
            <button onclick="navigateTo('goals')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="goals">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">Goals</span>
            </button>
            
            <!-- Journal -->
            <button onclick="navigateTo('journal')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="journal">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">Journal</span>
            </button>
            
            <!-- More -->
            <button onclick="navigateTo('more')" class="nav-btn flex flex-col items-center gap-0.5 px-1 py-1.5 rounded-lg transition active:scale-95 flex-1 min-w-0" data-view="more">
                <svg class="w-5 h-5 sm:w-6 sm:h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
                </svg>
                <span class="text-[10px] sm:text-xs font-medium truncate w-full text-center">More</span>
            </button>
            
        </div>
    </nav>
    
    <!-- Modal Container -->
    <div id="modal-container"></div>
    
    <!-- Toast Container -->
    <div id="toast-container" class="fixed top-4 right-4 z-50 space-y-2"></div>
    
    <!-- JavaScript Modules (CRITICAL ORDER) -->
    <script src="js/utils.js"></script>
    <script src="js/calculator.js"></script>
    <script src="js/history.js"></script>
    <script src="js/analytics.js"></script>
    <script src="js/mistakes.js"></script>
    <script src="js/goals.js"></script>
    <script src="js/journal.js"></script>
    <script src="js/calendar.js"></script>
    <script src="js/app.js"></script>
    
    <!-- PWA Service Worker -->
    <script>
    if ('serviceWorker' in navigator) {
        window.addEventListener('load', () => {
            navigator.serviceWorker.register('/service-worker.js')
                .then(reg => console.log('✅ Service Worker registered'))
                .catch(err => console.log('❌ Service Worker registration failed:', err));
        });
    }
    </script>
    

    <script>
        window.addEventListener('load', () => {
            document.body.classList.add('loaded');
        });
    </script>


</body>
</html>
Path: home/devscfvi/crypto.devsquantum.com