Add Docker configuration and website improvements

[aegntic]

This PR includes Docker configuration for both production and development environments, along with various website improvements and enhancements.

Summary by CodeRabbit

• New Features

  • Introduced a completely redesigned and animated website with advanced visual effects, interactive 3D backgrounds, smooth navigation, and responsive layouts.
  • Added exclusive access request forms, animated FAQ, and multi-step product walkthroughs.
  • Implemented Docker-based development and production deployment with unified scripts and documentation.
  • Enhanced SEO, social sharing, and mobile support.

• Improvements

  • Updated styling with luxury UI elements, glass morphism, gradients, and custom animations.
  • Improved navigation bar, footer, and section transitions.
  • Enhanced content structure and accessibility.

• Documentation

  • Added comprehensive guides for deployment, Docker usage, and website improvements.

• Bug Fixes

  • Prevented duplicate notifications and improved scroll-triggered animation handling.

• Chores

  • Added configuration files, deployment scripts, and optimized build processes.

[restack-app]

No applications have been configured for previews targeting branch: main. To do so go to restack console and configure your applications for previews.

[coderabbitai]

Caution

Review failed

Failed to post review comments.

Walkthrough

This update introduces a comprehensive redesign and deployment overhaul for the CRED-ABILITY website. The changes include a new multi-stage Docker setup, unified deployment scripts, and extensive documentation for deployment, Docker usage, and website improvements. The website itself is significantly enhanced with a new React-based architecture, advanced animations, 3D visualizations (Three.js), improved UI/UX, and a modular, responsive layout. Multiple new React components implement animated sections, forms, navigation, and particle backgrounds. Styling is overhauled with new Tailwind and CSS configurations. The build and deployment process is automated via GitHub Actions and helper scripts, supporting both development and production environments. Documentation and configuration files are added or updated throughout.

Changes

File(s) / Path(s)	Change Summary
.github/workflows/docker-build.yml	New GitHub Actions workflow to automate Docker image builds for the website on pushes/PRs to main and develop, with caching and build/test steps.
DEPLOYMENT.md, DOCKER-README.md, WEBSITE-IMPROVEMENTS.md	New documentation files: deployment guide, Docker usage/readme, and detailed website improvements overview.
docker-compose.yml, run-website.sh, website/.dockerignore, website/Dockerfile, website/nginx.conf	New Docker Compose file, unified lifecycle management script, Docker ignore patterns, multi-stage Dockerfile for conditional builds, and custom Nginx config for SPA/static asset serving.
website/CNAME	New file specifying custom domain: credability.pro.
website/IMPROVED-README.md, website/README.md	Overhauled and new README files: project overview, improved version documentation, usage, and structure.
website/deploy-improved.sh	New Bash script to build and deploy the improved website version, with temporary file swapping and restoration.
website/improved-index.html, website/improved-tailwind.config.js, website/improved-vite.config.ts	New improved HTML template, Tailwind CSS config with custom themes/animations, and Vite config with path aliases, chunking, and dev server settings.
website/index.html	Updated meta tags, favicon, resource preloading, and switched JS entry to improved main file.
website/package.json	Added deploy script (gh-pages -d dist) and gh-pages as a dev dependency.
website/src/improved-*, website/src/styles/improved-styles.css	All new improved React components: animated layout, navigation, sections (hero, problem, how-it-works, teaser, FAQ, CTA, exclusive access), 3D backgrounds, waitlist popup, and luxury UI CSS.
website/src/main.tsx	Wrapped <App /> in React Suspense with a loading fallback.
website/src/App.tsx	Refactored to use router-based structure, delegating rendering to MainLayout.
website/src/components/improved/*	All new modular, animated, and interactive components for improved site layout and sections, with advanced scroll, animation, and 3D features.
website/src/components/main-layout.tsx	Minor update: disables GSAP ScrollTrigger during programmatic navigation for smooth scroll handling.
website/src/components/navigation-bar.tsx	Modified navigation items, branding, and added new "Contact" item; updated UI for brand name.
website/src/components/notification-system.tsx	Prevents duplicate notifications; adjusts container position and z-index.
website/src/components/sections/*	Various presentational tweaks: highlights the "a" in "CRED-ABILITY" with styled spans, accelerates animation durations, and updates text for branding consistency.
website/src/pages/GetStartedPage.tsx	Replaces detailed tab content and footer with placeholders and removes footer.
website/src/services/firebase.ts, website/src/services/notificationService.ts	Updates comments to highlight the "a" in "CRED-ABILITY" for branding.
website/tailwind.config.js	Updated color palette, gradients, box shadows, and new shimmer animation/keyframes.
website/vite.config.ts	Enhanced with path aliases, chunk splitting, terser options, and updated dev server config.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Browser
    participant ReactApp
    participant Docker/Nginx
    participant Backend (optional)

    User->>Browser: Visit credability.pro
    Browser->>Docker/Nginx: HTTP request for /
    Docker/Nginx->>Browser: Serve index.html and static assets
    Browser->>ReactApp: Load and initialize
    ReactApp->>ReactApp: Render MainLayout with animated sections
    User->>ReactApp: Interact (navigate, submit forms, etc.)
    ReactApp->>Backend: (Optional) API requests via Docker network
    Backend-->>ReactApp: (Optional) API responses
    ReactApp-->>User: Animated UI updates, feedback

Loading

Poem

🐇✨
In Docker's warren, scripts now hop,
With Nginx serving at the top.
New docs and guides, the bunnies cheer,
Animated pages soon appear!
3D and gradients, scrolls that gleam,
The CRED-ABILITY site’s a dream.
Ship it, hop it, let’s deploy—
This upgrade fills the fields with joy!

✨ Finishing Touches

• 📝 Generate Docstrings

---

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

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai generate docstrings to generate docstrings for this PR.
• @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.