index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval' data: blob:; connect-src *; worker-src blob: 'self'; img-src * data: blob:">
    <title>Perplexity Finance</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="app-container">
        <!-- Sidebar with watchlist -->
        <aside class="watchlist-sidebar">
            <!-- Logo section -->
            <div class="logo-container">
                <div class="logo-wrapper">
                    <img src="image copy.png" alt="Logo Icon" class="logo-icon">
                    <img src="Perplexity-Finance.png" alt="Perplexity Finance" class="logo-image">
                </div>
            </div>
            
            <div class="search-container">
                <input type="text" id="searchInput" placeholder="Search symbol...">
                <button id="addButton">Add</button>
            </div>
            
            <div class="watchlist-header">
                <h2>My Symbols</h2>
            </div>
            
            <div class="watchlist" id="watchlist">
                <!-- Stock items will be inserted here -->
            </div>
        </aside>

        <!-- Main content area -->
        <main class="main-content">
            <webview 
                id="perplexityView"
                src="about:blank"
                partition="persist:perplexity"
                allowpopups
                webpreferences="contextIsolation=false"
                useragent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36"
                style="width:100%; height:100%;"
                preload="./preload.js">
            </webview>
        </main>
    </div>

    <script src="app.js"></script>
</body>
</html> 