index.html | searchcode

/index.html

https://gitlab.com/priyesh25/sia-app-project
HTML | 357 lines | 300 code | 37 blank | 20 comment | 0 complexity | 550cd682e3b6f941364e969fab1237dc MD5 | raw file

<!DOCTYPE HTML>
<html>
<head>
<title>SIA: iBuddy</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
@font-face {
	font-family: 'baker-signet-web';
	src: url('images/font.woff') format('woff2'), /* Modern Browsers */
}

@font-face {
	font-family: 'Baker';
	src: url('images/font.woff') format('woff2'), /* Modern Browsers */
}
</style>
<meta name="keywords"
	content="Metro Tiles UI Kit Iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.js" type="text/javascript"></script>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="js/Chart.js"></script>
<script type="text/javascript" src="js/history.js"></script>
<script type="text/javascript" src="js/jquery.openCarousel.js"></script>
<script src="js/star-rating.js"></script>
<script src="js/jquery.easydropdown.js"></script>
<script type="text/javascript" src="js/jquery.easing.js"></script>
<script type="text/javascript" src="js/jquery.ulslide.js"></script>
<script src="js/easyResponsiveTabs.js" type="text/javascript"></script>
<!----Calender -------->
<link rel="stylesheet" href="css/clndr.css" type="text/css" />
<script src="js/underscore-min.js" type="text/javascript"></script>
<script src="js/moment-2.2.1.js" type="text/javascript"></script>
<script src="js/clndr.js" type="text/javascript"></script>
<script src="js/site.js" type="text/javascript"></script>
<!---- Slider ------>
<link rel="stylesheet" href="css/slider.css" type="text/css" />
<script type="text/javascript" src="js/jquery.cslider.js"></script>
<script type="text/javascript" src="js/modernizr.custom.28468.js"></script>
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
<link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
<style>
#login, #flight, #hotel, #reminder, #pay, #connected {
	display: none;
}
</style>
</head>
<body>

	<script>
		$(document).ready(function() {

			History.Adapter.bind(window, 'statechange', function() {
				var State = History.getState();
				console.log(State);
				console.log($('.view'));
				$('.view').slideUp();
				$('#' + State.title).slideDown();
			});

			History.pushState({}, "connect", "?connect");

			$('.wrap').css('height', $('.wrap').css('height'));
			$(document).on('click', '#connect', function() {
				History.pushState({}, "login", "?login");
			});
			$(document).on('click', '#login_button', function() {
				History.pushState({}, "connected", "?connected");
			});
			$(document).on('click', '#connected', function() {
				History.pushState({}, "flight", "?flight");
			});
			$(document).on('click', '#flight', function() {
				History.pushState({}, "hotel", "?hotel");
			});
			$(document).on('click', '#hotel', function() {
				History.pushState({}, "pay", "?pay");
			});
			$(document).on('click', '#pay', function() {
				History.pushState({}, "reminder", "?reminder");
			});
		});
	</script>
	<!---start-wrap---->
	<div class="wrap">

		<!--- HEADER STARTS	 ---->

		<div class="clear"></div>
		<div style="height: 10px"></div>
		<div class="header-left" style="display:">
			<div class="top-left-grid">
				<div class="icon-dropdown">
					<div id="dd2" class="wrapper-dropdown-3">
						<i class="dropdown-icon"> </i>
					</div>
				</div>
				<div class="header_top_right">
					<a href="#" class="right_bt" style="background: url(./images/mic.png) no-repeat #1C7BA5 center; background-size: 24px" id="activator"> </a>
					<div class="box" id="box">
						<div class="box_content">
							<div class="box_content_center">
								<div class="form_content">
									<div class="top-search-box">
										<input type="text" value="Search the website" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Search the website';}">
									</div>
									<a class="boxclose" id="boxclose">X</a>
								</div>
								<div class="clear"></div>
							</div>
						</div>
					</div>
					<div class="clear"></div>

				</div>
				<div class="clear"></div>
			</div>
		</div>

		<!--- HEADER ENDS ---->

		<!-- PAY STARTS -->
		<div class="view" id="pay">
			<div style="height: 10px"></div>
			<div class="top-social-icons">
				<ul style="float: right;">
					<li><a class="facebook" style="background-color: #03547C"><i class="paypal_bigicon"> </i></a></li>
					<div class="clear"></div>
				</ul>
			</div>
			<div class="price_boxes">
				<div class="priceing-tabels">
					<div class="priceing-tabel1 priceing-tabel1-dark_blue">
						<div class="priceing-header">
							<h4>Pay by VISA, ***2338</h4>
							<a href="#"><span class="dollor">$</span>890<span>00</span></a>
						</div>
						<ul>
							<li><a href="#">Swissotel Grand, Shanghai</a></li>
							<li><a href="#">27 Jan, 2017 for 4 nights</a></li>
							<li><a href="#">Executive Suite</a></li>
							<li><a href="#">Notes: Early Checkin @ 10:00 AM</a></li>
						</ul>
						<a class="price-btn popup-with-zoom-anim" href="#small-dialog"><i class="right-arrow"> </i>ACCEPT</a>
					</div>
				</div>

			</div>
		</div>

		<!--- PAY ENDS ---->

		<!-- CONNECTED STARTS -->
		<div id="connected" class="view">
			<div class="clear"></div>
			<div style="height: 10px"></div>
			<div class="profile" style="text-align: center">
				<div class="profile-details">
					<div class="profile_picture">
						<div class="profile_picture_name">
							<h2>
								<a href="#">Hello, Mr. Sam</a>
							</h2>
							<p>
								<a href="#">Profile Completeness: 80%</a>
							</p>
						</div>
						<a href=""><img src="images/portfolio_img.jpg" alt=""> </a>
					</div>
					<div class="follow">
						<a href="#"> Connected</a>
					</div>
				</div>
				<div class="clear"></div>
				<div style="height: 10px"></div>
			</div>
		</div>


		<!--- CONNECTED ENDS ---->

		<!-- CONNECT STARTS -->


		<div id="connect" class="view">
			<div class="header_middle" style="display:">
				<div class="news">
					<h3>Connect With</h3>
				</div>
				<div class="clear"></div>
				<div style="height: 10px"></div>
				<div class="top-social-icons">
					<ul style="margin-left: 28px;">
						<li><a class="facebook"><i class="kf_bigicon"> </i></a></li>
						<li><a class="facebook"><i class="facebook_bigicon"> </i></a></li>
						<div class="clear"></div>
						<div style="height: 10px"></div>
					</ul>
					<ul style="margin-left: 28px;">
						<li><a class="twitter"> <i class="twitter_bigicon"> </i></a></li>
						<li><a class="facebook"><i class="paypal_bigicon"> </i></a></li>
						<div class="clear"></div>
						<div style="height: 10px"></div>
					</ul>
				</div>


				<div class="news">
					<h3>
						<span style="font-size: 20px; font-style: bold"> + </span> More Connections
					</h3>

				</div>
				<div class="clear"></div>
				<div style="height: 10px"></div>

				<div class="top-social-icons">
					<ul style="margin-left: 28px;">
						<li><a class="facebook"><i class="mail_bigicon"> </i></a></li>
						<li><a class="facebook"> <i class="office_bigicon"> </i></a></li>
						<div class="clear"></div>
						<div style="height: 10px"></div>
					</ul>
				</div>
			</div>
		</div>
		<!--- CONNECT ENDS ---->

		<!-- LOGIN STARTS -->
		<div class="sign-in view" id="login">
			<div class="sign_in">
				<h3>Login</h3>
				<form>
					<span> <i class="user"> </i><input type="text" value="Username" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Username';}">
					</span> <span> <i class="lock"> </i> <input type="password" value="**********" onfocus="this.value = '';"
						onblur="if (this.value == '') {this.value = '**********';}">
					</span> <input type="submit" onclick="return false;" class="my-button" value="Login" id="login_button">
					<div class="clear"></div>
				</form>
			</div>
		</div>

		<!--- LOGIN ENDS ---->

		<!-- FLIGHT STARTS -->

		<div id="flight" class="view">
			<div class="clear"></div>
			<div class="news">
				<h3>Recommendations</h3>
			</div>
			<div class="clear"></div>
			<div style="height: 10px"></div>
			<div class="tweets_list" style="display:">
				<ul>
					<li class="blue-color"><i class="thumbsup-icon"> </i><span>You haven't booked your tickets for CNY. <br />Prices are cheapest now on the best
							matched flight.
					</span>
						<div class="clear"></div></li>
					<li class="green"><i class="plane-icon"> </i><span>Singapore to Shanghai <br /> Business Class on Friday
					</span>
						<div class="clear"></div></li>
					<div class="tag-list" style="float: right; margin-top: 5px; margin-botton: 0px;">
						<a href="#" title="Wordpress">Buy Now</a> <a href="#" title="Wordpress" style="margin-right: 0px;">Remind Tomorrow</a>
					</div>
					<div class="tag-list" style="float: right; margin-top: 0px;">
						<a href="#" title="Wordpress">Not Going</a> <a href="#" title="Wordpress" style="margin-right: 0px;">Not Relevant</a>
					</div>
					<div class="clear"></div>
					<div style="height: 10px"></div>
				</ul>
			</div>
		</div>
		<!--- FLIGHT ENDS ---->



		<!-- REMINDER STARTS -->
		<div id="reminder" class="view">
			<div class="clear"></div>
			<div class="news">
				<h3>Reminders</h3>
			</div>
			<div class="clear"></div>
			<div style="height: 10px"></div>
			<div class="tweets_list" style="display:">
				<ul>
					<div class="clear"></div>
					<div style="height: 10px"></div>

					<li class="red"><i class="tweet-icon"> </i> <span>Your Passport is Expiring on 1 Feb 2017</span>
						<div class="clear"></div></li>
					<div class="clear"></div>
					<div class="tag-list" style="float: right; margin-top: 5px; margin-botton: 0px;">
						<a href="#" title="Wordpress">Renew Now</a> <a href="#" title="Wordpress" style="margin-right: 0px;">Remind on Monday</a>
					</div>
					<div style="height: 10px"></div>
				</ul>
			</div>
		</div>
		<!--- REMINDER ENDS ---->


		<!-- HOTEL STARTS -->
		<div id="hotel" class="view">
			<div class="news">
				<h3>Suggested Hotel</h3>
			</div>
			<div class="clear"></div>
			<div class="tweets_list" style="display: block">
				<ul>
					<li class="blue-color"><i class="thumbsup-icon"> </i><span>Swissotel Grand, 5 Star<br /> Located near your areas of interests. Recently
							renovated and discounted price.
					</span>
						<div class="clear"></div></li>
				</ul>
			</div>
			<div class="clear"></div>


			<div class="coursel">
				<div class="ocarousel example_info" data-ocarousel-period="6000">
					<div class="ocarousel_window" style="height: 250px;">
						<div style="">
							<img src="images/swissotel.jpg" style="height: 250px" alt="" />
						</div>
						<div>
							<img src="images/mandarin.jpg" style="height: 250px" alt="" />
						</div>
						<div>
							<img src="images/marriott.jpg" alt="" />
						</div>
					</div>
					<div class="prev_next">
						<a href="#" data-ocarousel-link="left" class="prev"> <i class="prev"> </i></a> <a href="#" data-ocarousel-link="right" class="next"> <i class="next">
						</i></a>
						<div class="ocarousel_indicators2"></div>
						<div class="clear"></div>
					</div>
				</div>
			</div>
			<div class="tag-list" style="float: right; margin-top: -5px; margin-botton: 0px;">
				<a href="#" title="Wordpress">Book for 4 Nights @890 SGD</a> <a href="#" title="Wordpress" style="margin-right: 0px;">Modify Search</a>
			</div>
			<div class="tag-list" style="float: right; margin-top: 5px; margin-botton: 0px;">
				<a href="#" title="Wordpress">Hotel Not Required</a> <a href="#" title="Wordpress" style="margin-right: 0px;">Suggest Another</a>
			</div>
		</div>

		<!--- HOTEL ENDS ---->

		<!-- PAY STARTS -->
	</div>
</body>
</html>