|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>LionShare Capital - Revolutionary Reverse Auction Marketplace</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap'); |
|
|
|
|
|
:root { |
|
|
--primary: #4F46E5; |
|
|
--secondary: #10B981; |
|
|
--dark: #1F2937; |
|
|
--light: #F3F4F6; |
|
|
} |
|
|
|
|
|
body { |
|
|
font-family: 'Poppins', sans-serif; |
|
|
background-color: var(--light); |
|
|
} |
|
|
|
|
|
.gradient-bg { |
|
|
background: linear-gradient(135deg, var(--primary) 0%, #7C3AED 100%); |
|
|
} |
|
|
|
|
|
.hero-pattern { |
|
|
background-image: radial-gradient(rgba(255,255,255,0.1) 2px, transparent 2px); |
|
|
background-size: 30px 30px; |
|
|
} |
|
|
|
|
|
.card-hover-effect { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.card-hover-effect:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); |
|
|
} |
|
|
|
|
|
.auction-card { |
|
|
border-left: 4px solid var(--primary); |
|
|
} |
|
|
|
|
|
.feature-icon { |
|
|
width: 60px; |
|
|
height: 60px; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
border-radius: 12px; |
|
|
background-color: rgba(79, 70, 229, 0.1); |
|
|
} |
|
|
|
|
|
.countdown-timer { |
|
|
font-family: monospace; |
|
|
} |
|
|
|
|
|
.floating-animation { |
|
|
animation: float 6s ease-in-out infinite; |
|
|
} |
|
|
|
|
|
@keyframes float { |
|
|
0% { transform: translateY(0px); } |
|
|
50% { transform: translateY(-15px); } |
|
|
100% { transform: translateY(0px); } |
|
|
} |
|
|
|
|
|
.wave-shape { |
|
|
position: absolute; |
|
|
bottom: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
overflow: hidden; |
|
|
line-height: 0; |
|
|
} |
|
|
|
|
|
.wave-shape svg { |
|
|
position: relative; |
|
|
display: block; |
|
|
width: calc(100% + 1.3px); |
|
|
height: 150px; |
|
|
} |
|
|
|
|
|
.wave-shape .shape-fill { |
|
|
fill: #FFFFFF; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<nav class="bg-white shadow-sm fixed w-full z-10"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="flex justify-between h-16"> |
|
|
<div class="flex items-center"> |
|
|
<div class="flex-shrink-0 flex items-center"> |
|
|
<i class="fas fa-lion text-2xl text-indigo-600 mr-2"></i> |
|
|
<span class="text-xl font-bold text-gray-900">LionShare Capital</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="hidden md:ml-6 md:flex md:items-center md:space-x-8"> |
|
|
<a href="#features" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">Features</a> |
|
|
<a href="#how-it-works" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">How It Works</a> |
|
|
<a href="#testimonials" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">Testimonials</a> |
|
|
<a href="#pricing" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">Pricing</a> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<button class="bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-md text-sm font-medium"> |
|
|
Get Started |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
|
|
|
<div class="relative gradient-bg hero-pattern pt-24 pb-32"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="lg:grid lg:grid-cols-12 lg:gap-8"> |
|
|
<div class="sm:text-center md:max-w-2xl md:mx-auto lg:col-span-6 lg:text-left lg:flex lg:items-center"> |
|
|
<div> |
|
|
<h1 class="mt-4 text-4xl tracking-tight font-extrabold text-white sm:mt-5 sm:text-5xl lg:mt-6 lg:text-6xl"> |
|
|
Revolutionizing Commerce with <span class="text-yellow-300">Reverse Auctions</span> |
|
|
</h1> |
|
|
<p class="mt-3 text-base text-indigo-100 sm:mt-5 sm:text-lg sm:max-w-xl sm:mx-auto md:mt-5 md:text-xl lg:mx-0"> |
|
|
The future of online marketplaces is here. Let businesses compete for YOUR business and save up to 60% on services. |
|
|
</p> |
|
|
<div class="mt-8 sm:max-w-lg sm:mx-auto sm:text-center lg:text-left lg:mx-0"> |
|
|
<div class="flex flex-col sm:flex-row gap-3"> |
|
|
<input type="email" id="hero-email" class="flex-1 min-w-0 px-4 py-3 rounded-md border border-transparent text-base focus:outline-none focus:ring-2 focus:ring-white focus:border-transparent" placeholder="Enter your email"> |
|
|
<button class="px-6 py-3 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-yellow-400 hover:bg-yellow-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-400"> |
|
|
Join Beta |
|
|
</button> |
|
|
</div> |
|
|
<p class="mt-3 text-sm text-indigo-100"> |
|
|
Get early access to our revolutionary platform. No credit card required. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-12 relative sm:max-w-lg sm:mx-auto lg:mt-0 lg:max-w-none lg:mx-0 lg:col-span-6 lg:flex lg:items-center"> |
|
|
<div class="relative mx-auto w-full rounded-lg shadow-lg lg:max-w-md"> |
|
|
<div class="relative w-full bg-white rounded-lg overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-indigo-600 opacity-20"></div> |
|
|
<img class="w-full h-auto floating-animation" src="https://images.unsplash.com/photo-1556740738-b6a63e27c4df?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Marketplace illustration"> |
|
|
</div> |
|
|
<div class="absolute -bottom-8 -right-8 bg-white p-4 rounded-lg shadow-xl"> |
|
|
<div class="flex items-center"> |
|
|
<div class="bg-indigo-100 p-3 rounded-full"> |
|
|
<i class="fas fa-gavel text-indigo-600 text-xl"></i> |
|
|
</div> |
|
|
<div class="ml-3"> |
|
|
<p class="text-sm font-medium text-gray-900">Live Auction</p> |
|
|
<p class="text-xs text-gray-500">Ends in <span class="countdown-timer font-bold">12:34:56</span></p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="wave-shape"> |
|
|
<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none"> |
|
|
<path d="M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z" class="shape-fill"></path> |
|
|
</svg> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="features" class="py-16 bg-white"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="lg:text-center"> |
|
|
<h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Features</h2> |
|
|
<p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl"> |
|
|
A better way to do business |
|
|
</p> |
|
|
<p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto"> |
|
|
LionShare Capital combines cutting-edge technology with consumer-first principles to create a revolutionary marketplace. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="mt-20"> |
|
|
<div class="grid grid-cols-1 gap-12 md:grid-cols-2 lg:grid-cols-3"> |
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-arrows-alt-v text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">Reverse Auction Model</h3> |
|
|
<p class="text-gray-500"> |
|
|
Service providers compete to offer you the best price, driving costs down while maintaining quality standards. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-user-shield text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">Privacy Protection</h3> |
|
|
<p class="text-gray-500"> |
|
|
Your contact information remains confidential until you choose to reveal it to the winning bidder. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-bolt text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">One-Click Ordering</h3> |
|
|
<p class="text-gray-500"> |
|
|
Simplified purchasing process reduces friction and gets you the service you need faster. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-star-half-alt text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">Quality Assurance</h3> |
|
|
<p class="text-gray-500"> |
|
|
Verified providers with customer ratings ensure you get quality service at competitive prices. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-chart-line text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">Real-Time Analytics</h3> |
|
|
<p class="text-gray-500"> |
|
|
Track bidding patterns and market trends to make informed purchasing decisions. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover-effect bg-white p-8 rounded-xl shadow-md"> |
|
|
<div class="feature-icon text-indigo-600 mb-6"> |
|
|
<i class="fas fa-lock text-2xl"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">Secure Transactions</h3> |
|
|
<p class="text-gray-500"> |
|
|
End-to-end encryption and secure payment processing protect your financial information. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="how-it-works" class="py-16 bg-gray-50"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="lg:text-center mb-16"> |
|
|
<h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Process</h2> |
|
|
<p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl"> |
|
|
How LionShare Works |
|
|
</p> |
|
|
<p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto"> |
|
|
Our revolutionary platform makes saving money on services simple and secure. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="relative"> |
|
|
|
|
|
<div class="hidden md:block absolute top-0 left-1/2 transform -translate-x-1/2 h-full w-0.5 bg-indigo-200"></div> |
|
|
|
|
|
|
|
|
<div class="relative mb-16 md:flex md:items-center md:group"> |
|
|
<div class="md:w-1/2 md:pr-12 md:text-right"> |
|
|
<h3 class="text-lg font-medium text-indigo-600 mb-2">Step 1</h3> |
|
|
<h4 class="text-2xl font-bold text-gray-900 mb-3">Describe Your Need</h4> |
|
|
<p class="text-gray-600"> |
|
|
Simply tell us what service you're looking for. Be as detailed or as general as you like - our system will match you with the right providers. |
|
|
</p> |
|
|
</div> |
|
|
<div class="mt-8 md:mt-0 md:w-1/2 md:pl-12"> |
|
|
<div class="relative bg-white p-6 rounded-lg shadow-lg card-hover-effect"> |
|
|
<div class="absolute -left-2 top-1/2 transform -translate-y-1/2 w-4 h-4 rounded-full bg-indigo-600 border-4 border-white md:left-1/2 md:-translate-x-1/2"></div> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="bg-indigo-100 p-3 rounded-full mr-4"> |
|
|
<i class="fas fa-edit text-indigo-600"></i> |
|
|
</div> |
|
|
<h5 class="font-bold text-gray-800">Service Request Form</h5> |
|
|
</div> |
|
|
<div class="bg-gray-50 p-4 rounded-md"> |
|
|
<div class="mb-3"> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">Service Type</label> |
|
|
<select class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"> |
|
|
<option>Home Cleaning</option> |
|
|
<option>Plumbing</option> |
|
|
<option>Electrical</option> |
|
|
<option>Landscaping</option> |
|
|
</select> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">Details</label> |
|
|
<textarea class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" rows="2" placeholder="Describe what you need..."></textarea> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="relative mb-16 md:flex md:items-center md:group"> |
|
|
<div class="md:w-1/2 md:order-last md:pl-12"> |
|
|
<h3 class="text-lg font-medium text-indigo-600 mb-2">Step 2</h3> |
|
|
<h4 class="text-2xl font-bold text-gray-900 mb-3">Providers Compete</h4> |
|
|
<p class="text-gray-600"> |
|
|
Qualified service providers place bids to win your business. Watch as prices drop in real-time while maintaining quality standards. |
|
|
</p> |
|
|
</div> |
|
|
<div class="mt-8 md:mt-0 md:w-1/2 md:pr-12 md:order-first"> |
|
|
<div class="relative bg-white p-6 rounded-lg shadow-lg card-hover-effect"> |
|
|
<div class="absolute -left-2 top-1/2 transform -translate-y-1/2 w-4 h-4 rounded-full bg-indigo-600 border-4 border-white md:left-1/2 md:-translate-x-1/2"></div> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="bg-indigo-100 p-3 rounded-full mr-4"> |
|
|
<i class="fas fa-users text-indigo-600"></i> |
|
|
</div> |
|
|
<h5 class="font-bold text-gray-800">Live Auction Dashboard</h5> |
|
|
</div> |
|
|
<div class="space-y-4"> |
|
|
<div class="auction-card bg-gray-50 p-3 rounded-md"> |
|
|
<div class="flex justify-between items-center"> |
|
|
<div> |
|
|
<p class="font-medium">Sparkle Clean Co.</p> |
|
|
<p class="text-sm text-gray-500">4.8 ★ (124 reviews)</p> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<p class="font-bold text-indigo-600">$89</p> |
|
|
<p class="text-xs text-gray-500">Bid placed 2m ago</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="auction-card bg-gray-50 p-3 rounded-md"> |
|
|
<div class="flex justify-between items-center"> |
|
|
<div> |
|
|
<p class="font-medium">Fresh Home Services</p> |
|
|
<p class="text-sm text-gray-500">4.7 ★ (89 reviews)</p> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<p class="font-bold text-indigo-600">$79</p> |
|
|
<p class="text-xs text-gray-500">Bid placed 1m ago</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="auction-card bg-gray-50 p-3 rounded-md"> |
|
|
<div class="flex justify-between items-center"> |
|
|
<div> |
|
|
<p class="font-medium">MaidPro Express</p> |
|
|
<p class="text-sm text-gray-500">4.9 ★ (201 reviews)</p> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<p class="font-bold text-indigo-600">$69</p> |
|
|
<p class="text-xs text-gray-500">Bid placed 30s ago</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="relative md:flex md:items-center md:group"> |
|
|
<div class="md:w-1/2 md:pr-12 md:text-right"> |
|
|
<h3 class="text-lg font-medium text-indigo-600 mb-2">Step 3</h3> |
|
|
<h4 class="text-2xl font-bold text-gray-900 mb-3">Select & Save</h4> |
|
|
<p class="text-gray-600"> |
|
|
Choose the offer that works best for you. Enjoy significant savings while getting quality service from vetted professionals. |
|
|
</p> |
|
|
</div> |
|
|
<div class="mt-8 md:mt-0 md:w-1/2 md:pl-12"> |
|
|
<div class="relative bg-white p-6 rounded-lg shadow-lg card-hover-effect"> |
|
|
<div class="absolute -left-2 top-1/2 transform -translate-y-1/2 w-4 h-4 rounded-full bg-indigo-600 border-4 border-white md:left-1/2 md:-translate-x-1/2"></div> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="bg-indigo-100 p-3 rounded-full mr-4"> |
|
|
<i class="fas fa-check-circle text-indigo-600"></i> |
|
|
</div> |
|
|
<h5 class="font-bold text-gray-800">Confirmation & Scheduling</h5> |
|
|
</div> |
|
|
<div class="bg-gray-50 p-4 rounded-md"> |
|
|
<div class="flex justify-between items-center mb-4"> |
|
|
<div> |
|
|
<p class="font-medium">You've selected:</p> |
|
|
<p class="text-indigo-600 font-bold">MaidPro Express</p> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<p class="text-2xl font-bold text-green-600">$69</p> |
|
|
<p class="text-xs text-gray-500">You saved $20</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">Preferred Date</label> |
|
|
<input type="date" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"> |
|
|
</div> |
|
|
<button class="w-full bg-indigo-600 hover:bg-indigo-700 text-white py-2 px-4 rounded-md font-medium"> |
|
|
Confirm Booking |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="py-16 bg-indigo-700 text-white"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="lg:flex lg:items-center lg:justify-between"> |
|
|
<div class="lg:w-1/2"> |
|
|
<h2 class="text-3xl font-extrabold tracking-tight sm:text-4xl"> |
|
|
<span class="block">Experience the Power of</span> |
|
|
<span class="block text-yellow-300">Live Reverse Auctions</span> |
|
|
</h2> |
|
|
<p class="mt-4 text-lg text-indigo-100"> |
|
|
Watch as qualified providers compete in real-time to offer you the best price for your requested service. |
|
|
</p> |
|
|
<div class="mt-8"> |
|
|
<div class="inline-flex rounded-md shadow"> |
|
|
<a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50"> |
|
|
Start Your Auction Now |
|
|
<i class="fas fa-arrow-right ml-2"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-12 lg:mt-0 lg:w-1/2 lg:pl-12"> |
|
|
<div class="bg-white rounded-lg shadow-xl overflow-hidden"> |
|
|
<div class="bg-indigo-800 px-4 py-3 flex justify-between items-center"> |
|
|
<div class="flex items-center"> |
|
|
<div class="bg-indigo-600 p-2 rounded-full mr-3"> |
|
|
<i class="fas fa-bolt text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="text-sm font-medium text-indigo-100">Live Auction in Progress</p> |
|
|
<p class="text-xs text-indigo-300">Ends in <span class="countdown-timer font-bold">08:45:23</span></p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<span class="h-2 w-2 rounded-full bg-green-400 mr-1"></span> |
|
|
<span class="text-xs text-indigo-100">12 bidders active</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="px-4 py-5 sm:p-6"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-lg font-medium text-gray-900">Home Cleaning Service</h3> |
|
|
<p class="text-sm text-gray-500">2 bedroom apartment, 1 bathroom, kitchen, living room</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-3 mb-6"> |
|
|
|
|
|
<div class="flex justify-between items-center p-3 bg-indigo-50 rounded-lg"> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-8 h-8 rounded-full bg-indigo-100 flex items-center justify-center mr-3"> |
|
|
<span class="text-xs font-bold text-indigo-600">MP</span> |
|
|
</div> |
|
|
<div> |
|
|
<p class="text-sm font-medium text-gray-900">MaidPro Express</p> |
|
|
<div class="flex items-center"> |
|
|
<i class="fas fa-star text-yellow-400 text-xs mr-1"></i> |
|
|
<span class="text-xs text-gray-500">4.9 (201 reviews)</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<p class="text-lg font-bold text-indigo-600">$69</p> |
|
|
<p class="text-xs text-gray-500">Latest bid</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
</html> |
