-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
219 lines (207 loc) · 12.9 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>rivel :3</title>
<!-- <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-grid.css"> -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
</head>
<body style="background-color: #121212;">
<section>
<!-- navbar -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark text-light">
<div class="container">
<a class="navbar-brand fw-bold" href="index.html">Ryvl Hobby Shop</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav ms-auto">
<a class="nav-link active" aria-current="page" href="index.html">Home</a>
<a class="nav-link " aria-current="page" href="#produk">Produk</a>
<a class="nav-link " aria-current="page" href="#contact">Contact</a>
<a class="nav-link" href="profile.html">Profile</a>
</div>
</div>
</div>
</nav>
<!-- end navbar -->
</section>
<section>
<div class="container my-5">
<div class="row align-items-center">
<div class="col-md-6 col-auto">
<h1 class="fw-bold" style="color: azure;">Selemat Datang Di Ryvl Hobby Shop</h1>
<p class="fs-5" style="color: azure;">
Selamat datang di toko kami, tempat terbaik untuk membeli figure anime berkualitas tinggi. Temukan koleksi lengkap figure anime dari serial terkenal dengan detail yang luar biasa. Dapatkan pengalaman berbelanja menyenangkan dengan layanan pelanggan yang ramah dan pengiriman yang cepat dan aman. Jelajahi dan tambahkan keindahan anime ke koleksi pribadi Anda dengan figure yang kami sediakan. Terima kasih atas kunjungannya!
</p>
</div>
<div class="col-md-6 col-auto">
<img src="building_anime_shop.png" alt="" width="500">
</div>
</div>
</div>
</section>
<!-- product -->
<section class="my-4" id="produk">
<div class="container">
<h1 class="text-center mb-4" style="color: azure;">Produk Saya</h1>
<div class="row justify-content-center align-items-top">
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="ventinendo.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Venti (Nendoroid)</h5>
<p class="card-text">“I was about to ask you — what is your greatest wish?”
From the popular game "Genshin Impact" comes a Nendoroid of the Windborne Bard, Venti! He comes with three face plates including a winking face, a relaxed face with closed eyes and a smiling face.
Optional parts include his wooden lyre, Der Frühling as well as the Skyward Harp bow, allowing you to recreate the battle scenes from the game. Venti is just as cute as ever in adorable Nendoroid size, so be sure to add him to your collection!</p>
<h4>Rp680.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="144688-project-sekai-colorful-stage-feat-hatsune-miku-nesoberi-plush-kamishiro-rui-s.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Project SEKAI Colorful Stage! feat. Hatsune Miku Nesoberi Plush Kamishiro Rui S</h5>
<p class="card-text">"Now then, let us put on the most magnificent of shows!"
―Kamishiro Rui</p>
<h4>Rp480.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="s-l1600.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Project SEKAI Colorful Stage! feat. Hatsune Miku Nesoberi Plush Tsukasa Tenma S</h5>
<p class="card-text">HEY‼️🤺 GIRL💅😻 MY NAME IS TSUKASA✨🥵TENMA🐎🌀I AM STAR⭐️☠️I AM WORLD🌍🦖 FUTURE🏙🏋️♂️ STAR✨🤩 DANSU ➡️↖️⬅️⬆️🕺 ANDO SING!🎤🆖🅰️🅱️</p>
<h4>Rp500.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="touhou-fumo.gif" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Fumo Fumo Reimu Hakurei Touhou Project Series 54 ver. 1.5 Plush Doll Limited</h5>
<p class="card-text">Heaven seems hot. There's nothing to shade from the sun.
<p>-Reimu Hakurei</p>
</p>
<h4>Rp1.200.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="26cf6b2ea025595b2e003473fdf0c5a8.webp" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Nendoroid Traveler / Aether - Genshin Impact - Aether</h5>
<p class="card-text">"Don't lose faith in that which you have lost. In this new world, you will never be alone. Where you leave your footprints, and where you have yet to stride — your new world will unfold before you."
<p>-Aether</p>
</p>
<h4>Rp720.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="marisa-kirisame-fumo.gif" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Touhou Plush Series 55 ver.1.5 FumoFumo Marisa Kirisame (Limited)</h5>
<p class="card-text">How about having the kappa make you a motor boat? It'd make your job fun.
<p>-Marisa Kirisame</p>
</p>
<h4>Rp1.540.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="GOODS-04359770.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">HATSUNE MIKU: COLORFUL STAGE! Plush Wonderland SEKAI Hatsune Miku (PO)</h5>
<p class="card-text">ini barang po jadi kalo mo beli mohon sabar dlu baru dikirim</p>
<h4>Rp520.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="29ed7a1e24c017a73a1049c095d6b417.webp" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Nendoroid Shinji Ikari - Evangelion</h5>
<p class="card-text">From the popular animated film series "Rebuild of Evangelion" comes a Nendoroid of the Third Child, Shinji Ikari. He comes with three face plates including a standard expression, a lethargic expression and a blushing expression.
<p>He comes with his bag, backpack and portable music player as optional parts in order to recreate various scenes from his everyday life. A base made to look like stone rubble and special lower half parts to pose him sitting are also included. He can be combined with the upcoming Nendoroid Kaworu Nagisa to create a special display of the two of them. Be sure to add him to your collection!</p>
</p>
<h4>Rp850.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
<div class="col col-auto col-md-3 p-2">
<div class="card bg-dark text-light shadow-sm" style="width: 18rem;">
<img src="249425-nendoroid-hoshino-ai-oshi-no-ko-1161875037.jpg.webp" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Nendoroid Hoshino Ai - Oshi No Ko</h5>
<p class="card-text">"Lies are the most exquisite love!"</p>
<p>the anime series【OSHI NO KO】comes a Nendoroid of Ai! Face plates: · Smiling face · Idol face · Grinning face Optional parts: · Microphone · Other optional parts for different poses.</p>
</p>
<h4>Rp660.000</h4>
<a href="#" class="btn btn-primary mt-2">Beli</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- end product -->
<section id="contact">
<div class="container mt-4">
<div class="row justify-content-center">
<div class="col-md-10 col-auto">
<div class="card my-5">
<div class="card-header bg-dark text-light">
<h2>Hubungi Kami</h2>
</div>
<div class="card-body bg-black text-light">
<div class="mb-3 bg-black">
<label for="Nama" class="form-label">Nama</label>
<input type="text" name="Nama" id="Nama" class="form-control" placeholder="Masukkan Nama">
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" name="Email" id="Email" class="form-control"
placeholder="Masukkan Email">
</div>
<div class="mb-3">
<div class="form-floating">
<textarea class="form-control" placeholder="Leave a comment here" id="floatingTextarea2"
style="height: 100px"></textarea>
<label for="floatingTextarea2">Message</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
crossorigin="anonymous"></script>
</html>