-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
225 lines (206 loc) · 12.8 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Start your development with FoodHut landing page.">
<meta name="author" content="Devcrud">
<title>My Food Land</title>
<!-- font icons -->
<link rel="stylesheet" href="assets/vendors/themify-icons/css/themify-icons.css">
<link rel="stylesheet" href="assets/vendors/animate/animate.css">
<link rel="icon" type="image/png" href="https://cdn-icons-png.flaticon.com/128/878/878052.png"/>
<!-- Bootstrap + FoodHut main styles -->
<link rel="stylesheet" href="assets/css/foodhut.css">
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="40" id="home">
<!-- Navbar -->
<nav class="custom-navbar navbar navbar-expand-lg navbar-dark fixed-top" data-spy="affix" data-offset-top="10">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#home">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#bmi">BMI</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#blog">Promotion</a>
</li>
</ul>
<a class="navbar-brand m-auto" href="#">
<span class="brand-txt">My Food</span>
</a>
<ul class="navbar-nav">
<li class="nav-item">
<a href="#contact" class="btn btn-primary ml-xl-4">Contact Us</a>
</li>
</ul>
</div>
</nav>
<!-- Header -->
<header id="home" class="header">
<div class="overlay text-white text-center">
<h1 class="display-2 font-weight-bold my-3">My Food Land</h1>
<h2 class="display-4 mb-5">พื้นที่ของคนรักความอร่อย</h2>
<a class="btn btn-lg btn-primary" href="#about">เกี่ยวกับร้านของเรา</a>
</div>
</header>
<!-- About Me -->
<div id="about" class="container-fluid wow fadeIn" id="about"data-wow-duration="1.5s">
<div class="row">
<div class="col-lg-6 has-img-bg"></div>
<div class="col-lg-6">
<div class="row justify-content-center">
<div class="col-sm-8 py-5 my-5">
<h2 class="mb-4">เกี่ยวกับร้านอาหารของเรา</h2>
<p>ยินดีต้อนรับสู่ My Food Land ร้านอาหารสำหรับคนรักความอร่อย แต่ก่อนจะรักความอร่อยอย่าลืมรักสุขภาพกันด้วยนะ ! ร้านของเราได้เปิดกิจการมาแล้วกว่า 5 ปี อาหารของเรามีความเป็นเอกลักษณ์</p>
อาหารส่วนใหญ่เน้น หมู และ ไก่ และทีเด็ดของทางร้านเลยคือเนื้อวัวที่เป็นเมนูพิเศษ
<p>และร้านของเรายังมีโปรโมชั่นทุกเดือน ทุกสาขา อย่าลืมมาทานของอร่อย ๆ กันนะ </p>
</div>
</div>
</div>
</div>
</div>
<!-- BMI -->
<div class="container-fluid has-bg-overlay text-center text-light has-height-lg middle-items" id="bmi">
<div class="">
<h2 class="section-title mb-5">ระบบคำนวณ BMI</h2>
<div class="row mb-5">
<div class="col-sm-6 col-md-3 col-xs-12 my-2">
<input type="text" id="height" class="form-control form-control-lg custom-form-control" placeholder="ส่วนสูง Height"><br>
</div>
<div class="col-sm-6 col-md-3 col-xs-12 my-2">
<input type="text" id="weight" class="form-control form-control-lg custom-form-control" placeholder="น้ำหนัก Weight" max="20" min="0"><br>
</div>
<div class="col-sm-6 col-md-3 col-xs-12 my-2">
<h3 id="result"></h3>
</div>
</div>
<a class="btn btn-lg btn-primary"id="btn">คำนวณค่า BMI</a>
</div>
</div>
<!-- Promotion -->
<div id="blog" class="container-fluid bg-dark text-light py-5 text-center wow fadeIn">
<h2 class="section-title py-5">โปรโมชั่นประจำเดือน พฤษภาคม 2023</h2>
<div class="row justify-content-center">
<div class="col-sm-7 col-md-4 mb-5">
<ul class="nav nav-pills nav-justified mb-3" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#foods" role="tab" aria-controls="pills-home" aria-selected="true">อาหาร</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#juices" role="tab" aria-controls="pills-profile" aria-selected="false">เครื่องดื่ม</a>
</li>
</ul>
</div>
</div>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="foods" role="tabpanel" aria-labelledby="pills-home-tab">
<div class="row">
<div class="col-md-4">
<div class="card bg-transparent border my-3 my-md-0">
<img src="https://www.maeban.co.th/upload_images/image/features/history%20-%20hamburger/01.jpg" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary">59 บาท </a></h1>
<h4 class="pt20 pb20">แฮมเบอร์เกอร์</h4>
<p><del>จากราคา 65 บาท</del></p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card bg-transparent border my-3 my-md-0">
<img src="https://p4.wallpaperbetter.com/wallpaper/78/779/731/food-burger-french-fries-still-life-hd-wallpaper-preview.jpg" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary">119 บาท</a></h1>
<h4 class="pt20 pb20">แฮมเบอร์เกอร์ เฟรนช์ฟราย</h4>
<p><del>จากราคา 125 บาท</del></p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card bg-transparent border my-3 my-md-0">
<img src="https://images.aws.nestle.recipes/original/dd4d3597f79429e63e3836ae3a9dbea1_fried-chicken.jpg" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary">59 บาท</a></h1>
<h4 class="pt20 pb20">ไก่ทอดไร้กระดูก</h4>
<p><del>จากราคา 75 บาท</del></p>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="juices" role="tabpanel" aria-labelledby="pills-profile-tab">
<div class="row">
<div class="col-md-4 my-3 my-md-0">
<div class="card bg-transparent border">
<img src="https://st4.depositphotos.com/1063437/38056/i/450/depositphotos_380560238-stock-photo-poznan-pol-may-22-2020.jpg" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary"> 29 บาท </a></h1>
<h4 class="pt20 pb20">เป๊บซี่ 1 กระป๋อง </h4>
<p><del>จาก 35 บาท</del></p>
</div>
</div>
</div>
<div class="col-md-4 my-3 my-md-0">
<div class="card bg-transparent border">
<img src="https://news.gimyong.com/attachment/image/72736" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary"> 110 บาท </a></h1>
<h4 class="pt20 pb20">Set โค้กปาร์ตี้</h4>
<p><del>จาก 135 บาท</del></p>
</div>
</div>
</div>
<div class="col-md-4 my-3 my-md-0">
<div class="card bg-transparent border">
<img src="https://img.kapook.com/u/surauch/cook/cd05%20LemonMintMocktail.jpg" alt="template by DevCRID http://www.devcrud.com/" class="rounded-0 card-img-top mg-responsive">
<div class="card-body">
<h1 class="text-center mb-4"><a class="badge badge-primary">29 บาท</a></h1>
<h4 class="pt20 pb20">โซดา เลม่อน 1 แก้ว</h4>
<p><del>จาก 35 บาท</del></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- GoogleMap Address -->
<center><h2 class="section-title py-5">Google Map My Food</h2></center>
<div id="contact" class="container-fluid bg-dark text-light border-top wow fadeIn">
<div class="row">
<div class="col-md-6 px-0">
<div id="map" style="width: 100%; height: 100%; min-height: 400px"></div>
</div>
<div class="col-md-6 px-5 has-height-lg middle-items">
<h3>ที่อยู่ร้านอาหาร My Food</h3>
<p>ตั้งอยู่ใน : ซีคอนสแควร์ ศรีนครินทร์ เวลาเปิด-ปิด : 09:00 - 21:00 </p>
<div class="text-muted">
<p>Address : 55 ถ. ศรีนครินทร์ แขวงหนองบอน เขต ประเวศ กรุงเทพมหานคร 10250</p>
<p>Tel : 087-3535-971 </p>
<p>Email : info@myfood.com</p>
</div>
</div>
</div>
</div>
<!-- end of page footer -->
<!-- core -->
<script src="assets/vendors/jquery/jquery-3.4.1.js"></script>
<script src="assets/vendors/bootstrap/bootstrap.bundle.js"></script>
<!-- bootstrap affix -->
<script src="assets/vendors/bootstrap/bootstrap.affix.js"></script>
<!-- wow.js -->
<script src="assets/vendors/wow/wow.js"></script>
<!-- google maps -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCtme10pzgKSPeJVJrG1O3tjR6lk98o4w8&callback=initMap"></script>
<!-- FoodHut js -->
<script src="assets/js/foodhut.js"></script>
</body>
</html>