-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
282 lines (248 loc) · 9.86 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
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Rumah makan depot citra ambat</title>
<!-- fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="css/style.css" />
<!-- feather icon -->
<script src="https://unpkg.com/feather-icons"></script>
</head>
<body>
<!-- navbar start -->
<nav class="navbar">
<a href="#alamat" class="navbar-logo">depot<span>citra</span></a>
<div class="navbar-nav">
<a href="#home">home</a>
<a href="#about">tentang kami</a>
<a href="#menuu">menu</a>
<a href="#fasilitas">fasilitas</a>
<a href="#alamat">alamat</a>
</div>
<div class="navbar-extra">
<a id="menu"><i data-feather="menu"></i></a>
</div>
</nav>
<!-- navbar end -->
<!-- hero section start -->
<section class="hero" id="home">
<main class="content">
<h1>Depot<span>citra</span></h1>
<p>Rumah makan madura |</p>
<p> nyaman mude ben sehat</p>
<a href="#alamat" class="cta">kunjungi sekarang</a>
</main>
</section>
<!-- hero section end -->
<!-- about section start -->
<section id="about" class="about">
<h2><span>tentang</span>kami</h2>
<div class="row">
<div class="about-img">
<img src="img/memori1.jpg" alt="tentang kami" />
</div>
<div class="content ">
<h3>kenapa harus mampir ke <span>depot citra?</span></h3>
<p>
karena kami menyediakan berbagai hidangan spesial untuk anda nikmati dengan nyaman, aman dan tak lupa suasana sederhana dan tempo doeloe akan membuat anda serasa bernostalgia pada tahun awal dimasa berdirinya kami, yaitu pada tahun 2001.
</p>
<p>tapi jangan salah sangka, meskipun kami menganut konsep kesederhanaan tapi kalau soal rasa kami tentu kami juaranya. dan yang paling penting, ramah di kantong lho...</p>
<p>ennga percaya? buruan datang dan rasakan sendiri kelezatannya di rumah makan kami.</p>
<h5><span>buka:</span> 06:00WIB | <span>tutup:</span> 23:00WIB</h5>
</div>
</div>
</section>
<!-- about section end -->
<!-- menu section start -->
<section id="menuu" class="menuu scrollanima">
<div >
<h2><span>menu</span>kami</h2>
<p>anda bingung mau makan apa?</p>
<p>kami punya banyak pilihan untuk anda diantara seafood yang menjadi masakan andalan kami</p>
</div>
<div class="row scrollanima ">
<div class="menuu-card">
<img src="img/ikanpatinfinal2.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-ikan kembung-</h3>
</div>
<div class="menuu-card">
<img src="img/ikannilafinal.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-ikan patin-</h3>
</div>
<div class="menuu-card">
<img src="img/guramefinal.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-ikan gurame-</h3>
</div>
<div class="menuu-card">
<img src="img/udangbaladofinal.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-udang balado-</h3>
</div>
<div class="menuu-card">
<img src="img/udanggorengfinal.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-udang goreng-</h3>
</div>
<div class="menuu-card">
<img src="img/cumifinal.jpg" alt="seafood" class="menuu-card-img">
<h3 class="menuu-card-title"">-cumi laut-</h3>
</div>
</div>
</section>
<!-- menu section end -->
<!-- list menu start -->
<div class="scrollanima">
<section class="list ">
<div class="list-judul"><h2><span>pilihan ada di</span> tangan anda </h2></div>
<div class="row">
<div class="food-list">
<div class="food">
<h1>food</h1>
<p>ayam goreng krispi</p>
<p>ayam bakar</p>
<p>daging bumbu merah</p>
<p>ati telur puyuh</p>
<p>tahu putih goreng</p>
<p>tempe goreng</p>
<p>dadar jagung</p>
<p>perkedel</p>
</div>
<div class="seafood">
<h1>seafood</h1>
<p>ikan kakap bakar</p>
<p>ikan tegiri bakar</p>
<p>ikan kakap bakar</p>
<p>ikan dorang bakar</p>
<p>ikan kuniran goreng</p>
<p>ikan kembung goreng</p>
<p>ikan pepes tongkol</p>
<p>ikan pepes kembung</p>
<p>ikan asem-asem putian</p>
<p>ikan teri goreng</p>
<p>udang goreng</p>
<p>udang balado</p>
<p>cumi hitam</p>
</div>
<div class="sayuran">
<h1>sayuran</h1>
<p>sayur asem</p>
<p>sayur bening</p>
<p>sayur sop</p>
<p>sayur lodeh</p>
<p>sayur pecel</p>
<p>oseng-oseng</p>
</div>
<div class="sambal">
<h1>sambal</h1>
<p>sambal merah</p>
<p>sambal hijau</p>
<p>sambal matah</p>
<p>sambal petis</p>
<p>sambal tomat</p>
</div></div></div>
</section>
</div>
<!-- list menu end -->
<!-- memories start -->
<div class="memorie scrollanima">
<section class="memories">
<img src="img/gambarhidanganfinal.jpg" alt="">
</section>
<section class="memories2">
<img src="img/jajanfinal.jpg" alt="">
</section>
</div>
<!-- memories end -->
<!-- fasilitas start-->
<section id="fasilitas" class="fasilitas ">
<div class="scrollanima">
<h2><span>fasilitas</span>kami</h2>
</div>
<div class="row">
<div class="fasilitas-box">
<img src="fasilitas/parkir.png" alt="parkir" class="fasilitas-img">
<p class="fasilitas-p "><span>parkir luas dan GRATIS</span>anda mengendarai motor, mobil, atau bahkan truk?. jangan khawatir, kami menyediakan parkir yang cukup untuk kendaran anda. say NO pada pungutan liar karena kami menyediakan parkir kepada anda secara gratis. kalau ada yang bantu cukup bilang terima kasih :p
</p>
</div>
<div class="fasilitas-box ">
<img src="fasilitas/mushola.png" alt="parkir" class="fasilitas-img">
<p class="fasilitas-p "><span>musholla</span> jangan lupa untuk beribadah selama perjalanan jauh anda di musholla yang kami sediakan. ada tempat wudhu dan peralatan sholat juga tentunya.</p>
</div>
<div class="fasilitas-box">
<img src="fasilitas/toilet.png" alt="parkir" class="fasilitas-img">
<p class="fasilitas-p "><span>toilet dan kamar mandi GRATIS</span> kami menyediakan satu toilet dan dua kamar mandi untuk anda pakai dan tentu saja ini gratis tanpa di pungut biaya apapun sehingga anda tak perlu khawatir lagi kalau ingin bolak-balik.</p>
</div>
<div class="fasilitas-box">
<img src="fasilitas/westafel.png" alt="parkir" class="fasilitas-img">
<p class="fasilitas-p "><span>tempat cuci tangan</span> jangan lupa untuk cuci tangan sebelum makan. kami menyediakan tempat cuci tangan(westafel) untuk anda didalam dan diluar juga lho.</p>
</div>
</div>
</section>
<!-- fasilitas end-->
<!-- kenangan start -->
<div class="kotak-kenangan scrollanima">
<section class="kenangan">
<img src="img/gambarlobi2.jpg" alt="">
</section>
<section class="kenangan2">
<img src="img/lobidalam.jpg" alt="">
</section>
<section class="kenangan3">
<img src="img/gambarlobi.png" alt="">
</section>
</div>
<!-- kenangan end -->
<!-- contact section start -->
<section id="alamat" class="contact scrollanima">
<h2><span>alamat</span>kami</h2>
<p>tempat kami sangat mudah dijumpai, karena pas disamping jalan pantura antara pemakasan dan sampang</p>
<div class="row">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3958.181114608128!2d113.42473884061071!3d-7.220171696325832!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2dd77f260ff4dae3%3A0x44b78c3149a2fc27!2sDEPOT%20CITRA!5e0!3m2!1sid!2sid!4v1724586694192!5m2!1sid!2sid"allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade" class="map"></iframe>
<form action="action" class="form">
<div class="slide">
<div class="kolom-komentar">
<h1 class="judul-komentar">apa komentar mereka tentang depot citra?</h1>
</div>
<div class="kolom-komentar-komentator">
<img src="komentator/matt.png" alt="">
<p class="komentar"><span>Matt Journey</span> Masakan khas madura yang susah untuk tidak mampir jika melewati jalan arah ke Pamekasan (jika dari arah barat) atau jalan arah ke Sampang (jika dari arah timur)</p>
</div>
<div class="tombols">
<i data-feather="hexagon" class="tombol1"></i>
<i data-feather="hexagon" class="tombol2"></i>
<i data-feather="hexagon" class="tombol3"></i>
<i data-feather="hexagon" class="tombol4"></i>
<i data-feather="hexagon" class="tombol5"></i>
</div>
</div>
</form>
</div>
</section>
<!-- contact section end -->
<!-- footer start -->
<footer>
<div class="links">
<a href="#home">home</a>
<a href="#about">tentang kami</a>
<a href="#menuu">menu</a>
<a href="#fasilitas">fasilitas</a>
<a href="#alamat">alamat</a>
</div>
<div class="credit">
<p>created by <a href="https://www.instagram.com/fauzi_iilyas">fauzi ilyas</a>. & supported by <a href="https://www.instagram.com/cobrax_06">ahmad jihad.</a> | © 2024.</p>
</div>
</footer>
<!-- footer end -->
<!-- feather icon -->
<script>
feather.replace();
</script>
<!-- my javascript -->
<script src="script.js"></script>
</body>
</html>