Legacy Lands Web

Official website for Legacy Lands Studio, featuring bilingual support, smooth animations, and a sponsors system.

Quick Start

1. Clone the repository
2. Open index.html in a browser
3. No build process needed

Features

• Responsive design for all devices
• English/Chinese language support
• Dynamic particle background
• Interactive member carousel
• Auto-hiding navigation bar
• Code snippet showcases
• Mission and contact cards
• Sponsors system with tier filtering
• Dynamic search functionality

Tech Stack

• HTML5
• CSS3
• Vanilla JavaScript
• Google Code Prettify (for code highlighting)
• Google Fonts (Cinzel & Noto Serif SC)

Structure

legacy-lands-website/
├── index.html          # Main landing page
├── sponsors.html       # Sponsors page
├── base.css           # Shared base styles
├── styles.css         # Main page styles
├── sponsors.css       # Sponsors page styles
├── animation.js       # Main page animations
├── sponsors-animation.js  # Sponsors page animations
├── language.js        # Language switching system
└── assets/
    ├── avatars/       # Member & sponsor profile images
    ├── data/          # JSON data files
    └── legacy-lands-logo.png

Features Details

Landing Page

• Dynamic particle background
• Interactive member carousel
• Mission statement
• Contact information

Sponsors Page

• Tier-based filtering system
• Real-time search functionality
• Responsive sponsor cards
• Smooth loading animations
• Multi-language support for all content

Shared Features

• Bilingual support (English/Chinese)
• Auto-hiding navigation
• Smooth animations
• Responsive design