Skip to content

index.html

SpencerChang edited this page Aug 2, 2016 · 3 revisions
<head>
	<meta charset="utf-8" />
	<title>Goingeat</title>

	<!-- bootstrap.css v3.3.6 -->
	<link rel="stylesheet" href="./css/lib/bootstrap/bootstrap.min.css">

	<!-- masonry.css v1.0.0 -->
	<link rel="stylesheet" type="text/css" href="css/masonry.css" />
	
	<!--map css-->
	<link rel="stylesheet" href="/maps/documentation/javascript/demos/demos.css">

	<!--isotope.css v1.0.0-->
	<!--<link rel="stylesheet" type="text/css" href="css/isotope.css" />-->

	<!-- main.css v1.0.0 -->
	<link rel="stylesheet" href="./css/main.css">

	<!--jquery v2.2.4-->
	<script src="./js/lib/jquery/jquery-2.2.4.min.js" type="text/javascript" charset="utf-8"></script>

	<!--jquery-migrate v1.4.1-->
	<script src="./js/lib/jquery/jquery-migrate-1.4.1.min.js" type="text/javascript" charset="utf-8"></script>

	<!-- bootstrap.js v3.3.6 -->
	<script src="./js/lib/bootstrap/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>

	<!--tweenmax v1.18.5-->
	<script src="./js/lib/TweenMax/TweenMax.min.js" type="text/javascript" charset="utf-8"></script>

	<!--jquery.placeholder v2.3.1-->
	<script src="./js/lib/jquery.placeholder/jquery.placeholder.min.js" type="text/javascript" charset="utf-8"></script>

	<!--masonry v4.0.0-->
	<script src="./js/lib/masonry/masonry.pkgd.min.js" type="text/javascript" charset="utf-8"></script>

	<!--isotope v3.0.1-->
	<script src="./js/lib/isotope/isotope.pkgd.min.js" type="text/javascript" charset="utf-8"></script>

	<!--imagesLoaded v4.1.0-->
	<script src="./js/lib/imagesloaded/imagesloaded.pkgd.min.js" type="text/javascript" charset="utf-8"></script>

	<!--map api-->
	<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBDiyWDIUlw5bH0L2Dj5Buzz1vOSV8NR2M&callback=initMap" async defer></script>
	
	<!--main.js v1.0.0-->
	<script src="./js/main.js" type="text/javascript" charset="utf-8"></script>
			
	<!--map.js v1.0.0-->
	<script src="./js/map.js" type="text/javascript" charset="utf-8"></script>
	
</head>

<body>
	<div class="form-group">
		<div class="row">
			<div class="col-xs-12 col-sm-12">
				<img src="https://a0.muscache.com/airbnb/static/P1F1.jpg" />
			</div>

			<div class="col-xs-9 col-sm-9 col-xs-offset-3 col-sm-offset-3" id="find_block">
				<div class="form-inline">
					<div class="form-group">
						<input type="text" class="form-control" placeholder="品味各地" name="region">
					</div>
					<div class="form-group">
						<select class="form-control">
							<option>所有菜系</option>
							<option>義大利菜</option>
							<option>家常菜</option>
						</select>
					</div>
					<div class="form-group">
						<input type="text" class="form-control" placeholder="預定時間-起" name="start_time">
					</div>
					<div class="form-group">
						<input type="text" class="form-control" placeholder="預定時間-迄" name="end_time">
					</div>
					<div class="form-group">
						<button type="button" class="btn btn-danger">搜索</button>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div class="form-group text-center">
		<p class="text-muted"><strong><h2>世界上的家庭餐館</h2></strong></p>
		<p class="text-muted">
			<h3>探索各地特色</h3></p>
	</div>

	<div class="form-group" id="map">
		<div id="map"></div>
	</div>

	<div class="form-group text-center">
		<p class="text-muted"><strong><h2>附近的好食處</h2></strong></p>
		<p class="text-muted">
			<h3>Near By You!</h3></p>
	</div>

	<div class="form-group" id="map">
		near by map
	</div>

	<div class="form-group text-center">
		<p class="text-muted"><strong><h2>熱門選擇</h2></strong></p>
		<p class="text-muted">
			<h3>Hot Choice </h3></p>
	</div>

	<div class="form-group" id="hot">
		<div class="grid">
			<div class="grid-sizer"></div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/orange-tree.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/submerged.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/look-out.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/one-world-trade.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/drizzle.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/cat-nose.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/contrail.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/golden-hour.jpg" />
			</div>
			<div class="grid-item">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/flight-formation.jpg" />
			</div>
		</div>
	</div>

	<div class="form-group text-center">
		<p class="text-muted"><strong><h2>特色菜系</h2></strong></p>
		<p class="text-muted">
			<h3>Favorite food style you will like </h3></p>
	</div>

	<div class="form-group text-center">
		<div class="button-group filter-button-group">
			<button class="btn btn-success" data-filter="*">全部菜系</button>
			<button class="btn btn-success" data-filter=".ch">中式菜系</button>
			<button class="btn btn-success" data-filter=".jp">日式菜系</button>
			<button class="btn btn-success" data-filter=".sa">東南亞菜系</button>
			<button class="btn btn-success" data-filter=".us">美式菜系</button>
			<button class="btn btn-success" data-filter=".it">義式菜系</button>
			<button class="btn btn-success" data-filter=".eu">歐式菜系</button>
		</div>
	</div>

	<div class="form-group" id="food_style">
		<div class="food_grid">
			<div class="grid-item ch">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/orange-tree.jpg" />
			</div>
			<div class="grid-item jp">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/submerged.jpg" />
			</div>
			<div class="grid-item us">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/look-out.jpg" />
			</div>
			<div class="grid-item sa">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/one-world-trade.jpg" />
			</div>
			<div class="grid-item it">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/drizzle.jpg" />
			</div>
			<div class="grid-item eu">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/cat-nose.jpg" />
			</div>
			<div class="grid-item us">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/contrail.jpg" />
			</div>
			<div class="grid-item ch">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/golden-hour.jpg" />
			</div>
			<div class="grid-item it">
				<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/flight-formation.jpg" />
			</div>
		</div>
	</div>

</body>
Clone this wiki locally