-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
132 lines (131 loc) · 5.37 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
<!DOCTYPE html>
<html>
<head>
<meta chartset="UTF-8">
<meta name="vlewport" content="width=devicewidth, initial-scale=1.0">
<title>Sahabat Store</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<div class="wrapper">
<div class="logo"><a href=''>Sahabat Store</a></div>
<div class="menu">
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#profile">Profile</a></li>
<li><a href="#products">Products</a></li>
<li><a href="#partnership">Partnership</a></li>
<li><a href="#contact">Contact</a></li>
<li><button class="tombol-terang" onclick="ubahwarna()"> Ubah Tampilan ke Light Mode</button>
<button class="tombol-gelap" onclick="ubahwarna()"> Ubah Tampilan ke Dark Mode</button></li>
</ul>
</div>
</div>
</nav>
<div class="wrapper">
<!--Tab Home-->
<section id="home">
<img src="store.png"width="50%">
<div class="kolom">
<p class="deskripsi">Selamat Datang di Sahabat Store</p>
<h2>Belanja Terpercaya, Nyaman, Bersahabat.</h2>
<p>Sahabat Store menyediakan berbagai alat keperluan
rumah tangga, sembako, oleh-oleh khas Sragen,
snack/makanan ringan, aneka minuman, dll</p>
</div>
</section>
<!--Tab Profile-->
<section id="profile">
<div class="kolom">
<p class="deskripsi">Mari Mengenal Kami Lebih Lanjut</p>
<h2>Sejarah Berdirinya Sahabat Store</h2>
<p>
Sahabat Store pertama kali dibuka pada tanggal 31 Agustus 2011 bertepatan
dengan hari raya Iedul Fitri. Mulanya Sahabat Store bernama Toko Gemolongan
kemudian beralih nama menjadi Toko Sahabat (Sahabat Store). Sahabat Store berkomitmen
untuk terus berkembang dan bersahabat bagi masyarakat Gemolong dan sekitarnya.
</p>
</div>
<img src="history2.png"width="40%">
</section>
<!--Tab Products-->
<section id="products">
<div class="tengah">
<div class="kolom">
<p class="deskripsi">Our Products</p>
<h2>Product</h2>
<p>Menyediakan berbagai kebutuhan anda</p>
</div>
<div class="product-list">
<div class="product-card">
<img src="aneka2.png"width="90%">
<p>Aneka Makanan dan Minuman</p>
</div>
<div class="product-card">
<img src="sembako2.png"width="90%">
<p>Sembako</p>
</div>
<div class="product-card">
<img src="perabotan2.png"width="90%">
<p>Kebutuhan Rumah Tangga</p>
</div>
<div class="product-card">
<img src="snack2.png"width="90%">
<p>Aneka Snack</p>
</div>
</div>
</div>
</section>
<!--Tab Partnership-->
<section id="partnership">
<div class="tengah">
<div class="kolom">
<h2>Partnership</h2>
<p>Our Partner</p>
</div>
<div class="product-list">
<div class="product-card">
<img src="raffa.png"width="80%">
</div>
<div class="product-card">
<img src="tokoseneng.png"width="80%">
</div>
<div class="product-card">
<img src="arena.png"width="80%">
</div>
<div class="product-card">
<img src="sahabatsnack.png"width="80%">
</div>
<div class="product-card">
<img src="buzaen.png"width="80%" >
</div>
</div>
</div>
</section>
</div>
<div id="contact">
<div class="wrapper">
<div class="footer">
<div class="footer-section">
<h3>Sahabat Store</h3>
</div>
<div class="footer-section">
<h3>About</h3>
<p>Alamat:</p>
<p>Jl. Citrosancakan, Rt1 Rw 1, Gemolong, Gemolong, Sragen</p>
</div>
<div class="footer-section">
<h3>Contact</h3>
<p>Telp: 08572875566</p>
</div>
<div class="footer-section">
<h3>Social</h3>
<p>Instagram:@sahabatsnack</p>
</div>
</div>
</div>
</div>
<script src="javascript.js"></script>
</body>
</html>