feat: Add beautiful responsive landing page

[upendra512]

Description

Fixes Issue #28 - Application does not have a landing page

Implemented a comprehensive, professional landing page that serves as the first point of contact for SmartNotes visitors.

What's Included

Sections

• Hero Section: Eye-catching introduction with SmartNotes branding, value proposition, and key stats (100% Offline, AI Powered, Open Source)
• Features Showcase: 6 beautifully designed feature cards highlighting core capabilities:
  • AI-Powered Search (semantic understanding)
  • Offline First (local processing)
  • Knowledge Graphs (visual connections)
  • Rich Text Editor (markdown support)
  • Secure Vault (encrypted storage)
  • Lightning Fast (instant search)
• About Section: Explains the privacy-first philosophy and why SmartNotes is different from cloud-based alternatives
• Development Roadmap: Visual roadmap showing 4 phases of development with current status
• Call-to-Action: Multiple CTAs for downloading, starring GitHub, joining Discord, and contributing
• Footer: Complete footer with quick links, resources, social media, and AOSSIE branding

Design Features

• Fully Responsive: Mobile-first design that looks great on all devices
• Modern UI: TailwindCSS with custom configurations for AOSSIE brand colors
• Smooth Animations: Fade-in effects and smooth scroll navigation
• Interactive Elements: Hover effects on cards and buttons for better UX
• Professional Typography: Inter font family for clean, modern look
• AOSSIE Branding: Uses official logos and brand colors (#228B22 primary, #FFC517 secondary)

Technical Details

• Single-file HTML with embedded CSS and minimal JavaScript
• TailwindCSS via CDN for fast loading and no build step needed
• Semantic HTML5 for accessibility and SEO
• Smooth scroll behavior for anchor links
• Optimized for performance (24KB total)

Preview

The landing page includes:

• Navigation bar with links to sections and GitHub
• Gradient hero with logo and compelling headline
• Grid-based features section with hover effects
• Two-column about section with tech stack highlight
• Phase-based roadmap with status indicators
• Prominent CTA section encouraging community participation
• Comprehensive footer with all important links

Testing

• Tested on desktop (Chrome, Firefox, Edge)
• Tested responsive design on mobile viewports
• Verified all internal anchor links work correctly
• Confirmed all external links point to correct destinations
• Validated HTML structure and accessibility

Future Enhancements

This landing page can be enhanced with:

• Screenshots/demo video in the features section
• Interactive knowledge graph visualization
• Download counter showing community adoption
• Blog/news section for updates
• Language switcher for internationalization

Related Issue

Closes #28

[coderabbitai]

Warning

Rate limit exceeded

@upendra512 has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 16 minutes and 6 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 48d8f308-fa0d-45e9-8be4-a696c5536fc0

📥 Commits

Reviewing files that changed from the base of the PR and between 4bb58bd and 7607450.

📒 Files selected for processing (1)

• index.html

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}