Code Coverage
 
Lines
Functions and Methods
Classes and Traits
Total
0.00% covered (danger)
0.00%
0 / 551
n/a
0 / 0
CRAP
n/a
0 / 0
1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5    <meta charset="utf-8">
6    <meta http-equiv="X-UA-Compatible" content="IE=edge">
7    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
8    <meta name="description" content="Responsive Admin &amp; Dashboard Template based on Bootstrap 5">
9    <meta name="author" content="AdminKit">
10    <meta name="keywords" content="adminkit, bootstrap, bootstrap 5, admin, dashboard, template, responsive, css, sass, html, theme, front-end, ui kit, web">
11
12    <link rel="preconnect" href="https://fonts.gstatic.com">
13    <link rel="shortcut icon" href="img/icons/icon-48x48.png" />
14
15    <link rel="canonical" href="https://demo-basic.adminkit.io/" />
16
17    <title>AdminKit Demo - Bootstrap 5 Admin Template</title>
18
19    <link href="css/app.css" rel="stylesheet">
20    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap" rel="stylesheet">
21</head>
22
23<body>
24    <div class="wrapper">
25        <nav id="sidebar" class="sidebar js-sidebar">
26            <div class="sidebar-content js-simplebar">
27                <a class="sidebar-brand" href="index.html">
28          <span class="align-middle">AdminKit</span>
29        </a>
30
31                <ul class="sidebar-nav">
32                    <li class="sidebar-header">
33                        Pages
34                    </li>
35
36                    <li class="sidebar-item active">
37                        <a class="sidebar-link" href="index.html">
38              <i class="align-middle" data-feather="sliders"></i> <span class="align-middle">Dashboard</span>
39            </a>
40                    </li>
41
42                    <li class="sidebar-item">
43                        <a class="sidebar-link" href="pages-profile.html">
44              <i class="align-middle" data-feather="user"></i> <span class="align-middle">Profile</span>
45            </a>
46                    </li>
47
48                    <li class="sidebar-item">
49                        <a class="sidebar-link" href="pages-sign-in.html">
50              <i class="align-middle" data-feather="log-in"></i> <span class="align-middle">Sign In</span>
51            </a>
52                    </li>
53
54                    <li class="sidebar-item">
55                        <a class="sidebar-link" href="pages-sign-up.html">
56              <i class="align-middle" data-feather="user-plus"></i> <span class="align-middle">Sign Up</span>
57            </a>
58                    </li>
59
60                    <li class="sidebar-item">
61                        <a class="sidebar-link" href="pages-blank.html">
62              <i class="align-middle" data-feather="book"></i> <span class="align-middle">Blank</span>
63            </a>
64                    </li>
65
66                    <li class="sidebar-header">
67                        Tools & Components
68                    </li>
69
70                    <li class="sidebar-item">
71                        <a class="sidebar-link" href="ui-buttons.html">
72              <i class="align-middle" data-feather="square"></i> <span class="align-middle">Buttons</span>
73            </a>
74                    </li>
75
76                    <li class="sidebar-item">
77                        <a class="sidebar-link" href="ui-forms.html">
78              <i class="align-middle" data-feather="check-square"></i> <span class="align-middle">Forms</span>
79            </a>
80                    </li>
81
82                    <li class="sidebar-item">
83                        <a class="sidebar-link" href="ui-cards.html">
84              <i class="align-middle" data-feather="grid"></i> <span class="align-middle">Cards</span>
85            </a>
86                    </li>
87
88                    <li class="sidebar-item">
89                        <a class="sidebar-link" href="ui-typography.html">
90              <i class="align-middle" data-feather="align-left"></i> <span class="align-middle">Typography</span>
91            </a>
92                    </li>
93
94                    <li class="sidebar-item">
95                        <a class="sidebar-link" href="icons-feather.html">
96              <i class="align-middle" data-feather="coffee"></i> <span class="align-middle">Icons</span>
97            </a>
98                    </li>
99
100                    <li class="sidebar-header">
101                        Plugins & Addons
102                    </li>
103
104                    <li class="sidebar-item">
105                        <a class="sidebar-link" href="charts-chartjs.html">
106              <i class="align-middle" data-feather="bar-chart-2"></i> <span class="align-middle">Charts</span>
107            </a>
108                    </li>
109
110                    <li class="sidebar-item">
111                        <a class="sidebar-link" href="maps-google.html">
112              <i class="align-middle" data-feather="map"></i> <span class="align-middle">Maps</span>
113            </a>
114                    </li>
115                </ul>
116
117                <div class="sidebar-cta">
118                    <div class="sidebar-cta-content">
119                        <strong class="d-inline-block mb-2">Upgrade to Pro</strong>
120                        <div class="mb-3 text-sm">
121                            Are you looking for more components? Check out our premium version.
122                        </div>
123                        <div class="d-grid">
124                            <a href="upgrade-to-pro.html" class="btn btn-primary">Upgrade to Pro</a>
125                        </div>
126                    </div>
127                </div>
128            </div>
129        </nav>
130
131        <div class="main">
132            <nav class="navbar navbar-expand navbar-light navbar-bg">
133                <a class="sidebar-toggle js-sidebar-toggle">
134          <i class="hamburger align-self-center"></i>
135        </a>
136
137                <div class="navbar-collapse collapse">
138                    <ul class="navbar-nav navbar-align">
139                        <li class="nav-item dropdown">
140                            <a class="nav-icon dropdown-toggle" href="#" id="alertsDropdown" data-bs-toggle="dropdown">
141                                <div class="position-relative">
142                                    <i class="align-middle" data-feather="bell"></i>
143                                    <span class="indicator">4</span>
144                                </div>
145                            </a>
146                            <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end py-0" aria-labelledby="alertsDropdown">
147                                <div class="dropdown-menu-header">
148                                    4 New Notifications
149                                </div>
150                                <div class="list-group">
151                                    <a href="#" class="list-group-item">
152                                        <div class="row g-0 align-items-center">
153                                            <div class="col-2">
154                                                <i class="text-danger" data-feather="alert-circle"></i>
155                                            </div>
156                                            <div class="col-10">
157                                                <div class="text-dark">Update completed</div>
158                                                <div class="text-muted small mt-1">Restart server 12 to complete the update.</div>
159                                                <div class="text-muted small mt-1">30m ago</div>
160                                            </div>
161                                        </div>
162                                    </a>
163                                    <a href="#" class="list-group-item">
164                                        <div class="row g-0 align-items-center">
165                                            <div class="col-2">
166                                                <i class="text-warning" data-feather="bell"></i>
167                                            </div>
168                                            <div class="col-10">
169                                                <div class="text-dark">Lorem ipsum</div>
170                                                <div class="text-muted small mt-1">Aliquam ex eros, imperdiet vulputate hendrerit et.</div>
171                                                <div class="text-muted small mt-1">2h ago</div>
172                                            </div>
173                                        </div>
174                                    </a>
175                                    <a href="#" class="list-group-item">
176                                        <div class="row g-0 align-items-center">
177                                            <div class="col-2">
178                                                <i class="text-primary" data-feather="home"></i>
179                                            </div>
180                                            <div class="col-10">
181                                                <div class="text-dark">Login from 192.186.1.8</div>
182                                                <div class="text-muted small mt-1">5h ago</div>
183                                            </div>
184                                        </div>
185                                    </a>
186                                    <a href="#" class="list-group-item">
187                                        <div class="row g-0 align-items-center">
188                                            <div class="col-2">
189                                                <i class="text-success" data-feather="user-plus"></i>
190                                            </div>
191                                            <div class="col-10">
192                                                <div class="text-dark">New connection</div>
193                                                <div class="text-muted small mt-1">Christina accepted your request.</div>
194                                                <div class="text-muted small mt-1">14h ago</div>
195                                            </div>
196                                        </div>
197                                    </a>
198                                </div>
199                                <div class="dropdown-menu-footer">
200                                    <a href="#" class="text-muted">Show all notifications</a>
201                                </div>
202                            </div>
203                        </li>
204                        <li class="nav-item dropdown">
205                            <a class="nav-icon dropdown-toggle" href="#" id="messagesDropdown" data-bs-toggle="dropdown">
206                                <div class="position-relative">
207                                    <i class="align-middle" data-feather="message-square"></i>
208                                </div>
209                            </a>
210                            <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end py-0" aria-labelledby="messagesDropdown">
211                                <div class="dropdown-menu-header">
212                                    <div class="position-relative">
213                                        4 New Messages
214                                    </div>
215                                </div>
216                                <div class="list-group">
217                                    <a href="#" class="list-group-item">
218                                        <div class="row g-0 align-items-center">
219                                            <div class="col-2">
220                                                <img src="img/avatars/avatar-5.jpg" class="avatar img-fluid rounded-circle" alt="Vanessa Tucker">
221                                            </div>
222                                            <div class="col-10 ps-2">
223                                                <div class="text-dark">Vanessa Tucker</div>
224                                                <div class="text-muted small mt-1">Nam pretium turpis et arcu. Duis arcu tortor.</div>
225                                                <div class="text-muted small mt-1">15m ago</div>
226                                            </div>
227                                        </div>
228                                    </a>
229                                    <a href="#" class="list-group-item">
230                                        <div class="row g-0 align-items-center">
231                                            <div class="col-2">
232                                                <img src="img/avatars/avatar-2.jpg" class="avatar img-fluid rounded-circle" alt="William Harris">
233                                            </div>
234                                            <div class="col-10 ps-2">
235                                                <div class="text-dark">William Harris</div>
236                                                <div class="text-muted small mt-1">Curabitur ligula sapien euismod vitae.</div>
237                                                <div class="text-muted small mt-1">2h ago</div>
238                                            </div>
239                                        </div>
240                                    </a>
241                                    <a href="#" class="list-group-item">
242                                        <div class="row g-0 align-items-center">
243                                            <div class="col-2">
244                                                <img src="img/avatars/avatar-4.jpg" class="avatar img-fluid rounded-circle" alt="Christina Mason">
245                                            </div>
246                                            <div class="col-10 ps-2">
247                                                <div class="text-dark">Christina Mason</div>
248                                                <div class="text-muted small mt-1">Pellentesque auctor neque nec urna.</div>
249                                                <div class="text-muted small mt-1">4h ago</div>
250                                            </div>
251                                        </div>
252                                    </a>
253                                    <a href="#" class="list-group-item">
254                                        <div class="row g-0 align-items-center">
255                                            <div class="col-2">
256                                                <img src="img/avatars/avatar-3.jpg" class="avatar img-fluid rounded-circle" alt="Sharon Lessman">
257                                            </div>
258                                            <div class="col-10 ps-2">
259                                                <div class="text-dark">Sharon Lessman</div>
260                                                <div class="text-muted small mt-1">Aenean tellus metus, bibendum sed, posuere ac, mattis non.</div>
261                                                <div class="text-muted small mt-1">5h ago</div>
262                                            </div>
263                                        </div>
264                                    </a>
265                                </div>
266                                <div class="dropdown-menu-footer">
267                                    <a href="#" class="text-muted">Show all messages</a>
268                                </div>
269                            </div>
270                        </li>
271                        <li class="nav-item dropdown">
272                            <a class="nav-icon dropdown-toggle d-inline-block d-sm-none" href="#" data-bs-toggle="dropdown">
273                <i class="align-middle" data-feather="settings"></i>
274              </a>
275
276                            <a class="nav-link dropdown-toggle d-none d-sm-inline-block" href="#" data-bs-toggle="dropdown">
277                <img src="img/avatars/avatar.jpg" class="avatar img-fluid rounded me-1" alt="Charles Hall" /> <span class="text-dark">Charles Hall</span>
278              </a>
279                            <div class="dropdown-menu dropdown-menu-end">
280                                <a class="dropdown-item" href="pages-profile.html"><i class="align-middle me-1" data-feather="user"></i> Profile</a>
281                                <a class="dropdown-item" href="#"><i class="align-middle me-1" data-feather="pie-chart"></i> Analytics</a>
282                                <div class="dropdown-divider"></div>
283                                <a class="dropdown-item" href="index.html"><i class="align-middle me-1" data-feather="settings"></i> Settings & Privacy</a>
284                                <a class="dropdown-item" href="#"><i class="align-middle me-1" data-feather="help-circle"></i> Help Center</a>
285                                <div class="dropdown-divider"></div>
286                                <a class="dropdown-item" href="#">Log out</a>
287                            </div>
288                        </li>
289                    </ul>
290                </div>
291            </nav>
292
293            <main class="content">
294                <div class="container-fluid p-0">
295
296                    <h1 class="h3 mb-3"><strong>Analytics</strong> Dashboard</h1>
297
298                    <div class="row">
299                        <div class="col-xl-6 col-xxl-5 d-flex">
300                            <div class="w-100">
301                                <div class="row">
302                                    <div class="col-sm-6">
303                                        <div class="card">
304                                            <div class="card-body">
305                                                <div class="row">
306                                                    <div class="col mt-0">
307                                                        <h5 class="card-title">Sales</h5>
308                                                    </div>
309
310                                                    <div class="col-auto">
311                                                        <div class="stat text-primary">
312                                                            <i class="align-middle" data-feather="truck"></i>
313                                                        </div>
314                                                    </div>
315                                                </div>
316                                                <h1 class="mt-1 mb-3">2.382</h1>
317                                                <div class="mb-0">
318                                                    <span class="text-danger"> <i class="mdi mdi-arrow-bottom-right"></i> -3.65% </span>
319                                                    <span class="text-muted">Since last week</span>
320                                                </div>
321                                            </div>
322                                        </div>
323                                        <div class="card">
324                                            <div class="card-body">
325                                                <div class="row">
326                                                    <div class="col mt-0">
327                                                        <h5 class="card-title">Visitors</h5>
328                                                    </div>
329
330                                                    <div class="col-auto">
331                                                        <div class="stat text-primary">
332                                                            <i class="align-middle" data-feather="users"></i>
333                                                        </div>
334                                                    </div>
335                                                </div>
336                                                <h1 class="mt-1 mb-3">14.212</h1>
337                                                <div class="mb-0">
338                                                    <span class="text-success"> <i class="mdi mdi-arrow-bottom-right"></i> 5.25% </span>
339                                                    <span class="text-muted">Since last week</span>
340                                                </div>
341                                            </div>
342                                        </div>
343                                    </div>
344                                    <div class="col-sm-6">
345                                        <div class="card">
346                                            <div class="card-body">
347                                                <div class="row">
348                                                    <div class="col mt-0">
349                                                        <h5 class="card-title">Earnings</h5>
350                                                    </div>
351
352                                                    <div class="col-auto">
353                                                        <div class="stat text-primary">
354                                                            <i class="align-middle" data-feather="dollar-sign"></i>
355                                                        </div>
356                                                    </div>
357                                                </div>
358                                                <h1 class="mt-1 mb-3">$21.300</h1>
359                                                <div class="mb-0">
360                                                    <span class="text-success"> <i class="mdi mdi-arrow-bottom-right"></i> 6.65% </span>
361                                                    <span class="text-muted">Since last week</span>
362                                                </div>
363                                            </div>
364                                        </div>
365                                        <div class="card">
366                                            <div class="card-body">
367                                                <div class="row">
368                                                    <div class="col mt-0">
369                                                        <h5 class="card-title">Orders</h5>
370                                                    </div>
371
372                                                    <div class="col-auto">
373                                                        <div class="stat text-primary">
374                                                            <i class="align-middle" data-feather="shopping-cart"></i>
375                                                        </div>
376                                                    </div>
377                                                </div>
378                                                <h1 class="mt-1 mb-3">64</h1>
379                                                <div class="mb-0">
380                                                    <span class="text-danger"> <i class="mdi mdi-arrow-bottom-right"></i> -2.25% </span>
381                                                    <span class="text-muted">Since last week</span>
382                                                </div>
383                                            </div>
384                                        </div>
385                                    </div>
386                                </div>
387                            </div>
388                        </div>
389
390                        <div class="col-xl-6 col-xxl-7">
391                            <div class="card flex-fill w-100">
392                                <div class="card-header">
393
394                                    <h5 class="card-title mb-0">Recent Movement</h5>
395                                </div>
396                                <div class="card-body py-3">
397                                    <div class="chart chart-sm">
398                                        <canvas id="chartjs-dashboard-line"></canvas>
399                                    </div>
400                                </div>
401                            </div>
402                        </div>
403                    </div>
404
405                    <div class="row">
406                        <div class="col-12 col-md-6 col-xxl-3 d-flex order-2 order-xxl-3">
407                            <div class="card flex-fill w-100">
408                                <div class="card-header">
409
410                                    <h5 class="card-title mb-0">Browser Usage</h5>
411                                </div>
412                                <div class="card-body d-flex">
413                                    <div class="align-self-center w-100">
414                                        <div class="py-3">
415                                            <div class="chart chart-xs">
416                                                <canvas id="chartjs-dashboard-pie"></canvas>
417                                            </div>
418                                        </div>
419
420                                        <table class="table mb-0">
421                                            <tbody>
422                                                <tr>
423                                                    <td>Chrome</td>
424                                                    <td class="text-end">4306</td>
425                                                </tr>
426                                                <tr>
427                                                    <td>Firefox</td>
428                                                    <td class="text-end">3801</td>
429                                                </tr>
430                                                <tr>
431                                                    <td>IE</td>
432                                                    <td class="text-end">1689</td>
433                                                </tr>
434                                            </tbody>
435                                        </table>
436                                    </div>
437                                </div>
438                            </div>
439                        </div>
440                        <div class="col-12 col-md-12 col-xxl-6 d-flex order-3 order-xxl-2">
441                            <div class="card flex-fill w-100">
442                                <div class="card-header">
443
444                                    <h5 class="card-title mb-0">Real-Time</h5>
445                                </div>
446                                <div class="card-body px-4">
447                                    <div id="world_map" style="height:350px;"></div>
448                                </div>
449                            </div>
450                        </div>
451                        <div class="col-12 col-md-6 col-xxl-3 d-flex order-1 order-xxl-1">
452                            <div class="card flex-fill">
453                                <div class="card-header">
454
455                                    <h5 class="card-title mb-0">Calendar</h5>
456                                </div>
457                                <div class="card-body d-flex">
458                                    <div class="align-self-center w-100">
459                                        <div class="chart">
460                                            <div id="datetimepicker-dashboard"></div>
461                                        </div>
462                                    </div>
463                                </div>
464                            </div>
465                        </div>
466                    </div>
467
468                    <div class="row">
469                        <div class="col-12 col-lg-8 col-xxl-9 d-flex">
470                            <div class="card flex-fill">
471                                <div class="card-header">
472
473                                    <h5 class="card-title mb-0">Latest Projects</h5>
474                                </div>
475                                <table class="table table-hover my-0">
476                                    <thead>
477                                        <tr>
478                                            <th>Name</th>
479                                            <th class="d-none d-xl-table-cell">Start Date</th>
480                                            <th class="d-none d-xl-table-cell">End Date</th>
481                                            <th>Status</th>
482                                            <th class="d-none d-md-table-cell">Assignee</th>
483                                        </tr>
484                                    </thead>
485                                    <tbody>
486                                        <tr>
487                                            <td>Project Apollo</td>
488                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
489                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
490                                            <td><span class="badge bg-success">Done</span></td>
491                                            <td class="d-none d-md-table-cell">Vanessa Tucker</td>
492                                        </tr>
493                                        <tr>
494                                            <td>Project Fireball</td>
495                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
496                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
497                                            <td><span class="badge bg-danger">Cancelled</span></td>
498                                            <td class="d-none d-md-table-cell">William Harris</td>
499                                        </tr>
500                                        <tr>
501                                            <td>Project Hades</td>
502                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
503                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
504                                            <td><span class="badge bg-success">Done</span></td>
505                                            <td class="d-none d-md-table-cell">Sharon Lessman</td>
506                                        </tr>
507                                        <tr>
508                                            <td>Project Nitro</td>
509                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
510                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
511                                            <td><span class="badge bg-warning">In progress</span></td>
512                                            <td class="d-none d-md-table-cell">Vanessa Tucker</td>
513                                        </tr>
514                                        <tr>
515                                            <td>Project Phoenix</td>
516                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
517                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
518                                            <td><span class="badge bg-success">Done</span></td>
519                                            <td class="d-none d-md-table-cell">William Harris</td>
520                                        </tr>
521                                        <tr>
522                                            <td>Project X</td>
523                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
524                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
525                                            <td><span class="badge bg-success">Done</span></td>
526                                            <td class="d-none d-md-table-cell">Sharon Lessman</td>
527                                        </tr>
528                                        <tr>
529                                            <td>Project Romeo</td>
530                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
531                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
532                                            <td><span class="badge bg-success">Done</span></td>
533                                            <td class="d-none d-md-table-cell">Christina Mason</td>
534                                        </tr>
535                                        <tr>
536                                            <td>Project Wombat</td>
537                                            <td class="d-none d-xl-table-cell">01/01/2023</td>
538                                            <td class="d-none d-xl-table-cell">31/06/2023</td>
539                                            <td><span class="badge bg-warning">In progress</span></td>
540                                            <td class="d-none d-md-table-cell">William Harris</td>
541                                        </tr>
542                                    </tbody>
543                                </table>
544                            </div>
545                        </div>
546                        <div class="col-12 col-lg-4 col-xxl-3 d-flex">
547                            <div class="card flex-fill w-100">
548                                <div class="card-header">
549
550                                    <h5 class="card-title mb-0">Monthly Sales</h5>
551                                </div>
552                                <div class="card-body d-flex w-100">
553                                    <div class="align-self-center chart chart-lg">
554                                        <canvas id="chartjs-dashboard-bar"></canvas>
555                                    </div>
556                                </div>
557                            </div>
558                        </div>
559                    </div>
560
561                </div>
562            </main>
563
564            <footer class="footer">
565                <div class="container-fluid">
566                    <div class="row text-muted">
567                        <div class="col-6 text-start">
568                            <p class="mb-0">
569                                <a class="text-muted" href="https://adminkit.io/" target="_blank"><strong>AdminKit</strong></a> - <a class="text-muted" href="https://adminkit.io/" target="_blank"><strong>Bootstrap Admin Template</strong></a>                                &copy;
570                            </p>
571                        </div>
572                        <div class="col-6 text-end">
573                            <ul class="list-inline">
574                                <li class="list-inline-item">
575                                    <a class="text-muted" href="https://adminkit.io/" target="_blank">Support</a>
576                                </li>
577                                <li class="list-inline-item">
578                                    <a class="text-muted" href="https://adminkit.io/" target="_blank">Help Center</a>
579                                </li>
580                                <li class="list-inline-item">
581                                    <a class="text-muted" href="https://adminkit.io/" target="_blank">Privacy</a>
582                                </li>
583                                <li class="list-inline-item">
584                                    <a class="text-muted" href="https://adminkit.io/" target="_blank">Terms</a>
585                                </li>
586                            </ul>
587                        </div>
588                    </div>
589                </div>
590            </footer>
591        </div>
592    </div>
593
594    <script src="js/app.js"></script>
595
596
597</body>
598
599</html>