| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Settings - ProfitPulse AI Trader</title> |
| <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); |
| body { |
| font-family: 'Inter', sans-serif; |
| } |
| .glass-effect { |
| background: rgba(255, 255, 255, 0.1); |
| backdrop-filter: blur(10px); |
| border: 1px solid rgba(255, 255, 255, 0.2); |
| } |
| </style> |
| </head> |
| <body class="min-h-screen bg-gray-900 text-white"> |
| |
| <nav class="glass-effect fixed w-full z-50"> |
| <div class="container mx-auto px-6 py-4"> |
| <div class="flex justify-between items-center"> |
| <div class="flex items-center space-x-2"> |
| <div class="w-8 h-8 bg-gradient-to-r from-green-400 to-blue-500 rounded-full"></div> |
| <span class="text-xl font-bold">ProfitPulse</span> |
| </div> |
| <div class="hidden md:flex space-x-8"> |
| <a href="dashboard.html" class="hover:text-blue-300 transition-colors">Dashboard</a> |
| <a href="analysis.html" class="hover:text-blue-300 transition-colors">Analysis</a> |
| <a href="portfolio.html" class="hover:text-blue-300 transition-colors">Portfolio</a> |
| <a href="settings.html" class="hover:text-blue-300 transition-colors">Settings</a> |
| </div> |
| <div class="flex items-center space-x-4"> |
| <a href="index.html" class="bg-gradient-to-r from-green-500 to-blue-600 px-6 py-2 rounded-full font-semibold hover:shadow-lg transition-all"> |
| Back to Home |
| </a> |
| <button class="md:hidden"> |
| <i data-feather="menu"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| </nav> |
|
|
| |
| <section class="pt-32 pb-20"> |
| <div class="container mx-auto px-6"> |
| <h1 class="text-4xl font-bold text-center mb-8">Settings & Preferences</h1> |
| |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8"> |
| |
| <div class="glass-effect rounded-2xl p-6"> |
| <div class="flex items-center mb-6"> |
| <i data-feather="user" class="w-8 h-8 text-blue-400 mr-3"></i> |
| <h3 class="text-xl font-semibold">Account Settings</h3> |
| </div> |
| <div class="space-y-4"> |
| <div> |
| <label class="block text-sm font-medium mb-2">Risk Tolerance</label> |
| <select class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-2"> |
| <option>Beginner (Low Risk)</option> |
| <option>Moderate</option> |
| <option>Advanced (High Risk)</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-sm font-medium mb-2">Learning Pace</label> |
| <select class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-2"> |
| <option>Slow & Steady (Recommended)</option> |
| <option>Moderate</option> |
| <option>Fast Track</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-sm font-medium mb-2">Starting Budget</label> |
| <select class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-2"> |
| <option>$100 - Learn with Small Amount</option> |
| <option>$500 - Moderate Starter</option> |
| <option>$1,000 - Confident Beginner</option> |
| </select> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="glass-effect rounded-2xl p-6"> |
| <div class="flex items-center mb-6"> |
| <i data-feather="bell" class="w-8 h-8 text-green-400 mr-3"></i> |
| <h3 class="text-xl font-semibold">Notifications</h3> |
| </div> |
| <div class="space-y-4"> |
| <div class="flex items-center justify-between"> |
| <span>Learning Reminders</span> |
| <label class="relative inline-flex items-center cursor-pointer"> |
| <input type="checkbox" class="sr-only peer" checked> |
| <div class="w-11 h-6 bg-gray-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-green-500"></div> |
| </label> |
| </div> |
| <div class="flex items-center justify-between"> |
| <span>Market Updates</span> |
| <label class="relative inline-flex items-center cursor-pointer"> |
| <input type="checkbox" class="sr-only peer" checked> |
| <div class="w-11 h-6 bg-gray-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-green-500"></div> |
| </label> |
| </div> |
| <div class="flex items-center justify-between"> |
| <span>Risk Alerts</span> |
| <label class="relative inline-flex items-center cursor-pointer"> |
| <input type="checkbox" class="sr-only peer" checked> |
| <div class="w-11 h-6 bg-gray-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-green-500"></div> |
| </label> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="glass-effect rounded-2xl p-6 mt-8"> |
| <div class="flex flex-col sm:flex-row gap-4 justify-center"> |
| <a href="dashboard.html" class="bg-gradient-to-r from-green-500 to-blue-600 px-8 py-4 rounded-full font-semibold text-lg hover:scale-105 transition-transform text-center"> |
| Save Settings |
| </a> |
| <a href="portfolio.html" class="glass-effect px-8 py-4 rounded-full font-semibold text-lg hover:bg-white hover:bg-opacity-20 transition-colors text-center"> |
| Reset to Defaults |
| </a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <script> |
| document.addEventListener('DOMContentLoaded', function() { |
| feather.replace(); |
| }); |
| </script> |
| </body> |
| </html> |
