Loading repository data…
rehan-devs / repository
drip-and-garlic
🍽️ Modern restaurant landing page with a 3D animated menu book, floating food cards, and smooth GSAP scroll-triggered animations.
#3d-animations#creative-coding#framer-motion#gsap#interactive-ui#landing-page
Live repository statistics
★ 3Stars
⑂ 0Forks
◯ 0Open issues
◉ 3Watchers
77/100
OPENREPOHUB HEALTH SIGNAL
Healthy signals
A transparent discovery signal based on current public GitHub metadata.
Recent activity35% weight
100
Community adoption25% weight
7
Maintenance state20% weight
100
License clarity10% weight
100
Project information10% weight
100
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
README preview
README.md
🧄 Drip & Garlic
A modern, animated restaurant landing page built with Next.js 15, GSAP, and Framer Motion. Features a stunning 3D menu book with scroll-triggered animations, floating food cards, and smooth page transitions.
✨ Features
- 3D Animated Menu Book - Scroll-triggered book that opens with page-turning animations
- Floating Food Cards - Menu items fly out in 3D space with parallax effects
- Smooth Loading Animation - Staggered letter animation with spring physics
- Interactive Hero Section - Dynamic dripping sauce animations
- Location Section - Embedded map with business hours
- Fully Responsive - Optimized for mobile and desktop
- Dark Theme - Elegant dark UI with orange accents
🛠️ Tech Stack
- Framework: Next.js 15 (App Router)
- Styling: Tailwind CSS 4
- Animations: GSAP + ScrollTrigger
- Transitions: Framer Motion
- Language: TypeScript
- Font: Geist Sans & Geist Mono
📁 Project Structure
drip-and-garlic/
├── app/
│ ├── globals.css # Global styles & Tailwind imports
│ ├── layout.tsx # Root layout with fonts
│ └── page.tsx # Main landing page
├── components/
│ └── ui/
│ ├── drip-hero.tsx # Hero section with drip animations
│ ├── menu-book-3d.tsx # 3D animated menu book
│ ├── item-showcase.tsx # Featured items display
│ ├── drip-location.tsx # Location & hours section
│ ├── drip-landing.tsx # Main landing wrapper
│ ├── location-map.tsx # Map component
│ └── loader.tsx # Loading screen animation
├── lib/
│ └── utils.ts # Utility functions (cn)
├── public/ # Static assets
├── .gitignore
├── next.config.ts
├── package.json
├── postcss.config.mjs
├── tailwind.config.ts
└── tsconfig.json
🚀 Getting Started
Prerequisites
- Node.js 18+
- npm, yarn, or pnpm