-
Notifications
You must be signed in to change notification settings - Fork 50
/
index.html
1176 lines (1150 loc) · 71.3 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
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!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">
<title>Eatio - Restaurant Food Order Bootstrap Admin Dashboard</title>
<!-- Favicon icon -->
<link rel="icon" type="image/png" sizes="16x16" href="./images/favicon.png">
<link href="./vendor/jqvmap/css/jqvmap.min.css" rel="stylesheet">
<link rel="stylesheet" href="./vendor/chartist/css/chartist.min.css">
<link href="./vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="./css/style.css" rel="stylesheet">
<link href="https://cdn.lineicons.com/2.0/LineIcons.css" rel="stylesheet">
</head>
<body>
<!--*******************
Preloader start
********************-->
<div id="preloader">
<div class="sk-three-bounce">
<div class="sk-child sk-bounce1"></div>
<div class="sk-child sk-bounce2"></div>
<div class="sk-child sk-bounce3"></div>
</div>
</div>
<!--*******************
Preloader end
********************-->
<!--**********************************
Main wrapper start
***********************************-->
<div id="main-wrapper">
<!--**********************************
Nav header start
***********************************-->
<div class="nav-header">
<a href="index.html" class="brand-logo">
<img class="logo-abbr" src="./images/logo.png" alt="">
<img class="logo-compact" src="./images/logo-text.png" alt="">
<img class="brand-title" src="./images/logo-text.png" alt="">
</a>
<div class="nav-control">
<div class="hamburger">
<span class="line"></span><span class="line"></span><span class="line"></span>
</div>
</div>
</div>
<!--**********************************
Nav header end
***********************************-->
<!--**********************************
Chat box start
***********************************-->
<div class="chatbox">
<div class="chatbox-close"></div>
<div class="custom-tab-1">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#notes">Notes</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#alerts">Alerts</a>
</li>
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#chat">Chat</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane fade active show" id="chat" role="tabpanel">
<div class="card mb-sm-3 mb-md-0 contacts_card dz-chat-user-box">
<div class="card-header chat-list-header text-center">
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect fill="#000000" x="4" y="11" width="16" height="2" rx="1"/><rect fill="#000000" opacity="0.3" transform="translate(12.000000, 12.000000) rotate(-270.000000) translate(-12.000000, -12.000000) " x="4" y="11" width="16" height="2" rx="1"/></g></svg></a>
<div>
<h6 class="mb-1">Chat List</h6>
<p class="mb-0">Show All</p>
</div>
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect x="0" y="0" width="24" height="24"/><circle fill="#000000" cx="5" cy="12" r="2"/><circle fill="#000000" cx="12" cy="12" r="2"/><circle fill="#000000" cx="19" cy="12" r="2"/></g></svg></a>
</div>
<div class="card-body contacts_body p-0 dz-scroll " id="DZ_W_Contacts_Body">
<ul class="contacts">
<li class="name-first-letter">A</li>
<li class="active dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/1.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>Kelvin Conrad</span>
<p>Donald is online</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/2.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Alfie Mason</span>
<p>Taherah left 7 mins ago</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/3.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>AharlieKane</span>
<p>Sami is online</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/4.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Athan Jacoby</span>
<p>Nargis left 30 mins ago</p>
</div>
</div>
</li>
<li class="name-first-letter">B</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/5.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Bashid Samim</span>
<p>Rashid left 50 mins ago</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/1.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>Breddie Ronan</span>
<p>Kalid is online</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/2.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Ceorge Carson</span>
<p>Taherah left 7 mins ago</p>
</div>
</div>
</li>
<li class="name-first-letter">D</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/3.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>Darry Parker</span>
<p>Sami is online</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/4.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Denry Hunter</span>
<p>Nargis left 30 mins ago</p>
</div>
</div>
</li>
<li class="name-first-letter">J</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/5.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Jack Ronan</span>
<p>Rashid left 50 mins ago</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/1.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>Jacob Tucker</span>
<p>Kalid is online</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/2.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>James Logan</span>
<p>Taherah left 7 mins ago</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/3.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon"></span>
</div>
<div class="user_info">
<span>Joshua Weston</span>
<p>Sami is online</p>
</div>
</div>
</li>
<li class="name-first-letter">O</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/4.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Oliver Acker</span>
<p>Nargis left 30 mins ago</p>
</div>
</div>
</li>
<li class="dz-chat-user">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="images/avatar/5.jpg" class="rounded-circle user_img" alt=""/>
<span class="online_icon offline"></span>
</div>
<div class="user_info">
<span>Oscar Weston</span>
<p>Rashid left 50 mins ago</p>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="card chat dz-chat-history-box d-none">
<div class="card-header chat-list-header text-center">
<a href="#" class="dz-chat-history-back">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><polygon points="0 0 24 0 24 24 0 24"/><rect fill="#000000" opacity="0.3" transform="translate(15.000000, 12.000000) scale(-1, 1) rotate(-90.000000) translate(-15.000000, -12.000000) " x="14" y="7" width="2" height="10" rx="1"/><path d="M3.7071045,15.7071045 C3.3165802,16.0976288 2.68341522,16.0976288 2.29289093,15.7071045 C1.90236664,15.3165802 1.90236664,14.6834152 2.29289093,14.2928909 L8.29289093,8.29289093 C8.67146987,7.914312 9.28105631,7.90106637 9.67572234,8.26284357 L15.6757223,13.7628436 C16.0828413,14.136036 16.1103443,14.7686034 15.7371519,15.1757223 C15.3639594,15.5828413 14.7313921,15.6103443 14.3242731,15.2371519 L9.03007346,10.3841355 L3.7071045,15.7071045 Z" fill="#000000" fill-rule="nonzero" transform="translate(9.000001, 11.999997) scale(-1, -1) rotate(90.000000) translate(-9.000001, -11.999997) "/></g></svg>
</a>
<div>
<h6 class="mb-1">Chat with Khelesh</h6>
<p class="mb-0 text-success">Online</p>
</div>
<div class="dropdown">
<a href="#" data-toggle="dropdown" aria-expanded="false"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect x="0" y="0" width="24" height="24"/><circle fill="#000000" cx="5" cy="12" r="2"/><circle fill="#000000" cx="12" cy="12" r="2"/><circle fill="#000000" cx="19" cy="12" r="2"/></g></svg></a>
<ul class="dropdown-menu dropdown-menu-right">
<li class="dropdown-item"><i class="fa fa-user-circle text-primary mr-2"></i> View profile</li>
<li class="dropdown-item"><i class="fa fa-users text-primary mr-2"></i> Add to close friends</li>
<li class="dropdown-item"><i class="fa fa-plus text-primary mr-2"></i> Add to group</li>
<li class="dropdown-item"><i class="fa fa-ban text-primary mr-2"></i> Block</li>
</ul>
</div>
</div>
<div class="card-body msg_card_body dz-scroll" id="DZ_W_Contacts_Body3">
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
Hi, how are you samim?
<span class="msg_time">8:40 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
Hi Khalid i am good tnx how about you?
<span class="msg_time_send">8:55 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
I am good too, thank you for your chat template
<span class="msg_time">9:00 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
You are welcome
<span class="msg_time_send">9:05 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
I am looking for your next templates
<span class="msg_time">9:07 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
Ok, thank you have a good day
<span class="msg_time_send">9:10 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
Bye, see you
<span class="msg_time">9:12 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
Hi, how are you samim?
<span class="msg_time">8:40 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
Hi Khalid i am good tnx how about you?
<span class="msg_time_send">8:55 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
I am good too, thank you for your chat template
<span class="msg_time">9:00 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
You are welcome
<span class="msg_time_send">9:05 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
I am looking for your next templates
<span class="msg_time">9:07 AM, Today</span>
</div>
</div>
<div class="d-flex justify-content-end mb-4">
<div class="msg_cotainer_send">
Ok, thank you have a good day
<span class="msg_time_send">9:10 AM, Today</span>
</div>
<div class="img_cont_msg">
<img src="images/avatar/2.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
</div>
<div class="d-flex justify-content-start mb-4">
<div class="img_cont_msg">
<img src="images/avatar/1.jpg" class="rounded-circle user_img_msg" alt=""/>
</div>
<div class="msg_cotainer">
Bye, see you
<span class="msg_time">9:12 AM, Today</span>
</div>
</div>
</div>
<div class="card-footer type_msg">
<div class="input-group">
<textarea class="form-control" placeholder="Type your message..."></textarea>
<div class="input-group-append">
<button type="button" class="btn btn-primary"><i class="fa fa-location-arrow"></i></button>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="alerts" role="tabpanel">
<div class="card mb-sm-3 mb-md-0 contacts_card">
<div class="card-header chat-list-header text-center">
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect x="0" y="0" width="24" height="24"/><circle fill="#000000" cx="5" cy="12" r="2"/><circle fill="#000000" cx="12" cy="12" r="2"/><circle fill="#000000" cx="19" cy="12" r="2"/></g></svg></a>
<div>
<h6 class="mb-1">Notications</h6>
<p class="mb-0">Show All</p>
</div>
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect x="0" y="0" width="24" height="24"/><path d="M14.2928932,16.7071068 C13.9023689,16.3165825 13.9023689,15.6834175 14.2928932,15.2928932 C14.6834175,14.9023689 15.3165825,14.9023689 15.7071068,15.2928932 L19.7071068,19.2928932 C20.0976311,19.6834175 20.0976311,20.3165825 19.7071068,20.7071068 C19.3165825,21.0976311 18.6834175,21.0976311 18.2928932,20.7071068 L14.2928932,16.7071068 Z" fill="#000000" fill-rule="nonzero" opacity="0.3"/><path d="M11,16 C13.7614237,16 16,13.7614237 16,11 C16,8.23857625 13.7614237,6 11,6 C8.23857625,6 6,8.23857625 6,11 C6,13.7614237 8.23857625,16 11,16 Z M11,18 C7.13400675,18 4,14.8659932 4,11 C4,7.13400675 7.13400675,4 11,4 C14.8659932,4 18,7.13400675 18,11 C18,14.8659932 14.8659932,18 11,18 Z" fill="#000000" fill-rule="nonzero"/></g></svg></a>
</div>
<div class="card-body contacts_body p-0 dz-scroll" id="DZ_W_Contacts_Body1">
<ul class="contacts">
<li class="name-first-letter">SEVER STATUS</li>
<li class="active">
<div class="d-flex bd-highlight">
<div class="img_cont primary">KK</div>
<div class="user_info">
<span>David Nester Birthday</span>
<p class="text-primary">Today</p>
</div>
</div>
</li>
<li class="name-first-letter">SOCIAL</li>
<li>
<div class="d-flex bd-highlight">
<div class="img_cont success">RU<i class="icon fa-birthday-cake"></i></div>
<div class="user_info">
<span>Perfection Simplified</span>
<p>Jame Smith commented on your status</p>
</div>
</div>
</li>
<li class="name-first-letter">SEVER STATUS</li>
<li>
<div class="d-flex bd-highlight">
<div class="img_cont primary">AU<i class="icon fa fa-user-plus"></i></div>
<div class="user_info">
<span>AharlieKane</span>
<p>Sami is online</p>
</div>
</div>
</li>
<li>
<div class="d-flex bd-highlight">
<div class="img_cont info">MO<i class="icon fa fa-user-plus"></i></div>
<div class="user_info">
<span>Athan Jacoby</span>
<p>Nargis left 30 mins ago</p>
</div>
</div>
</li>
</ul>
</div>
<div class="card-footer"></div>
</div>
</div>
<div class="tab-pane fade" id="notes">
<div class="card mb-sm-3 mb-md-0 note_card">
<div class="card-header chat-list-header text-center">
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect fill="#000000" x="4" y="11" width="16" height="2" rx="1"/><rect fill="#000000" opacity="0.3" transform="translate(12.000000, 12.000000) rotate(-270.000000) translate(-12.000000, -12.000000) " x="4" y="11" width="16" height="2" rx="1"/></g></svg></a>
<div>
<h6 class="mb-1">Notes</h6>
<p class="mb-0">Add New Nots</p>
</div>
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18px" height="18px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect x="0" y="0" width="24" height="24"/><path d="M14.2928932,16.7071068 C13.9023689,16.3165825 13.9023689,15.6834175 14.2928932,15.2928932 C14.6834175,14.9023689 15.3165825,14.9023689 15.7071068,15.2928932 L19.7071068,19.2928932 C20.0976311,19.6834175 20.0976311,20.3165825 19.7071068,20.7071068 C19.3165825,21.0976311 18.6834175,21.0976311 18.2928932,20.7071068 L14.2928932,16.7071068 Z" fill="#000000" fill-rule="nonzero" opacity="0.3"/><path d="M11,16 C13.7614237,16 16,13.7614237 16,11 C16,8.23857625 13.7614237,6 11,6 C8.23857625,6 6,8.23857625 6,11 C6,13.7614237 8.23857625,16 11,16 Z M11,18 C7.13400675,18 4,14.8659932 4,11 C4,7.13400675 7.13400675,4 11,4 C14.8659932,4 18,7.13400675 18,11 C18,14.8659932 14.8659932,18 11,18 Z" fill="#000000" fill-rule="nonzero"/></g></svg></a>
</div>
<div class="card-body contacts_body p-0 dz-scroll" id="DZ_W_Contacts_Body2">
<ul class="contacts">
<li class="active">
<div class="d-flex bd-highlight">
<div class="user_info">
<span>New order placed..</span>
<p>10 Aug 2020</p>
</div>
<div class="ml-auto">
<a href="#" class="btn btn-primary btn-xs sharp mr-1"><i class="fa fa-pencil"></i></a>
<a href="#" class="btn btn-danger btn-xs sharp"><i class="fa fa-trash"></i></a>
</div>
</div>
</li>
<li>
<div class="d-flex bd-highlight">
<div class="user_info">
<span>Youtube, a video-sharing website..</span>
<p>10 Aug 2020</p>
</div>
<div class="ml-auto">
<a href="#" class="btn btn-primary btn-xs sharp mr-1"><i class="fa fa-pencil"></i></a>
<a href="#" class="btn btn-danger btn-xs sharp"><i class="fa fa-trash"></i></a>
</div>
</div>
</li>
<li>
<div class="d-flex bd-highlight">
<div class="user_info">
<span>john just buy your product..</span>
<p>10 Aug 2020</p>
</div>
<div class="ml-auto">
<a href="#" class="btn btn-primary btn-xs sharp mr-1"><i class="fa fa-pencil"></i></a>
<a href="#" class="btn btn-danger btn-xs sharp"><i class="fa fa-trash"></i></a>
</div>
</div>
</li>
<li>
<div class="d-flex bd-highlight">
<div class="user_info">
<span>Athan Jacoby</span>
<p>10 Aug 2020</p>
</div>
<div class="ml-auto">
<a href="#" class="btn btn-primary btn-xs sharp mr-1"><i class="fa fa-pencil"></i></a>
<a href="#" class="btn btn-danger btn-xs sharp"><i class="fa fa-trash"></i></a>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!--**********************************
Chat box End
***********************************-->
<!--**********************************
Header start
***********************************-->
<div class="header">
<div class="header-content">
<nav class="navbar navbar-expand">
<div class="collapse navbar-collapse justify-content-between">
<div class="header-left">
<div class="search_bar dropdown show">
<div class="dropdown-menu p-0 m-0 show">
<form>
<input class="form-control" type="search" placeholder="Search Here" aria-label="Search">
</form>
</div>
<span class="search_icon p-3 c-pointer" data-toggle="dropdown">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M23.7871 22.7761L17.9548 16.9437C19.5193 15.145 20.4665 12.7982 20.4665 10.2333C20.4665 4.58714 15.8741 0 10.2333 0C4.58714 0 0 4.59246 0 10.2333C0 15.8741 4.59246 20.4665 10.2333 20.4665C12.7982 20.4665 15.145 19.5193 16.9437 17.9548L22.7761 23.7871C22.9144 23.9255 23.1007 24 23.2816 24C23.4625 24 23.6488 23.9308 23.7871 23.7871C24.0639 23.5104 24.0639 23.0528 23.7871 22.7761ZM1.43149 10.2333C1.43149 5.38004 5.38004 1.43681 10.2279 1.43681C15.0812 1.43681 19.0244 5.38537 19.0244 10.2333C19.0244 15.0812 15.0812 19.035 10.2279 19.035C5.38004 19.035 1.43149 15.0865 1.43149 10.2333Z" fill="#A4A4A4"/></svg>
</span>
</div>
</div>
<ul class="navbar-nav header-right">
<li class="nav-item dropdown notification_dropdown">
<a class="nav-link dz-fullscreen primary" href="#">
<svg id="Capa_1" enable-background="new 0 0 482.239 482.239" height="22" viewBox="0 0 482.239 482.239" width="22" xmlns="http://www.w3.org/2000/svg"><path d="m0 17.223v120.56h34.446v-103.337h103.337v-34.446h-120.56c-9.52 0-17.223 7.703-17.223 17.223z" fill=""/><path d="m465.016 0h-120.56v34.446h103.337v103.337h34.446v-120.56c0-9.52-7.703-17.223-17.223-17.223z" fill=""/><path d="m447.793 447.793h-103.337v34.446h120.56c9.52 0 17.223-7.703 17.223-17.223v-120.56h-34.446z" fill="" /><path d="m34.446 344.456h-34.446v120.56c0 9.52 7.703 17.223 17.223 17.223h120.56v-34.446h-103.337z" fill=""/></svg>
</a>
</li>
<li class="nav-item dropdown notification_dropdown">
<a class="nav-link bell bell-link primary" href="#">
<svg width="24" height="24" viewBox="0 0 23 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.4604 0.848846H3.31682C2.64742 0.849582 2.00565 1.11583 1.53231 1.58916C1.05897 2.0625 0.792727 2.70427 0.791992 3.37367V15.1562C0.792727 15.8256 1.05897 16.4674 1.53231 16.9407C2.00565 17.414 2.64742 17.6803 3.31682 17.681C3.53999 17.6812 3.75398 17.7699 3.91178 17.9277C4.06958 18.0855 4.15829 18.2995 4.15843 18.5226V20.3168C4.15843 20.6214 4.24112 20.9204 4.39768 21.1817C4.55423 21.4431 4.77879 21.6571 5.04741 21.8008C5.31602 21.9446 5.61861 22.0127 5.92292 21.998C6.22723 21.9833 6.52183 21.8863 6.77533 21.7173L12.6173 17.8224C12.7554 17.7299 12.9179 17.6807 13.0841 17.681H17.187C17.7383 17.68 18.2742 17.4993 18.7136 17.1664C19.1531 16.8334 19.472 16.3664 19.6222 15.8359L22.8965 4.05007C22.9998 3.67478 23.0152 3.28071 22.9413 2.89853C22.8674 2.51634 22.7064 2.15636 22.4707 1.8466C22.2349 1.53684 21.9309 1.28565 21.5822 1.1126C21.2336 0.93954 20.8497 0.849282 20.4604 0.848846ZM21.2732 3.60301L18.0005 15.3847C17.9499 15.5614 17.8432 15.7168 17.6964 15.8274C17.5496 15.938 17.3708 15.9979 17.187 15.9978H13.0841C12.5855 15.9972 12.098 16.1448 11.6836 16.4219L5.84165 20.3168V18.5226C5.84091 17.8532 5.57467 17.2115 5.10133 16.7381C4.62799 16.2648 3.98622 15.9985 3.31682 15.9978C3.09365 15.9977 2.87966 15.909 2.72186 15.7512C2.56406 15.5934 2.47534 15.3794 2.47521 15.1562V3.37367C2.47534 3.15051 2.56406 2.93652 2.72186 2.77871C2.87966 2.62091 3.09365 2.5322 3.31682 2.53206H20.4604C20.5905 2.53239 20.7187 2.56274 20.8352 2.62073C20.9516 2.67872 21.0531 2.7628 21.1318 2.86643C21.2104 2.97005 21.2641 3.09042 21.2886 3.21818C21.3132 3.34594 21.3079 3.47763 21.2732 3.60301Z" fill="#000"/><path d="M5.84161 8.42333H10.0497C10.2729 8.42333 10.4869 8.33466 10.6448 8.17683C10.8026 8.019 10.8913 7.80493 10.8913 7.58172C10.8913 7.35851 10.8026 7.14445 10.6448 6.98661C10.4869 6.82878 10.2729 6.74011 10.0497 6.74011H5.84161C5.6184 6.74011 5.40433 6.82878 5.2465 6.98661C5.08867 7.14445 5 7.35851 5 7.58172C5 7.80493 5.08867 8.019 5.2465 8.17683C5.40433 8.33466 5.6184 8.42333 5.84161 8.42333Z" fill="#000"/><path d="M13.4161 10.1066H5.84161C5.6184 10.1066 5.40433 10.1952 5.2465 10.3531C5.08867 10.5109 5 10.725 5 10.9482C5 11.1714 5.08867 11.3854 5.2465 11.5433C5.40433 11.7011 5.6184 11.7898 5.84161 11.7898H13.4161C13.6393 11.7898 13.8534 11.7011 14.0112 11.5433C14.169 11.3854 14.2577 11.1714 14.2577 10.9482C14.2577 10.725 14.169 10.5109 14.0112 10.3531C13.8534 10.1952 13.6393 10.1066 13.4161 10.1066Z" fill="#000"/></svg>
</a>
</li>
<li class="nav-item dropdown notification_dropdown">
<a class="nav-link ai-icon warning" href="#" role="button" data-toggle="dropdown">
<svg width="24" height="24" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M21.75 14.8385V12.0463C21.7471 9.88552 20.9385 7.80353 19.4821 6.20735C18.0258 4.61116 16.0264 3.61555 13.875 3.41516V1.625C13.875 1.39294 13.7828 1.17038 13.6187 1.00628C13.4546 0.842187 13.2321 0.75 13 0.75C12.7679 0.75 12.5454 0.842187 12.3813 1.00628C12.2172 1.17038 12.125 1.39294 12.125 1.625V3.41534C9.97361 3.61572 7.97429 4.61131 6.51794 6.20746C5.06159 7.80361 4.25291 9.88555 4.25 12.0463V14.8383C3.26257 15.0412 2.37529 15.5784 1.73774 16.3593C1.10019 17.1401 0.751339 18.1169 0.75 19.125C0.750764 19.821 1.02757 20.4882 1.51969 20.9803C2.01181 21.4724 2.67904 21.7492 3.375 21.75H8.71346C8.91521 22.738 9.45205 23.6259 10.2331 24.2636C11.0142 24.9013 11.9916 25.2497 13 25.2497C14.0084 25.2497 14.9858 24.9013 15.7669 24.2636C16.548 23.6259 17.0848 22.738 17.2865 21.75H22.625C23.321 21.7492 23.9882 21.4724 24.4803 20.9803C24.9724 20.4882 25.2492 19.821 25.25 19.125C25.2486 18.117 24.8998 17.1402 24.2622 16.3594C23.6247 15.5786 22.7374 15.0414 21.75 14.8385ZM6 12.0463C6.00232 10.2113 6.73226 8.45223 8.02974 7.15474C9.32723 5.85726 11.0863 5.12732 12.9212 5.125H13.0788C14.9137 5.12732 16.6728 5.85726 17.9703 7.15474C19.2677 8.45223 19.9977 10.2113 20 12.0463V14.75H6V12.0463ZM13 23.5C12.4589 23.4983 11.9316 23.3292 11.4905 23.0159C11.0493 22.7026 10.716 22.2604 10.5363 21.75H15.4637C15.284 22.2604 14.9507 22.7026 14.5095 23.0159C14.0684 23.3292 13.5411 23.4983 13 23.5ZM22.625 20H3.375C3.14298 19.9999 2.9205 19.9076 2.75644 19.7436C2.59237 19.5795 2.50014 19.357 2.5 19.125C2.50076 18.429 2.77757 17.7618 3.26969 17.2697C3.76181 16.7776 4.42904 16.5008 5.125 16.5H20.875C21.571 16.5008 22.2382 16.7776 22.7303 17.2697C23.2224 17.7618 23.4992 18.429 23.5 19.125C23.4999 19.357 23.4076 19.5795 23.2436 19.7436C23.0795 19.9076 22.857 19.9999 22.625 20Z" fill="#000"/></svg>
<div class="pulse-css"></div>
</a>
<div class="dropdown-menu dropdown-menu-right">
<div id="DZ_W_Notification1" class="widget-media dz-scroll p-3" style="height:380px;">
<ul class="timeline">
<li>
<div class="timeline-panel">
<div class="media mr-2">
<img alt="image" width="50" src="images/avatar/1.jpg">
</div>
<div class="media-body">
<h6 class="mb-1">Dr sultads Send you Photo</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
<li>
<div class="timeline-panel">
<div class="media mr-2 media-info">
KG
</div>
<div class="media-body">
<h6 class="mb-1">Resport created successfully</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
<li>
<div class="timeline-panel">
<div class="media mr-2 media-success">
<i class="fa fa-home"></i>
</div>
<div class="media-body">
<h6 class="mb-1">Reminder : Treatment Time!</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
<li>
<div class="timeline-panel">
<div class="media mr-2">
<img alt="image" width="50" src="images/avatar/1.jpg">
</div>
<div class="media-body">
<h6 class="mb-1">Dr sultads Send you Photo</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
<li>
<div class="timeline-panel">
<div class="media mr-2 media-danger">
KG
</div>
<div class="media-body">
<h6 class="mb-1">Resport created successfully</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
<li>
<div class="timeline-panel">
<div class="media mr-2 media-primary">
<i class="fa fa-home"></i>
</div>
<div class="media-body">
<h6 class="mb-1">Reminder : Treatment Time!</h6>
<small class="d-block">29 July 2020 - 02:26 PM</small>
</div>
</div>
</li>
</ul>
</div>
<a class="all-notification" href="#">See all notifications <i class="ti-arrow-right"></i></a>
</div>
</li>
<li class="nav-item dropdown header-profile">
<a class="nav-link" href="#" role="button" data-toggle="dropdown">
<div class="header-info">
<span>Hello, <strong>Kelvin</strong></span>
</div>
<img src="images/profile/pic1.jpg" width="20" alt=""/>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a href="./app-profile.html" class="dropdown-item ai-icon">
<svg id="icon-user1" xmlns="http://www.w3.org/2000/svg" class="text-primary" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
<span class="ml-2">Profile </span>
</a>
<a href="./email-inbox.html" class="dropdown-item ai-icon">
<svg id="icon-inbox" xmlns="http://www.w3.org/2000/svg" class="text-success" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
<span class="ml-2">Inbox </span>
</a>
<a href="./page-login.html" class="dropdown-item ai-icon">
<svg id="icon-logout" xmlns="http://www.w3.org/2000/svg" class="text-danger" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
<span class="ml-2">Logout </span>
</a>
</div>
</li>
</ul>
</div>
</nav>
</div>
</div>
<!--**********************************
Header end ti-comment-alt
***********************************-->
<!--**********************************
Sidebar start
***********************************-->
<div class="deznav">
<div class="deznav-scroll">
<ul class="metismenu" id="menu">
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-networking"></i>
<span class="nav-text">Dashboard</span>
</a>
<ul aria-expanded="false">
<li><a href="index.html">Dashboard</a></li>
<li><a href="page-analytics.html">Analytics</a></li>
<li><a href="page-review.html">Review</a></li>
<li><a href="page-order.html">Order</a></li>
<li><a href="page-order-list.html">Order List</a></li>
<li><a href="page-general-customers.html">General Customers</a></li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-television"></i>
<span class="nav-text">Apps</span>
</a>
<ul aria-expanded="false">
<li><a href="./app-profile.html">Profile</a></li>
<li><a class="has-arrow" href="javascript:void()" aria-expanded="false">Email</a>
<ul aria-expanded="false">
<li><a href="./email-compose.html">Compose</a></li>
<li><a href="./email-inbox.html">Inbox</a></li>
<li><a href="./email-read.html">Read</a></li>
</ul>
</li>
<li><a href="./app-calender.html">Calendar</a></li>
<li><a class="has-arrow" href="javascript:void()" aria-expanded="false">Shop</a>
<ul aria-expanded="false">
<li><a href="./ecom-product-grid.html">Product Grid</a></li>
<li><a href="./ecom-product-list.html">Product List</a></li>
<li><a href="./ecom-product-detail.html">Product Details</a></li>
<li><a href="./ecom-product-order.html">Order</a></li>
<li><a href="./ecom-checkout.html">Checkout</a></li>
<li><a href="./ecom-invoice.html">Invoice</a></li>
<li><a href="./ecom-customers.html">Customers</a></li>
</ul>
</li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-controls-3"></i>
<span class="nav-text">Charts</span>
</a>
<ul aria-expanded="false">
<li><a href="./chart-flot.html">Flot</a></li>
<li><a href="./chart-morris.html">Morris</a></li>
<li><a href="./chart-chartjs.html">Chartjs</a></li>
<li><a href="./chart-chartist.html">Chartist</a></li>
<li><a href="./chart-sparkline.html">Sparkline</a></li>
<li><a href="./chart-peity.html">Peity</a></li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-internet"></i>
<span class="nav-text">Bootstrap</span>
</a>
<ul aria-expanded="false">
<li><a href="./ui-accordion.html">Accordion</a></li>
<li><a href="./ui-alert.html">Alert</a></li>
<li><a href="./ui-badge.html">Badge</a></li>
<li><a href="./ui-button.html">Button</a></li>
<li><a href="./ui-modal.html">Modal</a></li>
<li><a href="./ui-button-group.html">Button Group</a></li>
<li><a href="./ui-list-group.html">List Group</a></li>
<li><a href="./ui-media-object.html">Media Object</a></li>
<li><a href="./ui-card.html">Cards</a></li>
<li><a href="./ui-carousel.html">Carousel</a></li>
<li><a href="./ui-dropdown.html">Dropdown</a></li>
<li><a href="./ui-popover.html">Popover</a></li>
<li><a href="./ui-progressbar.html">Progressbar</a></li>
<li><a href="./ui-tab.html">Tab</a></li>
<li><a href="./ui-typography.html">Typography</a></li>
<li><a href="./ui-pagination.html">Pagination</a></li>
<li><a href="./ui-grid.html">Grid</a></li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-heart"></i>
<span class="nav-text">Plugins</span>
</a>
<ul aria-expanded="false">
<li><a href="./uc-select2.html">Select 2</a></li>
<li><a href="./uc-nestable.html">Nestedable</a></li>
<li><a href="./uc-noui-slider.html">Noui Slider</a></li>
<li><a href="./uc-sweetalert.html">Sweet Alert</a></li>
<li><a href="./uc-toastr.html">Toastr</a></li>
<li><a href="./map-jqvmap.html">Jqv Map</a></li>
</ul>
</li>
<li><a href="widget-basic.html" class="ai-icon" aria-expanded="false">
<i class="flaticon-381-settings-2"></i>
<span class="nav-text">Widget</span>
</a>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-notepad"></i>
<span class="nav-text">Forms</span>
</a>
<ul aria-expanded="false">
<li><a href="./form-element.html">Form Elements</a></li>
<li><a href="./form-wizard.html">Wizard</a></li>
<li><a href="./form-editor-summernote.html">Summernote</a></li>
<li><a href="form-pickers.html">Pickers</a></li>
<li><a href="form-validation-jquery.html">Jquery Validate</a></li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-network"></i>
<span class="nav-text">Table</span>
</a>
<ul aria-expanded="false">
<li><a href="table-bootstrap-basic.html">Bootstrap</a></li>
<li><a href="table-datatable-basic.html">Datatable</a></li>
</ul>
</li>
<li><a class="has-arrow ai-icon" href="javascript:void()" aria-expanded="false">
<i class="flaticon-381-layer-1"></i>
<span class="nav-text">Pages</span>
</a>
<ul aria-expanded="false">
<li><a href="./page-register.html">Register</a></li>
<li><a href="./page-login.html">Login</a></li>
<li><a class="has-arrow" href="javascript:void()" aria-expanded="false">Error</a>
<ul aria-expanded="false">
<li><a href="./page-error-400.html">Error 400</a></li>
<li><a href="./page-error-403.html">Error 403</a></li>
<li><a href="./page-error-404.html">Error 404</a></li>
<li><a href="./page-error-500.html">Error 500</a></li>
<li><a href="./page-error-503.html">Error 503</a></li>
</ul>
</li>
<li><a href="./page-lock-screen.html">Lock Screen</a></li>
</ul>
</li>
</ul>
<div class="add-menu-sidebar">
<img src="images/icon1.png" alt=""/>
<p>Organize your menus through button bellow</p>
<a href="javascript:void(0);" class="btn btn-primary btn-block light">+ Add Menus</a>
</div>
<div class="copyright">
<p><strong>Eatio - Restaurant Admin Dashboard</strong> © 2020 All Rights Reserved</p>
</div>
</div>
</div>
<!--**********************************
Sidebar end
***********************************-->
<!--**********************************
Content body start
***********************************-->
<div class="content-body">
<!-- row -->
<div class="container-fluid">
<div class="form-head d-flex mb-3 align-items-start">
<div class="mr-auto d-none d-lg-block">
<h2 class="text-black font-w600 mb-0">Dashboard</h2>
<p class="mb-0">Welcome to Eatio Admin!</p>
</div>
<div class="dropdown custom-dropdown">
<div class="btn btn-sm btn-primary light d-flex align-items-center svg-btn" data-toggle="dropdown">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><g><path d="M22.4281 2.856H21.8681V1.428C21.8681 0.56 21.2801 0 20.4401 0C19.6001 0 19.0121 0.56 19.0121 1.428V2.856H9.71606V1.428C9.71606 0.56 9.15606 0 8.28806 0C7.42006 0 6.86006 0.56 6.86006 1.428V2.856H5.57206C2.85606 2.856 0.560059 5.152 0.560059 7.868V23.016C0.560059 25.732 2.85606 28.028 5.57206 28.028H22.4281C25.1441 28.028 27.4401 25.732 27.4401 23.016V7.868C27.4401 5.152 25.1441 2.856 22.4281 2.856ZM5.57206 5.712H22.4281C23.5761 5.712 24.5841 6.72 24.5841 7.868V9.856H3.41606V7.868C3.41606 6.72 4.42406 5.712 5.57206 5.712ZM22.4281 25.144H5.57206C4.42406 25.144 3.41606 24.136 3.41606 22.988V12.712H24.5561V22.988C24.5841 24.136 23.5761 25.144 22.4281 25.144Z" fill="#2F4CDD"></path></g></svg>
<div class="text-left ml-3">
<span class="d-block fs-16">Filter Periode</span>
<small class="d-block fs-13">4 June 2020 - 4 July 2020</small>
</div>
<i class="fa fa-angle-down scale5 ml-3"></i>
</div>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="#">4 June 2020 - 4 July 2020</a>
<a class="dropdown-item" href="#">5 july 2020 - 4 Aug 2020</a>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-xxl-3 col-lg-6 col-md-6 col-sm-6">
<div class="widget-stat card">
<div class="card-body p-4">
<div class="media ai-icon">
<span class="mr-3 bgl-primary text-primary">
<!-- <i class="ti-user"></i> -->
<svg width="36" height="28" viewBox="0 0 36 28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M31.75 6.75H30.0064L30.2189 4.62238C30.2709 4.10111 30.2131 3.57473 30.0493 3.07716C29.8854 2.57959 29.6192 2.12186 29.2676 1.73348C28.9161 1.3451 28.4871 1.03468 28.0082 0.822231C27.5294 0.609781 27.0114 0.500013 26.4875 0.5H7.0125C6.48854 0.500041 5.9704 0.609864 5.49148 0.822391C5.01256 1.03492 4.58348 1.34543 4.23189 1.73392C3.88031 2.12241 3.61403 2.58026 3.45021 3.07795C3.28639 3.57564 3.22866 4.10214 3.28075 4.6235L5.2815 24.6224C5.31508 24.9222 5.38467 25.2168 5.48875 25.5H1.75C1.41848 25.5 1.10054 25.6317 0.866116 25.8661C0.631696 26.1005 0.5 26.4185 0.5 26.75C0.5 27.0815 0.631696 27.3995 0.866116 27.6339C1.10054 27.8683 1.41848 28 1.75 28H31.75C32.0815 28 32.3995 27.8683 32.6339 27.6339C32.8683 27.3995 33 27.0815 33 26.75C33 26.4185 32.8683 26.1005 32.6339 25.8661C32.3995 25.6317 32.0815 25.5 31.75 25.5H28.0115C28.1154 25.2172 28.1849 24.9229 28.2185 24.6235L28.881 18H31.75C32.7442 17.9989 33.6974 17.6035 34.4004 16.9004C35.1035 16.1974 35.4989 15.2442 35.5 14.25V10.5C35.4989 9.50577 35.1035 8.55258 34.4004 7.84956C33.6974 7.14653 32.7442 6.75109 31.75 6.75ZM9.0125 25.5C8.70243 25.501 8.40314 25.3862 8.17327 25.1782C7.9434 24.9701 7.79949 24.6836 7.76975 24.375L5.7685 4.37575C5.75109 4.20188 5.7703 4.0263 5.82488 3.86031C5.87946 3.69432 5.96821 3.5416 6.0854 3.412C6.2026 3.28239 6.34564 3.17877 6.50532 3.10781C6.665 3.03685 6.83777 3.00013 7.0125 3H26.4875C26.6622 3.00012 26.8349 3.03681 26.9945 3.10772C27.1541 3.17863 27.2972 3.28218 27.4143 3.4117C27.5315 3.54123 27.6203 3.69386 27.6749 3.85977C27.7295 4.02568 27.7488 4.20119 27.7315 4.375L25.7308 24.3762C25.7007 24.6848 25.5566 24.971 25.3267 25.1788C25.0967 25.3867 24.7975 25.5012 24.4875 25.5H9.0125ZM33 14.25C32.9998 14.5815 32.868 14.8993 32.6337 15.1337C32.3993 15.368 32.0815 15.4998 31.75 15.5H29.1311L29.7561 9.25H31.75C32.0815 9.2502 32.3993 9.38196 32.6337 9.61634C32.868 9.85071 32.9998 10.1685 33 10.5V14.25Z" fill="#2F4CDD"/></svg>
</span>
<div class="media-body">
<h3 class="mb-0 text-black"><span class="counter ml-0">56</span></h3>
<p class="mb-0">Total Menus</p>
<small>4% (30 days)</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-md-6 col-sm-6">
<div class="widget-stat card">
<div class="card-body p-4">
<div class="media ai-icon">
<span class="mr-3 bgl-primary text-primary">
<!-- <i class="ti-user"></i> -->
<svg width="20" height="36" viewBox="0 0 20 36" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.08 24.36C19.08 25.64 18.76 26.8667 18.12 28.04C17.48 29.1867 16.5333 30.1467 15.28 30.92C14.0533 31.6933 12.5733 32.1333 10.84 32.24V35.48H8.68V32.24C6.25333 32.0267 4.28 31.2533 2.76 29.92C1.24 28.56 0.466667 26.84 0.44 24.76H4.32C4.42667 25.88 4.84 26.8533 5.56 27.68C6.30667 28.5067 7.34667 29.0267 8.68 29.24V19.24C6.89333 18.7867 5.45333 18.32 4.36 17.84C3.26667 17.36 2.33333 16.6133 1.56 15.6C0.786667 14.5867 0.4 13.2267 0.4 11.52C0.4 9.36 1.14667 7.57333 2.64 6.16C4.16 4.74666 6.17333 3.96 8.68 3.8V0.479998H10.84V3.8C13.1067 3.98667 14.9333 4.72 16.32 6C17.7067 7.25333 18.5067 8.89333 18.72 10.92H14.84C14.7067 9.98667 14.2933 9.14667 13.6 8.4C12.9067 7.62667 11.9867 7.12 10.84 6.88V16.64C12.6 17.0933 14.0267 17.56 15.12 18.04C16.24 18.4933 17.1733 19.2267 17.92 20.24C18.6933 21.2533 19.08 22.6267 19.08 24.36ZM4.12 11.32C4.12 12.6267 4.50667 13.6267 5.28 14.32C6.05333 15.0133 7.18667 15.5867 8.68 16.04V6.8C7.29333 6.93333 6.18667 7.38667 5.36 8.16C4.53333 8.90667 4.12 9.96 4.12 11.32ZM10.84 29.28C12.28 29.12 13.4 28.6 14.2 27.72C15.0267 26.84 15.44 25.7867 15.44 24.56C15.44 23.2533 15.04 22.2533 14.24 21.56C13.44 20.84 12.3067 20.2667 10.84 19.84V29.28Z" fill="#2F4CDD"/></svg>
</span>
<div class="media-body">
<h3 class="mb-0 text-black"><span class="counter ml-0">126</span>k</h3>
<p class="mb-0">Total Revenue</p>
<small>4% (30 days)</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-md-6 col-sm-6">
<div class="widget-stat card">
<div class="card-body p-4">
<div class="media ai-icon">
<span class="mr-3 bgl-primary text-primary">
<!-- <i class="ti-user"></i> -->
<svg width="32" height="31" viewBox="0 0 32 31" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 30.5H22.75C23.7442 30.4989 24.6974 30.1035 25.4004 29.4004C26.1035 28.6974 26.4989 27.7442 26.5 26.75V16.75C26.5 16.4185 26.3683 16.1005 26.1339 15.8661C25.8995 15.6317 25.5815 15.5 25.25 15.5C24.9185 15.5 24.6005 15.6317 24.3661 15.8661C24.1317 16.1005 24 16.4185 24 16.75V26.75C23.9997 27.0814 23.8679 27.3992 23.6336 27.6336C23.3992 27.8679 23.0814 27.9997 22.75 28H4C3.66857 27.9997 3.3508 27.8679 3.11645 27.6336C2.88209 27.3992 2.7503 27.0814 2.75 26.75V9.25C2.7503 8.91857 2.88209 8.6008 3.11645 8.36645C3.3508 8.13209 3.66857 8.0003 4 8H15.25C15.5815 8 15.8995 7.8683 16.1339 7.63388C16.3683 7.39946 16.5 7.08152 16.5 6.75C16.5 6.41848 16.3683 6.10054 16.1339 5.86612C15.8995 5.6317 15.5815 5.5 15.25 5.5H4C3.00577 5.50109 2.05258 5.89653 1.34956 6.59956C0.646531 7.30258 0.251092 8.25577 0.25 9.25V26.75C0.251092 27.7442 0.646531 28.6974 1.34956 29.4004C2.05258 30.1035 3.00577 30.4989 4 30.5Z" fill="#2F4CDD"/><path d="M25.25 0.5C24.0139 0.5 22.8055 0.866556 21.7777 1.55331C20.7499 2.24007 19.9488 3.21619 19.4758 4.35823C19.0027 5.50027 18.8789 6.75693 19.1201 7.96931C19.3613 9.1817 19.9565 10.2953 20.8306 11.1694C21.7047 12.0435 22.8183 12.6388 24.0307 12.8799C25.2431 13.1211 26.4997 12.9973 27.6418 12.5242C28.7838 12.0512 29.7599 11.2501 30.4467 10.2223C31.1334 9.19451 31.5 7.98613 31.5 6.75C31.498 5.093 30.8389 3.50442 29.6673 2.33274C28.4956 1.16106 26.907 0.501952 25.25 0.5ZM25.25 10.5C24.5083 10.5 23.7833 10.2801 23.1666 9.86801C22.5499 9.45596 22.0693 8.87029 21.7855 8.18506C21.5016 7.49984 21.4274 6.74584 21.5721 6.01841C21.7167 5.29098 22.0739 4.6228 22.5983 4.09835C23.1228 3.5739 23.791 3.21675 24.5184 3.07206C25.2458 2.92736 25.9998 3.00162 26.6851 3.28545C27.3703 3.56928 27.9559 4.04993 28.368 4.66661C28.7801 5.2833 29 6.00832 29 6.75C28.9989 7.74423 28.6035 8.69742 27.9004 9.40044C27.1974 10.1035 26.2442 10.4989 25.25 10.5Z" fill="#2F4CDD"/><path d="M6.5 13H12.75C13.0815 13 13.3995 12.8683 13.6339 12.6339C13.8683 12.3995 14 12.0815 14 11.75C14 11.4185 13.8683 11.1005 13.6339 10.8661C13.3995 10.6317 13.0815 10.5 12.75 10.5H6.5C6.16848 10.5 5.85054 10.6317 5.61612 10.8661C5.3817 11.1005 5.25 11.4185 5.25 11.75C5.25 12.0815 5.3817 12.3995 5.61612 12.6339C5.85054 12.8683 6.16848 13 6.5 13Z" fill="#2F4CDD"/><path d="M5.25 16.75C5.25 17.0815 5.3817 17.3995 5.61612 17.6339C5.85054 17.8683 6.16848 18 6.5 18H17.75C18.0815 18 18.3995 17.8683 18.6339 17.6339C18.8683 17.3995 19 17.0815 19 16.75C19 16.4185 18.8683 16.1005 18.6339 15.8661C18.3995 15.6317 18.0815 15.5 17.75 15.5H6.5C6.16848 15.5 5.85054 15.6317 5.61612 15.8661C5.3817 16.1005 5.25 16.4185 5.25 16.75Z" fill="#2F4CDD"/></svg>
</span>
<div class="media-body">
<h3 class="mb-0 text-black"><span class="counter ml-0">279</span></h3>
<p class="mb-0">Total Orders</p>
<small>4% (30 days)</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-md-6 col-sm-6">
<div class="widget-stat card">
<div class="card-body p-4">
<div class="media ai-icon">
<span class="mr-3 bgl-primary text-primary">
<!-- <i class="ti-user"></i> -->
<svg width="32" height="36" viewBox="0 0 32 36" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.25 19.25C12.2389 19.25 13.2056 18.9568 14.0279 18.4074C14.8501 17.8579 15.491 17.0771 15.8694 16.1634C16.2478 15.2498 16.3469 14.2445 16.1539 13.2746C15.961 12.3046 15.4848 11.4137 14.7855 10.7145C14.0863 10.0152 13.1954 9.539 12.2255 9.34608C11.2555 9.15315 10.2502 9.25217 9.33658 9.6306C8.42295 10.009 7.64206 10.6499 7.09265 11.4722C6.54325 12.2944 6.25 13.2611 6.25 14.25C6.25129 15.5757 6.77849 16.8467 7.71589 17.7841C8.65329 18.7215 9.92431 19.2487 11.25 19.25ZM11.25 11.75C11.7445 11.75 12.2278 11.8966 12.6389 12.1713C13.05 12.446 13.3705 12.8365 13.5597 13.2933C13.7489 13.7501 13.7984 14.2528 13.702 14.7377C13.6055 15.2227 13.3674 15.6681 13.0178 16.0178C12.6681 16.3674 12.2227 16.6055 11.7377 16.702C11.2528 16.7984 10.7501 16.7489 10.2933 16.5597C9.83648 16.3705 9.44603 16.0501 9.17133 15.6389C8.89662 15.2278 8.75 14.7445 8.75 14.25C8.75089 13.5872 9.01457 12.9519 9.48322 12.4832C9.95187 12.0146 10.5872 11.7509 11.25 11.75Z" fill="#2F4CDD"/><path d="M30.78 22.4625C31.1927 21.9098 31.4684 21.2672 31.5844 20.5873C31.7005 19.9074 31.6537 19.2096 31.4478 18.5514L30.6543 15.9696C30.2817 14.7451 29.5244 13.6733 28.4946 12.9132C27.4648 12.1531 26.2174 11.7452 24.9375 11.75H19.3287C18.9971 11.75 18.6792 11.8817 18.4448 12.1161C18.2103 12.3505 18.0787 12.6685 18.0787 13C18.0787 13.3315 18.2103 13.6495 18.4448 13.8839C18.6792 14.1183 18.9971 14.25 19.3287 14.25H24.9375C25.6823 14.2474 26.4081 14.485 27.0073 14.9274C27.6064 15.3698 28.0471 15.9935 28.2639 16.706L29.0574 19.2866C29.145 19.5713 29.1645 19.8725 29.1145 20.1661C29.0645 20.4597 28.9463 20.7374 28.7694 20.977C28.5925 21.2166 28.3619 21.4114 28.0961 21.5456C27.8302 21.6799 27.5366 21.7499 27.2388 21.75H15.7777C15.7423 21.75 15.7127 21.7671 15.6777 21.7701C15.5937 21.7669 15.5125 21.75 15.4273 21.75H7.58978C6.20071 21.7449 4.84705 22.1879 3.72972 23.0132C2.61239 23.8385 1.79097 25.0021 1.3874 26.3312L0.454153 29.3625C0.236164 30.0719 0.187639 30.8225 0.31248 31.554C0.43732 32.2856 0.732043 32.9776 1.17296 33.5745C1.61388 34.1715 2.18869 34.6566 2.85119 34.9911C3.51369 35.3255 4.24541 35.4998 4.98753 35.5H18.0287C18.7708 35.4998 19.5026 35.3256 20.1652 34.9912C20.8277 34.6568 21.4026 34.1717 21.8436 33.5747C22.2845 32.9778 22.5793 32.2857 22.7042 31.5541C22.829 30.8226 22.7805 30.0719 22.5625 29.3625L21.6299 26.3315C21.3936 25.5767 21.0217 24.8713 20.5323 24.25H27.2388C27.9283 24.2532 28.6088 24.0928 29.2244 23.7821C29.8399 23.4714 30.3731 23.0191 30.78 22.4625ZM19.8328 32.089C19.6255 32.3726 19.3539 32.6031 19.0403 32.7614C18.7267 32.9198 18.38 33.0015 18.0287 33H4.98753C4.63653 32.9999 4.29043 32.9175 3.97708 32.7594C3.66373 32.6012 3.39187 32.3717 3.18337 32.0894C2.97487 31.807 2.83555 31.4796 2.77661 31.1336C2.71767 30.7876 2.74077 30.4326 2.84403 30.0971L3.77665 27.0661C4.02442 26.2489 4.52925 25.5335 5.21612 25.0261C5.90299 24.5188 6.73523 24.2466 7.58915 24.25H15.4267C16.2806 24.2466 17.1128 24.5188 17.7997 25.0261C18.4865 25.5335 18.9914 26.2489 19.2392 27.0661L20.1718 30.0971C20.2769 30.4323 20.301 30.7877 20.2421 31.134C20.1832 31.4804 20.0429 31.8078 19.8328 32.0894V32.089Z" fill="#2F4CDD"/><path d="M21.875 9.24999C22.7403 9.24999 23.5861 8.9934 24.3056 8.51267C25.0251 8.03194 25.5858 7.34866 25.917 6.54923C26.2481 5.74981 26.3347 4.87014 26.1659 4.02148C25.9971 3.17281 25.5804 2.39326 24.9686 1.78141C24.3567 1.16955 23.5772 0.752876 22.7285 0.584066C21.8798 0.415256 21.0002 0.501896 20.2008 0.833029C19.4013 1.16416 18.7181 1.72492 18.2373 2.44438C17.7566 3.16384 17.5 4.0097 17.5 4.875C17.5014 6.03489 17.9628 7.14688 18.7829 7.96705C19.6031 8.78722 20.7151 9.2486 21.875 9.24999ZM21.875 3C22.2458 3 22.6083 3.10997 22.9167 3.31599C23.225 3.52202 23.4654 3.81485 23.6073 4.15747C23.7492 4.50008 23.7863 4.87708 23.714 5.24079C23.6416 5.6045 23.463 5.9386 23.2008 6.20082C22.9386 6.46304 22.6045 6.64162 22.2408 6.71397C21.8771 6.78631 21.5001 6.74918 21.1575 6.60727C20.8149 6.46535 20.522 6.22503 20.316 5.91669C20.11 5.60835 20 5.24584 20 4.875C20.0006 4.37789 20.1983 3.9013 20.5498 3.54979C20.9013 3.19829 21.3779 3.00056 21.875 3Z" fill="#2F4CDD"/></svg>
</span>
<div class="media-body">
<h3 class="mb-0 text-black"><span class="counter ml-0">65</span></h3>
<p class="mb-0">Total Client</p>
<small>4% (30 days)</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-6 col-xxl-6 col-lg-12 col-md-12">
<div class="card">
<div class="card-header border-0 pb-0 d-sm-flex d-block">
<div>
<h4 class="card-title mb-1">Orders Summary</h4>
<small class="mb-0">Lorem ipsum dolor sit amet, consectetur</small>
</div>
<div class="card-action card-tabs mt-3 mt-sm-0">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#user" role="tab">
Monthly
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#bounce" role="tab">
Weekly
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#session-duration" role="tab">
Today
</a>
</li>
</ul>
</div>
</div>
<div class="card-body orders-summary">
<div class="d-flex order-manage p-3 align-items-center mb-4">
<a href="javascript:void(0);" class="btn fs-22 py-1 btn-success px-4 mr-3">25</a>
<h4 class="mb-0">New Orders <i class="fa fa-circle text-success ml-1 fs-15"></i></h4>
<a href="javascript:void(0);" class="ml-auto text-primary font-w500">Manage orders <i class="ti-angle-right ml-1"></i></a>
</div>
<div class="row">
<div class="col-sm-4 mb-4">
<div class="border px-3 py-3 rounded-xl">
<h2 class="fs-32 font-w600 counter">25</h2>
<p class="fs-16 mb-0">On Delivery</p>
</div>
</div>
<div class="col-sm-4 mb-4">
<div class="border px-3 py-3 rounded-xl">
<h2 class="fs-32 font-w600 counter">60</h2>