-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
1 lines (1 loc) · 14.1 KB
/
index.html
1
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1, width=device-width"><link rel="stylesheet" href="index.ca3f761c.css"><link rel="stylesheet" href="index.4dbe863c.css"><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap"><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Baloo Bhai:wght@400&display=swap"></head><body> <div class="homepage"> <header class="top-header"> <div class="top-container"> <img class="fickleflight-icon" alt src="fickleflight.03d8fb85.svg"> <div class="navigation-right"> <div class="navigation-menu"> <div class="explore">Explore</div> <div class="search">Search</div> <button class="hotels">Hotels</button> <button class="hotels">Offers</button> </div> <div class="account-section"> <img class="hamburger-menu-icon" alt src="notification.98fef4d0.svg"> <img class="notification-bell-icon" alt src="notification1.9b395d4d.svg"> <img class="avatar-icon" alt src="[email protected]"> </div> </div> </div> </header> <div class="hero-section"> <div class="search-container"> <div class="title"> <div class="hero-tagline">Let's Travel Canada</div> <div class="hero-subtext"> Find the best destinations and the most popular stays! </div> </div> <div class="search-form"> <div class="form-title-group"> <b class="search-form-label">Search flights</b> <div class="flight-options"> <div class="radio"> <div class="padding"> <img class="radiobuttonunchecked-icon" alt src="radiobuttonunchecked.b54fd988.svg"> </div> <div class="label">Return</div> </div> <div class="radio"> <div class="padding"> <img class="radiobuttonunchecked-icon" alt src="radiobuttonchecked.bec71e7f.svg"> </div> <div class="label">One-way</div> </div> </div> </div> <div class="form-inputs-row"> <div class="inputs-row"> <div class="departure-autocomplete"> <div class="input"> <button class="label-container"> <div class="departure">Departure</div> </button> <div class="active"> <div class="muiautocompletetag"> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel.f82ffb98.svg"> </div> </div> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel.f82ffb98.svg"> </div> </div> </div> <div class="singapore-sin">Singapore (SIN)</div> </div> </div> </div> <div class="arrival-autocomplete"> <div class="input"> <div class="label-container1"> <div class="arrival">Arrival</div> </div> <div class="active1"> <div class="muiautocompletetag"> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel1.6f9b2da0.svg"> </div> </div> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel1.6f9b2da0.svg"> </div> </div> </div> <div class="singapore-sin">Los Angeles (LA)</div> </div> </div> </div> <div class="departure-autocomplete"> <div class="input"> <button class="label-container"> <div class="departure">Date</div> </button> <div class="active"> <div class="muiautocompletetag"> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel2.b850b2f3.svg"> </div> </div> <div class="chip"> <div class="container"> <div class="avatar"> <div class="op">F</div> </div> <div class="typography"> <div class="chip1">Chip</div> </div> <img class="notification-bell-icon" alt src="cancel2.b850b2f3.svg"> </div> </div> </div> <div class="singapore-sin">01/05/2022</div> <img class="date-icon" alt src="date.a3f0c43f.svg"> </div> </div> </div> </div> <div class="button-group"> <button class="search-button"> <div class="search-flights">SEARCH FLIGHTS</div> </button> </div> </div> </div> </div> </div> <div class="home-contents"> <div class="upcoming-flight-section"> <b class="recent-searches">Recent Searches</b> <div class="flight-details"> <div class="recent-searches-section"> <div class="recent-search"> <div class="to-and-from"> <b class="depart-on">SIN</b> <img class="flight-icons" alt src="flight-icons.a049a564.svg"> <b class="arrival1">LAX</b> </div> <div class="departure-info"> <b class="depart-on">Depart on: </b> <div class="depart-on">7 Sep 2023</div> </div> </div> <div class="recent-search"> <div class="to-and-from"> <b class="depart-on">MY</b> <img class="flight-icons" alt src="flight-icons1.0f9b8f40.svg"> <b class="arrival1">DUB</b> </div> <div class="departure-info"> <b class="depart-on">Depart on: </b> <div class="depart-on">9 Sep 2023</div> </div> </div> </div> <div class="prepare-menu"> <div class="recent-searches">Prepare for your trip</div> <div class="trip-menu"> <button class="trip-menu-item"> <div class="icon"> <img class="icon-vector" alt src="icon.1b0f96bf.svg"> </div> <div class="text">Hotel</div> </button> <button class="trip-menu-item"> <div class="icon1"> <img class="icon-vector" alt src="icon1.75727ac6.svg"> </div> <div class="text">Attractions</div> </button> <button class="trip-menu-item"> <div class="icon2"> <img class="icon-vector" alt src="icon2.3aa4fd4d.svg"> </div> <div class="text">Eats</div> </button> <button class="trip-menu-item"> <div class="icon3"> <img class="icon-vector" alt src="icon3.6abd9ee2.svg"> </div> <div class="text">Commute</div> </button> <button class="trip-menu-item"> <div class="icon4"> <img class="icon-vector" alt src="icon4.753b0ecc.svg"> </div> <div class="text">Taxi</div> </button> <button class="trip-menu-item"> <div class="icon5"> <img class="icon-vector" alt src="icon5.f4de663e.svg"> </div> <div class="text">Movies</div> </button> </div> </div> </div> </div> <div class="pop-destinations-main"> <div class="destinations-titles"> <div class="title-container"> <b class="recent-searches">Plan your next trip</b> <b class="most-popular-destinations">Most Popular Destinations</b> </div> <button class="view-all-top"> <div class="view-all-destinations">View all destinations</div> <img class="notification-bell-icon" alt src="arrowright.345cc760.svg"> </button> </div> <div class="pop-destination-items"> <button class="popular-destination-card"> <div class="pariscard"> <div class="destination-details"> <b class="destination">Paris</b> <div class="details"> <div class="from">from</div> <div class="price">$699</div> </div> </div> </div> </button> <button class="popular-destination-card"> <div class="greececard"> <div class="destination-details"> <b class="destination">Greece</b> <div class="details"> <div class="from">from</div> <div class="price">$1079</div> </div> </div> </div> </button> <button class="popular-destination-card"> <div class="norwaycard"> <div class="destination-details"> <b class="destination">Norway</b> <div class="details"> <div class="from">from</div> <div class="price">$895</div> </div> </div> </div> </button> <button class="popular-destination-card"> <div class="tuscanycard"> <div class="destination-details"> <b class="destination">Tuscany</b> <div class="details"> <div class="from">from</div> <div class="price">$1245</div> </div> </div> </div> </button> </div> <div class="view-all-bottom"> <div class="view-all-destinations1">View all destinations</div> <img class="notification-bell-icon" alt src="arrowright.345cc760.svg"> </div> </div> <div class="recommended-holidays-container"> <div class="rec-holidays-title"> <b class="recommended-holidays">Recommended Holidays</b> <button class="view-all-top"> <div class="view-all-destinations">View all holidays</div> <img class="notification-bell-icon" alt src="arrowright1.e3ba5ecc.svg"> </button> </div> <div class="rec-cards-container"> <button class="recommended-holiday-card"> <img class="image-icon" alt src="[email protected]"> <div class="holiday-details"> <div class="rec-holidays-title"> <div class="destination-parent"> <div class="swiss">Bali</div> <div class="duration">4D3N</div> </div> <div class="price4">$899</div> </div> </div> </button> <button class="recommended-holiday-card"> <img class="image-icon" alt src="[email protected]"> <div class="holiday-details"> <div class="rec-holidays-title"> <div class="destination-parent"> <div class="swiss">Swiss</div> <div class="duration">6D5N</div> </div> <div class="price4">$900</div> </div> </div> </button> <button class="recommended-holiday-card2"> <img class="image-icon" alt src="[email protected]"> <div class="holiday-details"> <div class="rec-holidays-title"> <div class="destination-parent"> <div class="swiss">Boracay</div> <div class="duration">5D4N</div> </div> <div class="price4">$699</div> </div> </div> </button> <button class="recommended-holiday-card3"> <img class="image-icon" alt src="[email protected]"> <div class="holiday-details"> <div class="rec-holidays-title"> <div class="destination-parent"> <div class="swiss">Palawan</div> <div class="duration">4D3N</div> </div> <div class="price4">$789</div> </div> </div> </button> </div> <div class="view-holidays-bottom"> <div class="view-all-destinations1">View all holidays</div> <img class="notification-bell-icon" alt src="arrowright.345cc760.svg"> </div> </div> <div class="popular-stays"> <div class="popular-stays-header"> <b class="popular-stays1">Popular Stays</b> <button class="view-all-top"> <div class="view-all-destinations">View all stays</div> <img class="notification-bell-icon" alt src="arrowright1.e3ba5ecc.svg"> </button> </div> <div class="hotel-cards"> <div class="popular-hotel-card"> <div class="hotel-card"> <img class="image-icon1" alt src="[email protected]"> <div class="stay-details"> <div class="stay-details-rows"> <div class="type">Entire bungalow</div> <div class="title1">Matterhorn Suites</div> <div class="price5">$575/night</div> </div> <button class="video"> <img class="video-icon" alt src="video-icon.ce3033ff.svg"> </button> </div> <div class="rating"> <div class="stars"> <img class="staricon" alt src="staricon.edece1ca.svg"> <div class="rating1">4.9</div> </div> <div class="reviews">(60 reviews)</div> </div> <button class="more-details-button"> <div class="button">More details</div> </button> </div> </div> <div class="popular-hotel-card"> <div class="hotel-card"> <img class="image-icon1" alt src="[email protected]"> <div class="stay-details"> <div class="stay-details-rows"> <div class="type">2-Story beachfront suite</div> <div class="title1">Discovery Shores</div> <div class="price5">$360/night</div> </div> <button class="video"> <img class="video-icon" alt src="video-icon1.ce3033ff.svg"> </button> </div> <div class="rating"> <div class="stars"> <img class="staricon" alt src="staricon.edece1ca.svg"> <div class="rating1">4.8</div> </div> <div class="reviews">(116 reviews)</div> </div> <button class="more-details-button"> <div class="button">More details</div> </button> </div> </div> <div class="popular-hotel-card"> <div class="hotel-card"> <img class="image-icon1" alt src="[email protected]"> <div class="stay-details"> <div class="stay-details-rows"> <div class="type">Single deluxe hut</div> <div class="title1">Arctic Hut</div> <div class="price5">$420/night</div> </div> <button class="video"> <img class="video-icon" alt src="video-icon.ce3033ff.svg"> </button> </div> <div class="rating"> <div class="stars"> <img class="staricon" alt src="staricon.edece1ca.svg"> <div class="rating1">4.7</div> </div> <div class="reviews">(78 reviews)</div> </div> <button class="more-details-button"> <div class="button">More details</div> </button> </div> </div> <div class="popular-hotel-card3"> <div class="hotel-card"> <img class="image-icon1" alt src="[email protected]"> <div class="stay-details"> <div class="stay-details-rows"> <div class="type">Deluxe King Room</div> <div class="title1">Lake Louise Inn</div> <div class="price5">$244/night</div> </div> <button class="video"> <img class="video-icon" alt src="video-icon2.ae3e0fcd.svg"> </button> </div> <div class="rating"> <div class="stars"> <img class="staricon" alt src="staricon.edece1ca.svg"> <div class="rating1">4.6</div> </div> <div class="reviews">(63 reviews)</div> </div> <button class="more-details-button"> <div class="button">More details</div> </button> </div> </div> </div> <div class="mobile-view-all-stays"> <div class="view-all-destinations1">View all stays</div> <img class="notification-bell-icon" alt src="arrowright.345cc760.svg"> </div> </div> </div> <div class="footer-section"> <img class="subscribe-section-icon" alt src="[email protected]"> <footer class="footer"> <div class="fickleflight-bio"> <img class="logo-icon" alt src="logo.0f77101c.svg"> <div class="fickle-flight-description"> Fickle Flight is your one-stop travel portal. We offer hassle free flight and hotel bookings. We also have all your needs in you online shop. </div> <div class="social-icons"> <img class="facebook-icon" alt src="entyposocialfacebookwithcircle.1cd5f958.svg"> <img class="facebook-icon" alt src="entyposocialinstagramwithcircle.0705e66b.svg"> <img class="facebook-icon" alt src="entyposocialtwitterwithcircle.de410f96.svg"> </div> </div> <div class="seperator"></div> <div class="footer-links"> <div class="company-section"> <div class="company">Company</div> <div class="company-links"> <div class="explore">About Us</div> <div class="explore">News</div> <div class="explore">Careers</div> <div class="how-we-work">How we work</div> </div> </div> <div class="company-section"> <div class="company">Support</div> <div class="company-links"> <div class="explore">Account</div> <div class="how-we-work">Support Center</div> <div class="explore">FAQ</div> <div class="explore">Accessibility</div> </div> </div> <div class="more-section"> <div class="company">More</div> <div class="company-links"> <div class="explore">Covid Advisory</div> <div class="explore">Airline Fees</div> <div class="explore">Tips</div> <div class="how-we-work">Quarantine Rules</div> </div> </div> </div> </footer> </div> </div> </body></html>