Add Nebula Browser app, UI and assets
Add initial Nebula Browser project skeleton: CMakeLists to configure and link CEF (including post-build steps to copy runtime and UI files), a Windows CEF-based entry (app/main.cpp) that initializes CEF and loads the bundled UI, and a full ui/ and assets/ tree (HTML, CSS, JS, fonts, icons, and branding images). Update .gitignore to ignore build/out, thirdparty/cef, IDE and common OS artifacts.
This commit is contained in:
Andrew Zambazos
@@ -0,0 +1,134 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Welcome to Nebula</title>
|
||||
<link rel="stylesheet" href="../css/setup.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="setup-container">
|
||||
<!-- Progress indicator -->
|
||||
<div class="progress-bar">
|
||||
<div class="progress-step active" data-step="1">
|
||||
<div class="step-circle">1</div>
|
||||
<div class="step-label">Welcome</div>
|
||||
</div>
|
||||
<div class="progress-line"></div>
|
||||
<div class="progress-step" data-step="2">
|
||||
<div class="step-circle">2</div>
|
||||
<div class="step-label">Theme</div>
|
||||
</div>
|
||||
<div class="progress-line"></div>
|
||||
<div class="progress-step" data-step="3">
|
||||
<div class="step-circle">3</div>
|
||||
<div class="step-label">Default Browser</div>
|
||||
</div>
|
||||
<div class="progress-line"></div>
|
||||
<div class="progress-step" data-step="4">
|
||||
<div class="step-circle">4</div>
|
||||
<div class="step-label">Complete</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 1: Welcome -->
|
||||
<div class="setup-step active" data-step="1">
|
||||
<div class="step-content">
|
||||
|
||||
<h1 class="setup-title">Welcome to Nebula</h1>
|
||||
<p class="setup-subtitle">Let's personalize your browsing experience</p>
|
||||
<div class="feature-grid">
|
||||
<div class="feature-item">
|
||||
<div class="feature-icon">🎨</div>
|
||||
<h3>Beautiful Themes</h3>
|
||||
<p>Choose from stunning themes or create your own</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<div class="feature-icon">🚀</div>
|
||||
<h3>Lightning Fast</h3>
|
||||
<p>Built for speed and performance</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<div class="feature-icon">🎮</div>
|
||||
<h3>Steam Deck Ready</h3>
|
||||
<p>Optimized for gaming handhelds</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<div class="feature-icon">🔒</div>
|
||||
<h3>Privacy First</h3>
|
||||
<p>Your data stays yours</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="step-actions">
|
||||
<button class="btn btn-primary" id="btn-start">Get Started</button>
|
||||
<button class="btn btn-secondary" id="btn-skip-all">Skip Setup</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 2: Theme Selection -->
|
||||
<div class="setup-step" data-step="2">
|
||||
<div class="step-content">
|
||||
<h1 class="setup-title">Choose Your Theme</h1>
|
||||
<p class="setup-subtitle">Pick a color scheme that suits your style</p>
|
||||
<div class="theme-grid" id="theme-grid">
|
||||
<!-- Themes will be dynamically loaded here -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="step-actions">
|
||||
<button class="btn btn-secondary" id="btn-back-2">Back</button>
|
||||
<button class="btn btn-primary" id="btn-next-2">Continue</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 3: Default Browser -->
|
||||
<div class="setup-step" data-step="3">
|
||||
<div class="step-content">
|
||||
<h1 class="setup-title">Set as Default Browser</h1>
|
||||
<p class="setup-subtitle">Make Nebula your go-to browser for all links</p>
|
||||
<div class="default-browser-section">
|
||||
<div class="default-browser-card">
|
||||
<div class="browser-icon">🌐</div>
|
||||
<h3>Quick Access</h3>
|
||||
<p>Open all web links automatically with Nebula</p>
|
||||
</div>
|
||||
<div class="default-browser-status" id="default-status">
|
||||
<div class="status-icon">⏳</div>
|
||||
<p class="status-text">Checking default browser status...</p>
|
||||
</div>
|
||||
<div class="default-browser-actions">
|
||||
<button class="btn btn-large btn-primary" id="btn-set-default">
|
||||
<span class="btn-icon">✓</span>
|
||||
Set as Default Browser
|
||||
</button>
|
||||
<p class="help-text">You can always change this later in settings</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="step-actions">
|
||||
<button class="btn btn-secondary" id="btn-back-3">Back</button>
|
||||
<button class="btn btn-primary" id="btn-skip-3">Skip for Now</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 4: Complete -->
|
||||
<div class="setup-step" data-step="4">
|
||||
<div class="step-content">
|
||||
<div class="success-icon">✓</div>
|
||||
<h1 class="setup-title">All Set!</h1>
|
||||
<p class="setup-subtitle">You're ready to explore the web with Nebula</p>
|
||||
<div class="completion-summary" id="completion-summary">
|
||||
<!-- Summary will be populated dynamically -->
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="step-actions">
|
||||
<button class="btn btn-primary btn-large" id="btn-finish">Start Browsing</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="../js/setup.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user