-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
189 lines (186 loc) · 13.2 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="author" content="Wesley Victor Pereira Silva" />
<meta name="description" content="Projeto Dashboard - Sistema de gerenciamento de dados e estatísticas." />
<meta name="keywords" content="projeto, dashboard, gerenciamento, dados, estatísticas" />
<title>Projeto Dashboard</title>
<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:wght@500;600&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<nav class="mainNav">
<a href="index.html" class="mainNav_linkLogo">Dashboard</a>
<div class="mainNav_menus">
<ul class="mainNav_menu">
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M14.25 19.499V14.999C14.25 14.8001 14.171 14.6093 14.0303 14.4686C13.8897 14.328 13.6989 14.249 13.5 14.249H10.5C10.3011 14.249 10.1103 14.328 9.96967 14.4686C9.82902 14.6093 9.75 14.8001 9.75 14.999V19.499C9.75 19.6979 9.67098 19.8887 9.53033 20.0293C9.38968 20.17 9.19891 20.249 9 20.249H4.5C4.30109 20.249 4.11032 20.17 3.96967 20.0293C3.82902 19.8887 3.75 19.6979 3.75 19.499V10.8271C3.75168 10.7233 3.77411 10.6209 3.81597 10.5259C3.85783 10.4309 3.91828 10.3453 3.99375 10.274L11.4937 3.45836C11.632 3.33187 11.8126 3.26172 12 3.26172C12.1874 3.26172 12.368 3.33187 12.5062 3.45836L20.0062 10.274C20.0817 10.3453 20.1422 10.4309 20.184 10.5259C20.2259 10.6209 20.2483 10.7233 20.25 10.8271V19.499C20.25 19.6979 20.171 19.8887 20.0303 20.0293C19.8897 20.17 19.6989 20.249 19.5 20.249H15C14.8011 20.249 14.6103 20.17 14.4697 20.0293C14.329 19.8887 14.25 19.6979 14.25 19.499Z"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Dashboard
</a>
</li>
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M19.5 20.25H4.5C4.30109 20.25 4.11032 20.171 3.96967 20.0303C3.82902 19.8897 3.75 19.6989 3.75 19.5V6.75L5.25 3.75H18.75L20.25 6.75V19.5C20.25 19.6989 20.171 19.8897 20.0303 20.0303C19.8897 20.171 19.6989 20.25 19.5 20.25Z"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M8.82227 14.0703L12.0004 17.2484L15.1785 14.0703" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
<path d="M12 9.75V17.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M3.75 6.75H20.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>Announced
</a>
</li>
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 15H9V12L18 3L21 6L12 15Z" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
<path d="M15.75 5.25L18.75 8.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M20.25 11.25V19.5C20.25 19.6989 20.171 19.8897 20.0303 20.0303C19.8897 20.171 19.6989 20.25 19.5 20.25H4.5C4.30109 20.25 4.11032 20.171 3.96967 20.0303C3.82902 19.8897 3.75 19.6989 3.75 19.5V4.5C3.75 4.30109 3.82902 4.11032 3.96967 3.96967C4.11032 3.82902 4.30109 3.75 4.5 3.75H12.75"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Preparation
</a>
</li>
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 12H20.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M12 6H20.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M12 18H20.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M8.625 4.5L5.37187 7.5L3.75 6" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
<path d="M8.625 10.5L5.37187 13.5L3.75 12" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
<path d="M8.625 16.5L5.37187 19.5L3.75 18" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
</svg>Sorted
</a>
</li>
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M16.5 7.50002H20.4938C20.6432 7.49904 20.7894 7.54329 20.9132 7.62695C21.037 7.71061 21.1326 7.82977 21.1875 7.96877L22.5 11.25"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M1.5 13.5H16.5" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M17.625 20.25C18.8676 20.25 19.875 19.2426 19.875 18C19.875 16.7574 18.8676 15.75 17.625 15.75C16.3824 15.75 15.375 16.7574 15.375 18C15.375 19.2426 16.3824 20.25 17.625 20.25Z"
stroke="#5A5A5F" stroke-width="2" stroke-miterlimit="10" />
<path
d="M6.375 20.25C7.61764 20.25 8.625 19.2426 8.625 18C8.625 16.7574 7.61764 15.75 6.375 15.75C5.13236 15.75 4.125 16.7574 4.125 18C4.125 19.2426 5.13236 20.25 6.375 20.25Z"
stroke="#5A5A5F" stroke-width="2" stroke-miterlimit="10" />
<path d="M15.375 18H8.625" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M4.125 18H2.25C2.05109 18 1.86032 17.921 1.71967 17.7803C1.57902 17.6397 1.5 17.4489 1.5 17.25V6.75C1.5 6.55109 1.57902 6.36032 1.71967 6.21967C1.86032 6.07902 2.05109 6 2.25 6H16.5V16.05"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M16.5 11.25H22.5V17.25C22.5 17.4489 22.421 17.6397 22.2803 17.7803C22.1397 17.921 21.9489 18 21.75 18H19.875"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Distributed
</a>
</li>
</ul>
<ul class="mainNav_menu">
<li>
<a href="#">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.3125 8.0625L20.25 12L16.3125 15.9375" stroke="#5A5A5F" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" />
<path d="M9.75 12H20.25" stroke="#5A5A5F" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M9.75 20.25H4.5C4.30109 20.25 4.11032 20.171 3.96967 20.0303C3.82902 19.8897 3.75 19.6989 3.75 19.5V4.5C3.75 4.30109 3.82902 4.11032 3.96967 3.96967C4.11032 3.82902 4.30109 3.75 4.5 3.75H9.75"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Logout
</a>
</li>
</ul>
</div>
</nav>
<header class="topnav">
<nav>
<ul class="topnav_menu">
<li>
<a href="#">
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M12 15.5C15.3137 15.5 18 12.8137 18 9.5C18 6.18629 15.3137 3.5 12 3.5C8.68629 3.5 6 6.18629 6 9.5C6 12.8137 8.68629 15.5 12 15.5Z"
stroke="#5A5A5F" stroke-width="2" stroke-miterlimit="10" />
<path
d="M2.90625 20.7508C3.82775 19.1544 5.15328 17.8287 6.74958 16.907C8.34588 15.9853 10.1567 15.5 12 15.5C13.8433 15.5 15.6541 15.9853 17.2504 16.907C18.8467 17.8287 20.1722 19.1544 21.0938 20.7508"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Profile
</a>
</li>
<li>
<a href="#">
<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M12.4972 17C14.9825 17 16.9972 14.9853 16.9972 12.5C16.9972 10.0147 14.9825 8 12.4972 8C10.0119 8 7.99719 10.0147 7.99719 12.5C7.99719 14.9853 10.0119 17 12.4972 17Z"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M17.7195 6.60156C17.957 6.82031 18.182 7.04531 18.3945 7.27656L20.9538 7.64219C21.3708 8.36641 21.6923 9.14161 21.9101 9.94844L20.3538 12.0203C20.3538 12.0203 20.382 12.6578 20.3538 12.9766L21.9101 15.0484C21.6933 15.8556 21.3718 16.6309 20.9538 17.3547L18.3945 17.7203C18.3945 17.7203 17.9538 18.1797 17.7195 18.3953L17.3538 20.9547C16.6296 21.3717 15.8544 21.6931 15.0476 21.9109L12.9757 20.3547C12.6576 20.3828 12.3376 20.3828 12.0195 20.3547L9.94758 21.9109C9.14042 21.6941 8.36509 21.3727 7.64133 20.9547L7.27571 18.3953C7.04446 18.1766 6.81946 17.9516 6.60071 17.7203L4.04133 17.3547C3.62432 16.6305 3.30289 15.8553 3.08508 15.0484L4.64133 12.9766C4.64133 12.9766 4.61321 12.3391 4.64133 12.0203L3.08508 9.94844C3.30188 9.14127 3.62336 8.36594 4.04133 7.64219L6.60071 7.27656C6.81946 7.04531 7.04446 6.82031 7.27571 6.60156L7.64133 4.04219C8.36556 3.62517 9.14076 3.30375 9.94758 3.08594L12.0195 4.64219C12.3376 4.61406 12.6576 4.61406 12.9757 4.64219L15.0476 3.08594C15.8547 3.30274 16.6301 3.62421 17.3538 4.04219L17.7195 6.60156Z"
stroke="#5A5A5F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>Settings
</a>
</li>
</ul>
</nav>
<section class="perfil">
<div class="perfil_thumb">
<img src="img/perfil.png" alt="Wesley Victor" />
</div>
<div>
<div class="perfil_name">Wesley Victor</div>
<div class="perfil_rule">Front-end</div>
</div>
</section>
</header>
<main>
<section class="summary">
<article>
<span class="summary_description">Announced Today</span>
<span class="summary_number">235600</span>
</article>
<div class="summary_separated"></div>
<article>
<span class="summary_description">Prepared Today</span>
<span class="summary_number">16738</span>
</article>
<div class="summary_separated"></div>
<article>
<span class="summary_description">Sorted Today</span>
<span class="summary_number">286</span>
</article>
<a href="#" class="btn summary_btn">See more</a>
</section>
<figure>
<img src="img/chart1.png" alt="Chart 1" />
</figure>
<figure class="grid-half">
<img src="img/chart2.png" alt="Chart 2" />
</figure>
<figure class="grid-half">
<img src="img/chart3.png" alt="Chart 3" />
</figure>
</main>
</body>
</html>