Lorry Booking - Copy this React, Tailwind Component to your project
1. Header Main Title: "Find Online Lorry Booking in Bengaluru Karnataka" Source Location Field: Label: "SOURCE LOCATION" Pre filled value: "Bengaluru, Karnataka, India" Destination Location Field: Label: "DESTINATION LOCATION" Placeholder text: "Search Unloading City" Tabs: Tab 1: "Book Lorry" (selected) 2. Filter Section Filter by Labels: "Vehicle Type" "Vehicle Capacity" Filter Icons: Icon for "Vehicle Type": A truck symbol Icon for "Vehicle Capacity": A scale symbol 3. Lorry Listing Section Section Title: "Available Lorries in Bengaluru Karnataka (134)" Each lorry listing includes the following details: Lorry 1: Vehicle Type: "Open body, LCV" Vehicle Number: "KA 05 AK 7226" Vehicle Model: "TATA INTRA V30 NON AC" Verification Icon: Blue tick icon next to the vehicle number Current Location: Label: "Current Location" Value: "Bengaluru, KA" Last Updated: Label: "Last updated" Value: "1 Day Ago" Vehicle Specifications: Capacity: "3 Tonnes" Length: "10 feet" Fuel Type: "Diesel" Driver Information: Driver Name: "Raja Shekar" Driver Role: "Truck Owner / Driver" Driver Rating: "3.0" (Star rating icon) Action Button: Text: "Bid Now" Color: Blue Lorry 2: Vehicle Type: "Open body, LCV" Vehicle Number: "TN 28 AM 8993" Vehicle Model: "DOST LS BS III" Verification Icon: Blue tick icon next to the vehicle number Current Location: Label: "Current Location" Value: "Bengaluru, KA" Last Updated: Label: "Last updated" Value: "1 Day Ago" Vehicle Specifications: Capacity: "2 Tonnes" Length: "8 feet" Fuel Type: "Diesel" Driver Information: Driver Name: "Sathish S" Driver Role: "Truck Owner / Driver" Driver Rating: "No rating visible" Action Button: Text: "Bid Now" Color: Blue Lorry 3: Vehicle Type: "Open body, LCV" Vehicle Number: "KA 13 D 7776" Vehicle Model: "BOL MAXX PUP CITY 1.3" Verification Icon: Blue tick icon next to the vehicle number Current Location: Label: "Current Location" Value: "Bengaluru, KA" Last Updated: Label: "Last updated" Value: "1 Day Ago" Vehicle Specifications: Capacity: "1 Tonne" Length: "8 feet" Fuel Type: "Diesel" Driver Information: Driver Name: "Nandeesh" Driver Role: "Truck Owner / Driver" Driver Rating: "No rating visible" Action Button: Text: "Bid Now" Color: Blue 4. General Icons and Indicators Share Icon: Present on each lorry listing (beside vehicle number) Map Pin Icon: Indicates current location on each listing Fuel Type Icon: A fuel pump symbol beside the fuel type field 5. Interactive Features Bid Now Button: Present on each lorry card, clickable for bidding on that lorry Filter Buttons: Vehicle Type and Capacity filters for refining results 6. Bottom Corner Notification Icon: Bell Icon: Notification or alert symbol at the bottom right corner.
