🐕 TinDog

A playful and modern landing page for TinDog - the Tinder for dogs! This is a responsive single-page website built with HTML, CSS, and Bootstrap that showcases a fun dating app concept for our furry friends.

📋 Table of Contents

• Features
• Technologies Used
• Project Structure
• Getting Started
• Usage
• Sections
• Responsive Design
• Contributing
• License

✨ Features

• Modern UI/UX: Clean and attractive design with smooth user experience
• Fully Responsive: Works seamlessly on desktop, tablet, and mobile devices
• Bootstrap Integration: Built with Bootstrap 5 for rapid development
• Interactive Components: Carousel testimonials, pricing cards, and call-to-action sections
• Font Awesome Icons: Beautiful icons throughout the interface
• Custom Styling: Custom CSS with modern color scheme and typography

🛠 Technologies Used

• HTML5: Semantic markup structure
• CSS3: Custom styling and responsive design
• Bootstrap 5.1.3: Frontend framework for responsive layout
• Font Awesome: Icon library for visual elements
• Google Fonts: Montserrat and Ubuntu font families

📁 Project Structure

TinDog/
├── index.html          # Main HTML file
├── css/
│   └── styles.css      # Custom CSS styles
├── images/             # Image assets
│   ├── dog-img.jpg
│   ├── lady-img.jpg
│   ├── iphone6.png
│   └── [press logos]
└── README.md           # Project documentation

🚀 Getting Started

Prerequisites

No build tools or dependencies required! Just a modern web browser.

Installation

1. Clone the repository:

git clone https://github.com/yourusername/TinDog.git

2. Navigate to the project directory:

cd TinDog

3. Open index.html in your web browser:

# On macOS
open index.html

# On Windows
start index.html

# On Linux
xdg-open index.html

Or simply double-click the index.html file in your file explorer.

💻 Usage

This is a static website that can be:

• Opened directly in any modern web browser
• Hosted on any static web hosting service (GitHub Pages, Netlify, Vercel, etc.)
• Served using a local web server

Local Development Server (Optional)

If you want to use a local server:

# Using Python 3
python3 -m http.server 8000

# Using Node.js (if you have http-server installed)
npx http-server

# Using PHP
php -S localhost:8000

Then open http://localhost:8000 in your browser.

📄 Sections

The website includes the following sections:

1. Title Section: Hero section with navigation bar and main call-to-action
2. Features Section: Three key features with icons
3. Testimonials Section: Carousel with customer testimonials
4. Press Section: Logos of featured press outlets
5. Pricing Section: Three pricing tiers (Chihuahua, Labrador, Mastiff)
6. Call-to-Action Section: Final conversion section
7. Footer: Social media links and copyright

📱 Responsive Design

The website is fully responsive with media queries for:

• Desktop (default)
• Tablets (max-width: 991px)
• Mobile devices (max-width: 860px)

Key responsive features:

• Navigation collapses into hamburger menu on mobile
• Title image adjusts position and size on smaller screens
• Pricing cards stack vertically on mobile
• Text sizes and padding adjust for optimal viewing

🎨 Design Highlights

• Color Scheme:
  • Primary: #ff4c68 (Pink/Red)
  • Secondary: #ef8172 (Coral)
  • Text: #8f8f8f (Gray)
• Typography: Montserrat (headings) and Ubuntu (brand)
• Icons: Font Awesome for consistent iconography

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is open source and available under the MIT License.

🙏 Acknowledgments

• Bootstrap team for the amazing framework
• Font Awesome for the icon library
• Google Fonts for typography
• Inspired by the Tinder app design

---

Made with ❤️ for dogs and their humans