-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
206 lines (184 loc) · 10.1 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Superstore</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,300;0,400;0,700;1,700&display=swap" rel="stylesheet" />
<!-- Feather Icons -->
<script src="https://unpkg.com/feather-icons"></script>
<!-- My Style -->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!-- Navbar start -->
<nav class="navbar">
<a href="/" class="navbar-logo">Super<span>Store</span>.</a>
<div class="navbar-nav">
<a href="#">Home</a>
<a href="#about">About</a>
<a href="#Chart">Chart</a>
<a href="/Table/index.html">Table</a>
<a href="team.html">Team</a>
<a href="#contact">Contact</a>
</div>
<div class="navbar-extra">
<a href="#" id="hamburger-menu"><i data-feather="menu"></i></a>
</div>
</nav>
<!-- Navbar end -->
<!-- Hero Section start -->
<section class="hero" id="Home">
<main class="content">
<h1>Super<span>store.</span></h1>
</main>
</section>
<!-- Hero Section end -->
<!-- About Section start -->
<section id="about" class="about">
<h2>Tentang Kami</h2>
<div class="row">
<div class="about-img">
<img src="img/dfg.jpeg.jpg" alt="Tentang Kami" />
</div>
<div class="content">
<h3>Super<span>store</span></h3>
<p>
Superstore adalah perusahaan retail yang menjual berbagai produk-produk penunjang produktifitas yang beroperasi di Amerika Serikat. Seiring dengan perjalanan bisnisnya, Superstore telah memahami bahwa data dan teknologi merupakan variable penting yang tidak bisa dipisahkan untuk terus mengembangkan bisnisnya.
</p>
</div>
</div>
</section>
<!-- About Section end -->
<!-- Chart Start -->
<section id="Chart" class="Chart">
<h2 class="C">Chart</h2>
<h4 class="chart-detail">Monthly Sales & Profit in 2017</h4>
<div class="row">
<div class="chart2">
<canvas id="myChart"></canvas>
</div>
<div class="content">
<p>Dari chart disamping bisa dilihat bahwa penjualan di setiap bulan dan juga keuntungan di setiap bulannya, yang mana dari chart disamping menunjukkan bahwa penjualan terendah berada di bulan Februari Yaitu hanya mencapai 20.301,13 penjualan saja, Sedangkan Profit Terendah berada di Bulan April Yaitu Hanya Meraih Keuntungan Sebesar 933,29 Saja. Selanjutnya adalah penjualan Terbanyak berada di Bulan November yakni Mencapai Hingga 118.447,82 Penjualan ,Walaupun Dibulan November Terjadi Penjualan Terbanyak Bukan Berarti Meraih keuntungan Terbanyak Pula , Keuntungan Atau Profit Terbanyak Di Raih pada Bulan Maret Yakni Mencapai Keuntungan Sebesar 14.751,89</p>
</div>
</div>
<h4 class="chart-detail">Company Profit from Product Category In Each Region</h4>
<div class="row">
<div class="chart2">
<canvas id="profitCategory"></canvas>
</div>
<div class="content">
<p>Dari chart disamping bisa dilihat bahwa penjualan di setiap bulan dan juga keuntungan di setiap bulannya, yang mana dari chart disamping menunjukkan bahwa penjualan terendah berada di bulan Februari Yaitu hanya mencapai 20.301,13 penjualan saja, Sedangkan Profit Terendah berada di Bulan April Yaitu Hanya Meraih Keuntungan Sebesar 933,29 Saja. Selanjutnya adalah penjualan Terbanyak berada di Bulan November yakni Mencapai Hingga 118.447,82 Penjualan ,Walaupun Dibulan November Terjadi Penjualan Terbanyak Bukan Berarti Meraih keuntungan Terbanyak Pula , Keuntungan Atau Profit Terbanyak Di Raih pada Bulan Maret Yakni Mencapai Keuntungan Sebesar 14.751,89</p>
</div>
</div>
<h4 class="chart-detail">Top 5 Product With the Highest Profit</h4>
<div class="row">
<div class="chart2">
<canvas id="profitProduct"></canvas>
</div>
<div class="content">
<p>Dari chart disamping bisa dilihat bahwa penjualan di setiap bulan dan juga keuntungan di setiap bulannya, yang mana dari chart disamping menunjukkan bahwa penjualan terendah berada di bulan Februari Yaitu hanya mencapai 20.301,13 penjualan saja, Sedangkan Profit Terendah berada di Bulan April Yaitu Hanya Meraih Keuntungan Sebesar 933,29 Saja. Selanjutnya adalah penjualan Terbanyak berada di Bulan November yakni Mencapai Hingga 118.447,82 Penjualan ,Walaupun Dibulan November Terjadi Penjualan Terbanyak Bukan Berarti Meraih keuntungan Terbanyak Pula , Keuntungan Atau Profit Terbanyak Di Raih pada Bulan Maret Yakni Mencapai Keuntungan Sebesar 14.751,89</p>
</div>
</div>
<h4 class="chart-detail">Total Of Purchase Based On Segment From 2014 - 2017</h4>
<div class="row">
<div class="chart2">
<canvas id="totalCustomer"></canvas>
</div>
<div class="content">
<p>Dari chart disamping bisa dilihat bahwa penjualan di setiap bulan dan juga keuntungan di setiap bulannya, yang mana dari chart disamping menunjukkan bahwa penjualan terendah berada di bulan Februari Yaitu hanya mencapai 20.301,13 penjualan saja, Sedangkan Profit Terendah berada di Bulan April Yaitu Hanya Meraih Keuntungan Sebesar 933,29 Saja. Selanjutnya adalah penjualan Terbanyak berada di Bulan November yakni Mencapai Hingga 118.447,82 Penjualan ,Walaupun Dibulan November Terjadi Penjualan Terbanyak Bukan Berarti Meraih keuntungan Terbanyak Pula , Keuntungan Atau Profit Terbanyak Di Raih pada Bulan Maret Yakni Mencapai Keuntungan Sebesar 14.751,89</p>
</div>
</div>
<h4 class="chart-detail">Total of Profit in Each Region</h4>
<div class="row">
<div class="chart2">
<canvas width="300" height="300" id="profitRegion"></canvas>
</div>
<div class="content">
<p>Dari chart disamping bisa dilihat bahwa penjualan di setiap bulan dan juga keuntungan di setiap bulannya, yang mana dari chart disamping menunjukkan bahwa penjualan terendah berada di bulan Februari Yaitu hanya mencapai 20.301,13 penjualan saja, Sedangkan Profit Terendah berada di Bulan April Yaitu Hanya Meraih Keuntungan Sebesar 933,29 Saja. Selanjutnya adalah penjualan Terbanyak berada di Bulan November yakni Mencapai Hingga 118.447,82 Penjualan ,Walaupun Dibulan November Terjadi Penjualan Terbanyak Bukan Berarti Meraih keuntungan Terbanyak Pula , Keuntungan Atau Profit Terbanyak Di Raih pada Bulan Maret Yakni Mencapai Keuntungan Sebesar 14.751,89</p>
</div>
</div>
</section>
<!-- Chart End -->
<!-- Contact Section start -->
<section id="contact" class="contact">
<h2>Contact Us</h2>
<div class="row">
<form id="contactForm" action="">
<div class="input-group">
<i data-feather="user"></i>
<input type="text" placeholder="Your Name Here" name="name" id="name" />
</div>
<div class="input-group">
<i data-feather="mail"></i>
<input type="email" placeholder="Your Email Here" name="email" id="email" />
</div>
<div class="input-group">
<i data-feather="phone"></i>
<input type="number" placeholder="Your Phone Number Here" name="phone" id="phone" />
</div>
<div class="input-group">
<i data-feather="message-circle"></i>
<input type="text" placeholder="Your Message Here" name="message" id="message" />
</div>
<button type="submit" class="btn" id="submit-btn">Submit</button>
</form>
</div>
</section>
<!-- Contact Section end -->
<!-- Popup Section start -->
<div class="popup" id="popup">
<img src="./img/ceklis.png" alt="Checked">
<h2>Thank You</h2>
<p>Your form have been successfully submitted. Thanks!</p>
<button class="pushable" onclick="closePopup()">
<span class="front">OK</span>
</button>
</div>
<div class="popup" id="error-popup">
<img src="./img/Error.png" alt="Error">
<h2>Error</h2>
<p>Please complete the contact form.</p>
<button class="pushable" onclick="closeErrorPopup()">
<span class="front">OK</span>
</button>
</div>
<!-- Popup Section end -->
<!-- Footer start -->
<footer>
<div class="socials">
<a href="#"><i data-feather="instagram"></i></a>
<a href="#"><i data-feather="twitter"></i></a>
<a href="#"><i data-feather="facebook"></i></a>
</div>
<div class="links">
<a href="#">Home</a>
<a href="#about">About</a>
<a href="#chart">Chart</a>
<a href="#table">Table</a>
<a href="#team">Team</a>
<a href="#contact">Contact</a>
</div>
<div class="credit">
<p>Created by <a href="">Team 14 Section Palembang</a>. ©2024.</p>
</div>
</footer>
<!-- Footer end -->
<!-- Feather Icons -->
<script>
feather.replace();
</script>
<!-- My Javascript -->
<script src="script.js"></script>
<script src="chart/chart.js"></script>
<script src="chart/profit_category.js"></script>
<script src="chart/profit_product.js"></script>
<script src="chart/totalCust.js"></script>
<script src="chart/profit_region.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</body>
</html>