Amahra Realtor - Real Estate Website

A modern, responsive real estate website for Amahra Realtor, serving Jos and Abuja with verified property listings.

Features

• Responsive Design: Fully responsive layout that works perfectly on all devices
• Property Listings: Browse houses, land, and commercial properties
• Advanced Filtering: Filter by location, property type, and price
• Property Details: Detailed view with image gallery and specifications
• Contact Integration: Direct WhatsApp and phone contact options
• Modern UI/UX: Clean, professional design with smooth animations
• Mobile-First: Optimized for mobile users with hamburger menu
• Trust Indicators: Verified listings, fast response, and trusted agent badges

Technology Stack

• HTML5: Semantic markup for accessibility
• Tailwind CSS: Utility-first CSS framework for styling
• Vanilla JavaScript: Interactive functionality without frameworks
• Alpine.js: Lightweight reactive components for mobile menu
• Font Awesome: Professional icons throughout the site

Project Structure

amahra_realtor/
├── index.html          # Main landing page
├── styles.css          # Custom CSS styles and animations
├── script.js           # JavaScript functionality
├── README.md           # Project documentation
└── assets/             # Static assets (if needed)

Key Features

1. Landing Page

• Hero section with compelling headline
• Trust badges and indicators
• Call-to-action buttons
• Smooth scrolling navigation

2. Property Listings

• Grid layout with responsive cards
• Property images and details
• Filter system for location, type, and price
• Hover effects and transitions

3. Property Details Modal

• Image gallery with navigation
• Complete property specifications
• Direct WhatsApp and phone contact buttons
• Price and status information

4. Contact Section

• Contact form with validation
• Business hours display
• Contact information
• Form submission feedback

5. WhatsApp Integration

• Floating WhatsApp button
• Pre-filled message templates
• Direct contact integration

Getting Started

1. Clone or download the project files
2. Open index.html in your web browser
3. No installation required - everything works out of the box

Customization

Adding New Properties

Edit the properties array in script.js:

{
    id: 10,
    title: "Your Property Title",
    location: "Jos", // or "Abuja"
    type: "House", // or "Land", "Shop"
    price: 15000000,
    status: "For Sale", // or "For Rent"
    image: "your-image-url.jpg",
    description: "Property description...",
    bedrooms: 3,
    bathrooms: 2,
    parking: 2,
    area: "150 sqm",
    featured: true // or false
}

Changing Contact Information

Update the phone number in multiple places:

• WhatsApp link in index.html (floating button)
• Contact section in index.html
• WhatsApp links in script.js

Customizing Colors

Modify the Tailwind CSS classes in index.html or add custom colors to styles.css.

Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)
• Mobile browsers (iOS Safari, Chrome Mobile)

Performance Features

• Lazy loading for images
• Optimized animations
• Minimal JavaScript footprint
• Efficient CSS with Tailwind utilities
• Smooth scrolling and transitions

Contact Information

• Phone: 08161329241
• WhatsApp: Direct integration available
• Email: info@amahrarealtor.com
• Service Areas: Jos & Abuja

Future Enhancements

• Property image upload system
• Advanced search with map integration
• User accounts and saved properties
• Email notification system
• Property comparison tool
• Virtual tour integration
• Mortgage calculator
• Backend API integration

License

This project is proprietary to Amahra Realtor. All rights reserved.

---

Built with ❤️ for Amahra Realtor