Jesús Pérez b6a4d77421
Some checks are pending
Documentation Lint & Validation / Markdown Linting (push) Waiting to run
Documentation Lint & Validation / Validate mdBook Configuration (push) Waiting to run
Documentation Lint & Validation / Content & Structure Validation (push) Waiting to run
Documentation Lint & Validation / Lint & Validation Summary (push) Blocked by required conditions
mdBook Build & Deploy / Build mdBook (push) Waiting to run
mdBook Build & Deploy / Documentation Quality Check (push) Blocked by required conditions
mdBook Build & Deploy / Deploy to GitHub Pages (push) Blocked by required conditions
mdBook Build & Deploy / Notification (push) Blocked by required conditions
Rust CI / Security Audit (push) Waiting to run
Rust CI / Check + Test + Lint (nightly) (push) Waiting to run
Rust CI / Check + Test + Lint (stable) (push) Waiting to run
feat: add Leptos UI library and modularize MCP server
2026-02-14 20:10:55 +00:00
..
2026-01-14 21:12:49 +00:00

Vapora Web Assets

Web-based landing page and static content for Vapora.

Directory Structure

assets/web/
├── src/
│   └── index.html        # Source HTML (readable, 26KB)
├── index.html            # Minified/Production HTML (18KB)
└── README.md             # This file

Files

src/index.html - Source Version

  • Purpose: Development and maintenance
  • Size: 26KB (uncompressed)
  • Content:
    • Full formatting and indentation
    • Inline CSS and JavaScript
    • Bilingual (English/Spanish) content
    • Language-aware dynamic switching
    • Interactive agent showcase
    • Technology stack display

Use for:

  • Editing content
  • Understanding structure
  • Version control
  • Making translations updates

index.html - Production Version

  • Purpose: Served to browsers (fast loading)
  • Size: 18KB (32% compression)
  • Optimizations:
    • Removed all comments
    • Compressed CSS (removed spaces, combined rules)
    • Minified JavaScript (single line)
    • Removed whitespace between tags
    • Preserved all functionality

Use for:

  • Production web server
  • CDN distribution
  • Browser caching
  • Fast load times

How to Use

Development

Edit src/index.html:

# Edit source file
nano assets/web/src/index.html

# Regenerate minified version (script below)

Update Minified Version

When you update src/index.html, regenerate index.html:

# Using the minification script (Perl)
perl -e '
use strict;
use warnings;

open(my $fh, "<", "assets/web/src/index.html") or die $!;
my $content = do { local $/; <$fh> };
close($fh);

# Remove comments
$content =~ s/<!--.*?-->//gs;

# Compress whitespace in style tags
$content =~ s/(<style[^>]*>)(.*?)(<\/style>)/
  my $before = $1;
  my $style = $2;
  my $after = $3;
  $style =~ s{\/\*.*?\*\/}{}gs;
  $style =~ s{\s+}{ }gs;
  $style =~ s{\s*([{}:;,>+~])\s*}{$1}gs;
  $before . $style . $after;
/gies;

# Compress whitespace in script tags
$content =~ s/(<script[^>]*>)(.*?)(<\/script>)/
  my $before = $1;
  my $script = $2;
  my $after = $3;
  $script =~ s{\/\/.*$}{}gm;
  $script =~ s{\s+}{ }gs;
  $script =~ s{\s*([{}();,])\s*}{$1}gs;
  $before . $script . $after;
/gies;

# Remove whitespace between tags
$content =~ s/>\s+</></gs;
$content =~ s/\s+/ /gs;
$content =~ s/^\s+|\s+$//g;

open(my $out, ">", "assets/web/index.html") or die $!;
print $out $content;
close($out);

print "✅ Minified version created\n";
'

Deployment

Serve index.html from your web server:


# Using Rust 
cargo install static-web-server
static-web-server -d assets/web/

# Using Python
python3 -m http.server --directory assets/web

# Using Node.js
npx http-server assets/web

# Using nginx
# Point root to assets/web/
# Serve index.html as default

Features

Responsive Design

  • Mobile-first approach
  • Flexbox layouts
  • Media queries for mobile

Performance

  • Inline CSS (no separate requests)
  • Inline JavaScript (no blocking external scripts)
  • Minimal dependencies (no frameworks)
  • 18KB minified size

Bilingual

  • English and Spanish
  • LocalStorage persistence
  • Data attributes for translations
  • Dynamic language switching

Modern CSS

  • CSS Gradients
  • Animations (fadeInUp)
  • Hover effects
  • Grid layouts

Styling

  • Vapora color scheme
  • Gradient backgrounds
  • Monospace font (JetBrains Mono)
  • Smooth transitions

Content Sections

  1. Hero - Title, tagline, logo
  2. Problems - 4 problems Vapora solves
  3. How It Works - Feature overview
  4. Technology Stack - Tech badges
  5. Available Agents - Agent showcase (12 agents)
  6. CTA - Call-to-action button
  7. Footer - Credits and links

Translations

All text content is bilingual. Edit data attributes in src/index.html:

<!-- English/Spanish example -->
<span data-en="Hello" data-es="Hola">Hello</span>

The JavaScript automatically updates based on selected language.

Maintenance

  • Source edits go in src/index.html
  • Regenerate index.html when source changes
  • Both files are versioned in git
  • Keep them in sync

Git Workflow

# Edit source
git add assets/web/src/index.html
git add assets/web/index.html
git commit -m "Update landing page content"
git push

Compression Statistics

File Size Type
src/index.html 26KB Source (readable)
index.html 18KB Production (minified)
Compression 32% Saved 8.8KB

Last Updated: 2026-01-11 Version: 1.2.0 (matches Vapora release)