admin-lte 4.0.0-alpha2 → 4.0.0-alpha3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (129) hide show
  1. package/.bundlewatch.config.json +6 -6
  2. package/.cache/.eslintcache +1 -1
  3. package/.cache/.stylelintcache +1 -1
  4. package/.gitpod.yml +1 -1
  5. package/.idea/AdminLTE.iml +4 -0
  6. package/.idea/codeStyles/Project.xml +24 -0
  7. package/.idea/dbnavigator.xml +421 -0
  8. package/.idea/git_toolbox_prj.xml +15 -0
  9. package/.idea/jsLibraryMappings.xml +6 -0
  10. package/.idea/jsLinters/eslint.xml +6 -0
  11. package/.idea/vcs.xml +6 -0
  12. package/README.md +3 -3
  13. package/dist/assets/img/AdminLTEFullLogo.png +0 -0
  14. package/dist/css/adminlte.css +695 -318
  15. package/dist/css/adminlte.css.map +1 -1
  16. package/dist/css/adminlte.min.css +1 -1
  17. package/dist/css/adminlte.min.css.map +1 -1
  18. package/dist/css/adminlte.rtl.css +693 -316
  19. package/dist/css/adminlte.rtl.css.map +1 -1
  20. package/dist/css/adminlte.rtl.min.css +1 -1
  21. package/dist/css/adminlte.rtl.min.css.map +1 -1
  22. package/dist/js/adminlte.js +43 -63
  23. package/dist/js/adminlte.js.map +1 -1
  24. package/dist/js/adminlte.min.js +2 -2
  25. package/dist/js/adminlte.min.js.map +1 -1
  26. package/dist/pages/UI/timeline.html +389 -218
  27. package/dist/pages/docs/browser-support.html +345 -204
  28. package/dist/pages/docs/color-mode.html +560 -348
  29. package/dist/pages/docs/components/main-header.html +579 -368
  30. package/dist/pages/docs/components/main-sidebar.html +858 -0
  31. package/dist/pages/docs/faq.html +743 -0
  32. package/dist/pages/docs/how-to-contribute.html +783 -0
  33. package/dist/pages/docs/introduction.html +767 -0
  34. package/dist/pages/docs/javascript/treeview.html +762 -0
  35. package/dist/pages/docs/layout.html +372 -201
  36. package/dist/pages/{docs.html → docs/license.html} +347 -218
  37. package/dist/pages/examples/lockscreen.html +107 -0
  38. package/dist/pages/examples/login-v2.html +148 -0
  39. package/dist/pages/examples/login.html +45 -40
  40. package/dist/pages/examples/register-v2.html +155 -0
  41. package/dist/pages/examples/register.html +46 -41
  42. package/dist/pages/forms/general.html +664 -202
  43. package/dist/pages/index.html +514 -285
  44. package/dist/pages/index2.html +665 -341
  45. package/dist/pages/index3.html +415 -254
  46. package/dist/pages/layout/collapsed-sidebar.html +766 -0
  47. package/dist/pages/layout/fixed-complete.html +867 -0
  48. package/dist/pages/layout/fixed-sidebar.html +344 -201
  49. package/dist/pages/layout/layout-rtl.html +344 -201
  50. package/dist/pages/layout/logo-switch.html +433 -0
  51. package/dist/pages/layout/sidebar-mini.html +345 -202
  52. package/dist/pages/layout/unfixed-sidebar.html +343 -201
  53. package/dist/pages/tables/simple.html +437 -233
  54. package/dist/pages/widgets/cards.html +389 -244
  55. package/dist/pages/widgets/info-box.html +398 -215
  56. package/dist/pages/widgets/small-box.html +349 -198
  57. package/index.html +6 -10
  58. package/package.json +27 -24
  59. package/src/assets/img/AdminLTEFullLogo.png +0 -0
  60. package/src/config/astro.config.mjs +3 -1
  61. package/src/html/.prettierrc.js +11 -0
  62. package/src/html/components/_head.astro +42 -26
  63. package/src/html/components/_scripts.astro +38 -27
  64. package/src/html/components/dashboard/_footer.astro +14 -8
  65. package/src/html/components/dashboard/_sidenav.astro +343 -113
  66. package/src/html/components/dashboard/_topbar.astro +90 -49
  67. package/src/html/components/docs/{browser-support/index.md → browser-support.mdx} +2 -1
  68. package/src/html/components/docs/color-mode.mdx +169 -0
  69. package/src/html/components/docs/components/{main-header-1.md → main-header.mdx} +60 -21
  70. package/src/html/components/docs/components/main-sidebar.mdx +129 -0
  71. package/src/html/components/docs/faq.mdx +11 -0
  72. package/src/html/components/docs/how-to-contribute.mdx +34 -0
  73. package/src/html/components/docs/{introduction/index.md → introduction.mdx} +27 -2
  74. package/src/html/components/docs/license.mdx +9 -0
  75. package/src/html/components/javascript/treeview.mdx +39 -0
  76. package/src/html/pages/UI/timeline.astro +111 -48
  77. package/src/html/pages/docs/browser-support.astro +24 -11
  78. package/src/html/pages/docs/color-mode.astro +89 -42
  79. package/src/html/pages/docs/components/main-header.astro +133 -46
  80. package/src/html/pages/docs/components/main-sidebar.astro +71 -0
  81. package/src/html/pages/docs/faq.astro +71 -0
  82. package/src/html/pages/docs/how-to-contribute.astro +71 -0
  83. package/src/html/pages/docs/{index.astro → introduction.astro} +24 -11
  84. package/src/html/pages/docs/javascript/treeview.astro +71 -0
  85. package/src/html/pages/docs/layout.astro +62 -19
  86. package/src/html/pages/docs/license.astro +71 -0
  87. package/src/html/pages/examples/lockscreen.astro +63 -0
  88. package/src/html/pages/examples/login-v2.astro +109 -0
  89. package/src/html/pages/examples/login.astro +34 -16
  90. package/src/html/pages/examples/register-v2.astro +116 -0
  91. package/src/html/pages/examples/register.astro +36 -18
  92. package/src/html/pages/forms/general.astro +567 -36
  93. package/src/html/pages/index.astro +389 -152
  94. package/src/html/pages/index2.astro +682 -250
  95. package/src/html/pages/index3.astro +290 -189
  96. package/src/html/pages/layout/collapsed-sidebar.astro +110 -0
  97. package/src/html/pages/layout/fixed-complete.astro +209 -0
  98. package/src/html/pages/layout/fixed-sidebar.astro +52 -27
  99. package/src/html/pages/layout/layout-rtl.astro +53 -28
  100. package/src/html/pages/layout/logo-switch.astro +212 -0
  101. package/src/html/pages/layout/sidebar-mini.astro +53 -28
  102. package/src/html/pages/layout/unfixed-sidebar.astro +51 -27
  103. package/src/html/pages/tables/simple.astro +206 -66
  104. package/src/html/pages/widgets/cards.astro +134 -69
  105. package/src/html/pages/widgets/info-box.astro +96 -41
  106. package/src/html/pages/widgets/small-box.astro +93 -32
  107. package/src/scss/_app-content.scss +52 -0
  108. package/src/scss/_app-footer.scss +1 -1
  109. package/src/scss/_app-main.scss +2 -5
  110. package/src/scss/_app-sidebar.scss +244 -70
  111. package/src/scss/_bootstrap-variables.scss +4 -4
  112. package/src/scss/_cards.scss +31 -7
  113. package/src/scss/_compact-mode.scss +79 -0
  114. package/src/scss/_small-box.scss +0 -3
  115. package/src/scss/_variables.scss +21 -4
  116. package/src/scss/mixins/_animations.scss +0 -5
  117. package/src/scss/pages/_lockscreen.scss +74 -0
  118. package/src/scss/pages/_login_and_register.scss +0 -3
  119. package/src/scss/parts/_core.scss +2 -0
  120. package/src/scss/parts/_pages.scss +1 -0
  121. package/src/ts/card-widget.ts +17 -50
  122. package/src/ts/direct-chat.ts +2 -2
  123. package/src/ts/layout.ts +2 -2
  124. package/src/ts/push-menu.ts +3 -20
  125. package/src/ts/treeview.ts +14 -8
  126. package/src/ts/util/index.ts +14 -12
  127. package/src/utils/index.js +20 -3
  128. package/src/html/components/docs/color-mode/navbar-html.md +0 -80
  129. package/src/html/components/docs/color-mode/toggle-script.md +0 -48
package/dist/pages/docs/components/main-header.html CHANGED
@@ -1,44 +1,48 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
3
+ <!--begin::Head-->
3
4
 
4
5
  <head>
5
6
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
6
- <!-- Primary Meta Tags -->
7
7
  <title>Main Header Component | AdminLTE 4</title>
8
+ <!--begin::Primary Meta Tags-->
8
9
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
9
10
  <meta name="title" content="Main Header Component | AdminLTE 4">
10
11
  <meta name="author" content="ColorlibHQ">
11
12
  <meta name="description" content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS.">
12
13
  <meta name="keywords" content="bootstrap 5, bootstrap, bootstrap 5 admin dashboard, bootstrap 5 dashboard, bootstrap 5 charts, bootstrap 5 calendar, bootstrap 5 datepicker, bootstrap 5 tables, bootstrap 5 datatable, vanilla js datatable, colorlibhq, colorlibhq dashboard, colorlibhq admin dashboard">
13
-
14
- <!-- OPTIONAL LINKS -->
15
-
16
- <!-- Google Font: Source Sans Pro -->
14
+ <!--end::Primary Meta Tags-->
15
+ <!--begin::Fonts-->
17
16
  <link rel="preconnect" href="https://fonts.googleapis.com">
18
17
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
19
18
  <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,700;1,400&display=swap" rel="stylesheet">
20
-
21
- <!-- overlayscrollbars -->
19
+ <!--end::Fonts-->
20
+ <!--begin::Third Party Plugin(OverlayScrollbars)-->
22
21
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.1.0/styles/overlayscrollbars.min.css" integrity="sha256-LWLZPJ7X1jJLI5OG5695qDemW1qQ7lNdbTfQ64ylbUY=" crossorigin="anonymous">
23
-
24
- <!-- @fortawesome/fontawesome-free -->
25
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.3.0/css/all.min.css" integrity="sha256-/4UQcSmErDzPCMAiuOiWPVVsNN2s3ZY/NsmXNcj0IFc=" crossorigin="anonymous">
26
-
27
- <!-- REQUIRED LINKS -->
28
-
29
- <!-- Theme style -->
22
+ <!--end::Third Party Plugin(OverlayScrollbars)-->
23
+ <!--begin::Third Party Plugin(Bootstrap Icons)-->
24
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.min.css" integrity="sha256-BicZsQAhkGHIoR//IB2amPN5SrRb3fHB8tFsnqRAwnk=" crossorigin="anonymous">
25
+ <!--end::Third Party Plugin(Bootstrap Icons)-->
26
+ <!--begin::Required Plugin(AdminLTE)-->
30
27
  <link rel="stylesheet" href="../../../../dist/css/adminlte.css">
28
+ <!--end::Required Plugin(AdminLTE)-->
31
29
  </head>
30
+ <!--end::Head-->
31
+ <!--begin::Body-->
32
32
 
33
33
  <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
34
+ <!--begin::App Wrapper-->
34
35
  <div class="app-wrapper">
35
- <!-- Navbar -->
36
+ <!--begin::Header-->
36
37
  <nav class="app-header navbar navbar-expand bg-body">
38
+ <!--begin::Container-->
37
39
  <div class="container-fluid">
38
- <!-- Start navbar links -->
40
+ <!--begin::Start Navbar Links-->
39
41
  <ul class="navbar-nav">
40
42
  <li class="nav-item">
41
- <a class="nav-link" data-lte-toggle="sidebar" href="#" role="button"><i class="fa-solid fa-bars"></i></a>
43
+ <a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
44
+ <i class="bi bi-list"></i>
45
+ </a>
42
46
  </li>
43
47
  <li class="nav-item d-none d-md-block">
44
48
  <a href="#" class="nav-link">Home</a>
@@ -47,25 +51,27 @@
47
51
  <a href="#" class="nav-link">Contact</a>
48
52
  </li>
49
53
  </ul>
50
- <!-- End navbar links -->
54
+ <!--end::Start Navbar Links-->
51
55
 
56
+ <!--begin::End Navbar Links-->
52
57
  <ul class="navbar-nav ms-auto">
53
- <!-- Navbar Search -->
58
+ <!--begin::Navbar Search-->
54
59
  <li class="nav-item">
55
60
  <a class="nav-link" data-widget="navbar-search" href="#" role="button">
56
- <i class="fa-solid fa-search"></i>
61
+ <i class="bi bi-search"></i>
57
62
  </a>
58
63
  </li>
64
+ <!--end::Navbar Search-->
59
65
 
60
- <!-- Messages Dropdown Menu -->
66
+ <!--begin::Messages Dropdown Menu-->
61
67
  <li class="nav-item dropdown">
62
68
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
63
- <i class="fa-regular fa-comments"></i>
69
+ <i class="bi bi-chat-text"></i>
64
70
  <span class="navbar-badge badge text-bg-danger">3</span>
65
71
  </a>
66
72
  <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
67
73
  <a href="#" class="dropdown-item">
68
- <!-- Message Start -->
74
+ <!--begin::Message-->
69
75
  <div class="d-flex">
70
76
  <div class="flex-shrink-0">
71
77
  <img src="../../../../dist/assets/img/user1-128x128.jpg" alt="User Avatar" class="img-size-50 rounded-circle me-3">
@@ -73,17 +79,19 @@
73
79
  <div class="flex-grow-1">
74
80
  <h3 class="dropdown-item-title">
75
81
  Brad Diesel
76
- <span class="float-end fs-7 text-danger"><i class="fa-solid fa-star"></i></span>
82
+ <span class="float-end fs-7 text-danger"><i class="bi bi-star-fill"></i></span>
77
83
  </h3>
78
84
  <p class="fs-7">Call me whenever you can...</p>
79
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
85
+ <p class="fs-7 text-secondary">
86
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
87
+ </p>
80
88
  </div>
81
89
  </div>
82
- <!-- Message End -->
90
+ <!--end::Message-->
83
91
  </a>
84
92
  <div class="dropdown-divider"></div>
85
93
  <a href="#" class="dropdown-item">
86
- <!-- Message Start -->
94
+ <!--begin::Message-->
87
95
  <div class="d-flex">
88
96
  <div class="flex-shrink-0">
89
97
  <img src="../../../../dist/assets/img/user8-128x128.jpg" alt="User Avatar" class="img-size-50 rounded-circle me-3">
@@ -91,17 +99,21 @@
91
99
  <div class="flex-grow-1">
92
100
  <h3 class="dropdown-item-title">
93
101
  John Pierce
94
- <span class="float-end fs-7 text-secondary"><i class="fa-solid fa-star"></i></span>
102
+ <span class="float-end fs-7 text-secondary">
103
+ <i class="bi bi-star-fill"></i>
104
+ </span>
95
105
  </h3>
96
106
  <p class="fs-7">I got your message bro</p>
97
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
107
+ <p class="fs-7 text-secondary">
108
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
109
+ </p>
98
110
  </div>
99
111
  </div>
100
- <!-- Message End -->
112
+ <!--end::Message-->
101
113
  </a>
102
114
  <div class="dropdown-divider"></div>
103
115
  <a href="#" class="dropdown-item">
104
- <!-- Message Start -->
116
+ <!--begin::Message-->
105
117
  <div class="d-flex">
106
118
  <div class="flex-shrink-0">
107
119
  <img src="../../../../dist/assets/img/user3-128x128.jpg" alt="User Avatar" class="img-size-50 rounded-circle me-3">
@@ -109,52 +121,63 @@
109
121
  <div class="flex-grow-1">
110
122
  <h3 class="dropdown-item-title">
111
123
  Nora Silvester
112
- <span class="float-end fs-7 text-warning"><i class="fa-solid fa-star"></i></span>
124
+ <span class="float-end fs-7 text-warning">
125
+ <i class="bi bi-star-fill"></i>
126
+ </span>
113
127
  </h3>
114
128
  <p class="fs-7">The subject goes here</p>
115
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
129
+ <p class="fs-7 text-secondary">
130
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
131
+ </p>
116
132
  </div>
117
133
  </div>
118
- <!-- Message End -->
134
+ <!--end::Message-->
119
135
  </a>
120
136
  <div class="dropdown-divider"></div>
121
137
  <a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
122
138
  </div>
123
139
  </li>
124
- <!-- Notifications Dropdown Menu -->
140
+ <!--end::Messages Dropdown Menu-->
141
+
142
+ <!--begin::Notifications Dropdown Menu-->
125
143
  <li class="nav-item dropdown">
126
144
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
127
- <i class="fa-regular fa-bell"></i>
145
+ <i class="bi bi-bell-fill"></i>
128
146
  <span class="navbar-badge badge text-bg-warning">15</span>
129
147
  </a>
130
148
  <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
131
149
  <span class="dropdown-item dropdown-header">15 Notifications</span>
132
150
  <div class="dropdown-divider"></div>
133
151
  <a href="#" class="dropdown-item">
134
- <i class="fa-solid fa-envelope me-2"></i> 4 new messages
152
+ <i class="bi bi-envelope me-2"></i> 4 new messages
135
153
  <span class="float-end text-secondary fs-7">3 mins</span>
136
154
  </a>
137
155
  <div class="dropdown-divider"></div>
138
156
  <a href="#" class="dropdown-item">
139
- <i class="fa-solid fa-users me-2"></i> 8 friend requests
157
+ <i class="bi bi-people-fill me-2"></i> 8 friend requests
140
158
  <span class="float-end text-secondary fs-7">12 hours</span>
141
159
  </a>
142
160
  <div class="dropdown-divider"></div>
143
161
  <a href="#" class="dropdown-item">
144
- <i class="fa-solid fa-file me-2"></i> 3 new reports
162
+ <i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
145
163
  <span class="float-end text-secondary fs-7">2 days</span>
146
164
  </a>
147
165
  <div class="dropdown-divider"></div>
148
- <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
166
+ <a href="#" class="dropdown-item dropdown-footer">
167
+ See All Notifications
168
+ </a>
149
169
  </div>
150
170
  </li>
171
+ <!--end::Notifications Dropdown Menu-->
172
+
173
+ <!--begin::User Menu Dropdown-->
151
174
  <li class="nav-item dropdown user-menu">
152
175
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
153
176
  <img src="../../../../dist/assets/img/user2-160x160.jpg" class="user-image rounded-circle shadow" alt="User Image">
154
177
  <span class="d-none d-md-inline">Alexander Pierce</span>
155
178
  </a>
156
179
  <ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
157
- <!-- User image -->
180
+ <!--begin::User Image-->
158
181
  <li class="user-header text-bg-primary">
159
182
  <img src="../../../../dist/assets/img/user2-160x160.jpg" class="rounded-circle shadow" alt="User Image">
160
183
 
@@ -163,8 +186,10 @@
163
186
  <small>Member since Nov. 2023</small>
164
187
  </p>
165
188
  </li>
166
- <!-- Menu Body -->
189
+ <!--end::User Image-->
190
+ <!--begin::Menu Body-->
167
191
  <li class="user-body">
192
+ <!--begin::Row-->
168
193
  <div class="row">
169
194
  <div class="col-4 text-center">
170
195
  <a href="#">Followers</a>
@@ -176,184 +201,203 @@
176
201
  <a href="#">Friends</a>
177
202
  </div>
178
203
  </div>
179
- <!-- /.row -->
204
+ <!--end::Row-->
180
205
  </li>
181
- <!-- Menu Footer-->
206
+ <!--end::Menu Body-->
207
+ <!--begin::Menu Footer-->
182
208
  <li class="user-footer">
183
209
  <a href="#" class="btn btn-default btn-flat">Profile</a>
184
210
  <a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
185
211
  </li>
212
+ <!--end::Menu Footer-->
186
213
  </ul>
187
214
  </li>
188
- <!-- TODO tackel in v4.1 -->
189
- <!-- <li class="nav-item">
190
- <a class="nav-link" data-widget="fullscreen" href="#" role="button">
191
- <i class="fa-solid fa-expand-arrows-alt"></i>
192
- </a>
193
- </li>
194
- <li class="nav-item">
195
- <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">
196
- <i class="fa-solid fa-th-large"></i>
197
- </a>
198
- </li> -->
215
+ <!--end::User Menu Dropdown-->
199
216
  </ul>
217
+ <!--end::End Navbar Links-->
200
218
  </div>
219
+ <!--end::Container-->
201
220
  </nav>
202
- <!-- /.navbar -->
203
- <!-- Sidebar Container -->
221
+ <!--end::Header-->
222
+ <!--begin::Sidebar-->
204
223
  <aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
224
+ <!--begin::Sidebar Brand-->
205
225
  <div class="sidebar-brand">
206
- <a href="../../../index.html" class="brand-link">
226
+ <!--begin::Brand Link-->
227
+ <a href="../../index.html" class="brand-link">
228
+ <!--begin::Brand Image-->
207
229
  <img src="../../../../dist/assets/img/AdminLTELogo.png" alt="AdminLTE Logo" class="brand-image opacity-75 shadow">
230
+ <!--end::Brand Image-->
231
+ <!--begin::Brand Text-->
208
232
  <span class="brand-text fw-light">AdminLTE 4</span>
233
+ <!--end::Brand Text-->
209
234
  </a>
235
+ <!--end::Brand Link-->
210
236
  </div>
211
- <!-- Sidebar -->
237
+ <!--end::Sidebar Brand-->
238
+ <!--begin::Sidebar Wrapper-->
212
239
  <div class="sidebar-wrapper">
213
240
  <nav class="mt-2">
214
- <!-- Sidebar Menu -->
241
+ <!--begin::Sidebar Menu-->
215
242
  <ul class="nav sidebar-menu flex-column" data-lte-toggle="treeview" role="menu" data-accordion="false">
216
243
  <li class="nav-item">
217
- <a href="javascript:;" class="nav-link">
218
- <i class="nav-icon fa-solid fa-gauge-high"></i>
244
+ <a href="#" class="nav-link">
245
+ <i class="nav-icon bi bi-speedometer"></i>
219
246
  <p>
220
247
  Dashboard
221
- <i class="nav-arrow fa-solid fa-angle-right"></i>
248
+ <i class="nav-arrow bi bi-chevron-right"></i>
222
249
  </p>
223
250
  </a>
224
251
  <ul class="nav nav-treeview">
225
252
  <li class="nav-item">
226
- <a href="../../../index.html" class="nav-link">
227
- <i class="nav-icon fa-regular fa-circle"></i>
253
+ <a href="../../index.html" class="nav-link">
254
+ <i class="nav-icon bi bi-circle"></i>
228
255
  <p>Dashboard v1</p>
229
256
  </a>
230
257
  </li>
231
258
  <li class="nav-item">
232
- <a href="../../../index2.html" class="nav-link">
233
- <i class="nav-icon fa-regular fa-circle"></i>
259
+ <a href="../../index2.html" class="nav-link">
260
+ <i class="nav-icon bi bi-circle"></i>
234
261
  <p>Dashboard v2</p>
235
262
  </a>
236
263
  </li>
237
264
  <li class="nav-item">
238
- <a href="../../../index3.html" class="nav-link">
239
- <i class="nav-icon fa-regular fa-circle"></i>
265
+ <a href="../../index3.html" class="nav-link">
266
+ <i class="nav-icon bi bi-circle"></i>
240
267
  <p>Dashboard v3</p>
241
268
  </a>
242
269
  </li>
243
270
  </ul>
244
271
  </li>
245
272
  <li class="nav-item">
246
- <a href="javascript:;" class="nav-link">
247
- <i class="nav-icon fa-solid fa-box-open"></i>
273
+ <a href="#" class="nav-link">
274
+ <i class="nav-icon bi bi-box-seam-fill"></i>
248
275
  <p>
249
276
  Widgets
250
- <i class="nav-arrow fa-solid fa-angle-right"></i>
277
+ <i class="nav-arrow bi bi-chevron-right"></i>
251
278
  </p>
252
279
  </a>
253
280
  <ul class="nav nav-treeview">
254
281
  <li class="nav-item">
255
- <a href="../../../widgets/small-box.html" class="nav-link">
256
- <i class="nav-icon fa-regular fa-circle"></i>
282
+ <a href="../../widgets/small-box.html" class="nav-link">
283
+ <i class="nav-icon bi bi-circle"></i>
257
284
  <p>Small Box</p>
258
285
  </a>
259
286
  </li>
260
287
  <li class="nav-item">
261
- <a href="../../../widgets/info-box.html" class="nav-link">
262
- <i class="nav-icon fa-regular fa-circle"></i>
288
+ <a href="../../widgets/info-box.html" class="nav-link">
289
+ <i class="nav-icon bi bi-circle"></i>
263
290
  <p>info Box</p>
264
291
  </a>
265
292
  </li>
266
293
  <li class="nav-item">
267
- <a href="../../../widgets/cards.html" class="nav-link">
268
- <i class="nav-icon fa-regular fa-circle"></i>
294
+ <a href="../../widgets/cards.html" class="nav-link">
295
+ <i class="nav-icon bi bi-circle"></i>
269
296
  <p>Cards</p>
270
297
  </a>
271
298
  </li>
272
299
  </ul>
273
300
  </li>
274
-
275
301
  <li class="nav-item">
276
- <a href="javascript:;" class="nav-link">
277
- <i class="nav-icon fa-solid fa-copy"></i>
302
+ <a href="#" class="nav-link">
303
+ <i class="nav-icon bi bi-clipboard-fill"></i>
278
304
  <p>
279
305
  Layout Options
280
- <span class="nav-badge badge text-bg-secondary opacity-75 me-3">6</span>
281
- <i class="nav-arrow fa-solid fa-angle-right"></i>
306
+ <span class="nav-badge badge text-bg-secondary me-3">6</span>
307
+ <i class="nav-arrow bi bi-chevron-right"></i>
282
308
  </p>
283
309
  </a>
284
310
  <ul class="nav nav-treeview">
285
311
  <li class="nav-item">
286
- <a href="../../../layout/unfixed-sidebar.html" class="nav-link">
287
- <i class="nav-icon fa-regular fa-circle"></i>
288
- <p>Unfixed Sidebar</p>
312
+ <a href="../../layout/unfixed-sidebar.html" class="nav-link">
313
+ <i class="nav-icon bi bi-circle"></i>
314
+ <p>Default Sidebar</p>
289
315
  </a>
290
316
  </li>
291
317
  <li class="nav-item">
292
- <a href="../../../layout/fixed-sidebar.html" class="nav-link">
293
- <i class="nav-icon fa-regular fa-circle"></i>
318
+ <a href="../../layout/fixed-sidebar.html" class="nav-link">
319
+ <i class="nav-icon bi bi-circle"></i>
294
320
  <p>Fixed Sidebar</p>
295
321
  </a>
296
322
  </li>
297
323
  <li class="nav-item">
298
- <a href="../../../layout/sidebar-mini.html" class="nav-link">
299
- <i class="nav-icon fa-regular fa-circle"></i>
324
+ <a href="../../layout/fixed-complete.html" class="nav-link">
325
+ <i class="nav-icon bi bi-circle"></i>
326
+ <p>Fixed Complete</p>
327
+ </a>
328
+ </li>
329
+ <li class="nav-item">
330
+ <a href="../../layout/sidebar-mini.html" class="nav-link">
331
+ <i class="nav-icon bi bi-circle"></i>
300
332
  <p>Sidebar Mini</p>
301
333
  </a>
302
334
  </li>
303
335
  <li class="nav-item">
304
- <a href="../../../layout/layout-rtl.html" class="nav-link">
305
- <i class="nav-icon fa-regular fa-circle"></i>
336
+ <a href="../../layout/collapsed-sidebar.html" class="nav-link">
337
+ <i class="nav-icon bi bi-circle"></i>
338
+ <p>Sidebar Mini <small>+ Collapsed</small></p>
339
+ </a>
340
+ </li>
341
+ <li class="nav-item">
342
+ <a href="../../layout/logo-switch.html" class="nav-link">
343
+ <i class="nav-icon bi bi-circle"></i>
344
+ <p>Sidebar Mini <small>+ Logo Switch</small></p>
345
+ </a>
346
+ </li>
347
+ <li class="nav-item">
348
+ <a href="../../layout/layout-rtl.html" class="nav-link">
349
+ <i class="nav-icon bi bi-circle"></i>
306
350
  <p>Layout RTL</p>
307
351
  </a>
308
352
  </li>
309
353
  </ul>
310
354
  </li>
311
355
  <li class="nav-item">
312
- <a href="javascript:;" class="nav-link">
313
- <i class="nav-icon fa-solid fa-tree"></i>
356
+ <a href="#" class="nav-link">
357
+ <i class="nav-icon bi bi-tree-fill"></i>
314
358
  <p>
315
359
  UI Elements
316
- <i class="nav-arrow fa-solid fa-angle-right"></i>
360
+ <i class="nav-arrow bi bi-chevron-right"></i>
317
361
  </p>
318
362
  </a>
319
363
  <ul class="nav nav-treeview">
320
364
  <li class="nav-item">
321
- <a href="../../../UI/timeline.html" class="nav-link">
322
- <i class="nav-icon fa-regular fa-circle"></i>
365
+ <a href="../../UI/timeline.html" class="nav-link">
366
+ <i class="nav-icon bi bi-circle"></i>
323
367
  <p>Timeline</p>
324
368
  </a>
325
369
  </li>
326
370
  </ul>
327
371
  </li>
328
372
  <li class="nav-item">
329
- <a href="javascript:;" class="nav-link">
330
- <i class="nav-icon fa-solid fa-pen-to-square"></i>
373
+ <a href="#" class="nav-link">
374
+ <i class="nav-icon bi bi-pencil-square"></i>
331
375
  <p>
332
376
  Forms
333
- <i class="nav-arrow fa-solid fa-angle-right"></i>
377
+ <i class="nav-arrow bi bi-chevron-right"></i>
334
378
  </p>
335
379
  </a>
336
380
  <ul class="nav nav-treeview">
337
381
  <li class="nav-item">
338
- <a href="../../../forms/general.html" class="nav-link">
339
- <i class="nav-icon fa-regular fa-circle"></i>
382
+ <a href="../../forms/general.html" class="nav-link">
383
+ <i class="nav-icon bi bi-circle"></i>
340
384
  <p>General Elements</p>
341
385
  </a>
342
386
  </li>
343
387
  </ul>
344
388
  </li>
345
389
  <li class="nav-item">
346
- <a href="javascript:;" class="nav-link">
347
- <i class="nav-icon fa-solid fa-table"></i>
390
+ <a href="#" class="nav-link">
391
+ <i class="nav-icon bi bi-table"></i>
348
392
  <p>
349
393
  Tables
350
- <i class="nav-arrow fa-solid fa-angle-right"></i>
394
+ <i class="nav-arrow bi bi-chevron-right"></i>
351
395
  </p>
352
396
  </a>
353
397
  <ul class="nav nav-treeview">
354
398
  <li class="nav-item">
355
- <a href="../../../tables/simple.html" class="nav-link">
356
- <i class="nav-icon fa-regular fa-circle"></i>
399
+ <a href="../../tables/simple.html" class="nav-link">
400
+ <i class="nav-icon bi bi-circle"></i>
357
401
  <p>Simple Tables</p>
358
402
  </a>
359
403
  </li>
@@ -362,24 +406,64 @@
362
406
 
363
407
  <li class="nav-header">EXAMPLES</li>
364
408
  <li class="nav-item">
365
- <a href="javascript:;" class="nav-link">
366
- <i class="nav-icon fa-solid fa-arrow-right-to-bracket"></i>
409
+ <a href="#" class="nav-link">
410
+ <i class="nav-icon bi bi-box-arrow-in-right"></i>
367
411
  <p>
368
- Login & Register
369
- <i class="nav-arrow fa-solid fa-angle-right"></i>
412
+ Auth
413
+ <i class="nav-arrow bi bi-chevron-right"></i>
370
414
  </p>
371
415
  </a>
372
416
  <ul class="nav nav-treeview">
373
417
  <li class="nav-item">
374
- <a href="../../../examples/login.html" class="nav-link ">
375
- <i class="nav-icon fa-regular fa-circle"></i>
376
- <p>Login v1</p>
418
+ <a href="#" class="nav-link">
419
+ <i class="nav-icon bi bi-box-arrow-in-right"></i>
420
+ <p>
421
+ Version 1
422
+ <i class="nav-arrow bi bi-chevron-right"></i>
423
+ </p>
424
+ </a>
425
+ <ul class="nav nav-treeview">
426
+ <li class="nav-item">
427
+ <a href="../../examples/login.html" class="nav-link">
428
+ <i class="nav-icon bi bi-circle"></i>
429
+ <p>Login</p>
430
+ </a>
431
+ </li>
432
+ <li class="nav-item">
433
+ <a href="../../examples/register.html" class="nav-link">
434
+ <i class="nav-icon bi bi-circle"></i>
435
+ <p>Register</p>
436
+ </a>
437
+ </li>
438
+ </ul>
439
+ </li>
440
+ <li class="nav-item">
441
+ <a href="#" class="nav-link">
442
+ <i class="nav-icon bi bi-box-arrow-in-right"></i>
443
+ <p>
444
+ Version 2
445
+ <i class="nav-arrow bi bi-chevron-right"></i>
446
+ </p>
377
447
  </a>
448
+ <ul class="nav nav-treeview">
449
+ <li class="nav-item">
450
+ <a href="../../examples/login-v2.html" class="nav-link">
451
+ <i class="nav-icon bi bi-circle"></i>
452
+ <p>Login</p>
453
+ </a>
454
+ </li>
455
+ <li class="nav-item">
456
+ <a href="../../examples/register-v2.html" class="nav-link">
457
+ <i class="nav-icon bi bi-circle"></i>
458
+ <p>Register</p>
459
+ </a>
460
+ </li>
461
+ </ul>
378
462
  </li>
379
463
  <li class="nav-item">
380
- <a href="../../../examples/register.html" class="nav-link ">
381
- <i class="nav-icon fa-regular fa-circle"></i>
382
- <p>Register v1</p>
464
+ <a href="../../examples/lockscreen.html" class="nav-link">
465
+ <i class="nav-icon bi bi-circle"></i>
466
+ <p>Lockscreen</p>
383
467
  </a>
384
468
  </li>
385
469
  </ul>
@@ -387,140 +471,187 @@
387
471
 
388
472
  <li class="nav-header">DOCUMENTATIONS</li>
389
473
  <li class="nav-item">
390
- <a href="../../../docs/index.html" class="nav-link">
391
- <i class="nav-icon fa-solid fa-download"></i>
474
+ <a href="../../docs/introduction.html" class="nav-link">
475
+ <i class="nav-icon bi bi-download"></i>
392
476
  <p>Installation</p>
393
477
  </a>
394
478
  </li>
395
479
  <li class="nav-item">
396
- <a href="../../../docs/layout.html" class="nav-link">
397
- <i class="nav-icon fa-solid fa-grip"></i>
480
+ <a href="../../docs/layout.html" class="nav-link">
481
+ <i class="nav-icon bi bi-grip-horizontal"></i>
398
482
  <p>Layout</p>
399
483
  </a>
400
484
  </li>
401
485
  <li class="nav-item">
402
- <a href="../../../docs/color-mode.html" class="nav-link">
403
- <i class="nav-icon fa-solid fa-star-half-stroke"></i>
486
+ <a href="../../docs/color-mode.html" class="nav-link">
487
+ <i class="nav-icon bi bi-star-half"></i>
404
488
  <p>Color Mode</p>
405
489
  </a>
406
490
  </li>
407
491
  <li class="nav-item menu-open">
408
- <a href="javascript:;" class="nav-link active">
409
- <i class="nav-icon fa-solid fa-swatchbook"></i>
492
+ <a href="#" class="nav-link active">
493
+ <i class="nav-icon bi bi-ui-checks-grid"></i>
410
494
  <p>
411
495
  Components
412
- <i class="nav-arrow fa-solid fa-angle-right"></i>
496
+ <i class="nav-arrow bi bi-chevron-right"></i>
413
497
  </p>
414
498
  </a>
415
499
  <ul class="nav nav-treeview">
416
500
  <li class="nav-item">
417
- <a href="../../../docs/components/main-header.html" class="nav-link active">
418
- <i class="nav-icon fa-regular fa-circle"></i>
501
+ <a href="../../docs/components/main-header.html" class="nav-link active">
502
+ <i class="nav-icon bi bi-circle"></i>
419
503
  <p>Main Header</p>
420
504
  </a>
421
505
  </li>
506
+ <li class="nav-item">
507
+ <a href="../../docs/components/main-sidebar.html" class="nav-link">
508
+ <i class="nav-icon bi bi-circle"></i>
509
+ <p>Main Sidebar</p>
510
+ </a>
511
+ </li>
512
+ </ul>
513
+ </li>
514
+ <li class="nav-item">
515
+ <a href="#" class="nav-link">
516
+ <i class="nav-icon bi bi-filetype-js"></i>
517
+ <p>
518
+ Javascript
519
+ <i class="nav-arrow bi bi-chevron-right"></i>
520
+ </p>
521
+ </a>
522
+ <ul class="nav nav-treeview">
523
+ <li class="nav-item">
524
+ <a href="../../docs/javascript/treeview.html" class="nav-link">
525
+ <i class="nav-icon bi bi-circle"></i>
526
+ <p>Treeview</p>
527
+ </a>
528
+ </li>
422
529
  </ul>
423
530
  </li>
424
531
  <li class="nav-item">
425
- <a href="../../../docs/browser-support.html" class="nav-link">
426
- <i class="nav-icon fa-solid fa-edge"></i>
532
+ <a href="../../docs/browser-support.html" class="nav-link">
533
+ <i class="nav-icon bi bi-browser-edge"></i>
427
534
  <p>Browser Support</p>
428
535
  </a>
429
536
  </li>
537
+ <li class="nav-item">
538
+ <a href="../../docs/how-to-contribute.html" class="nav-link">
539
+ <i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
540
+ <p>How To Contribute</p>
541
+ </a>
542
+ </li>
543
+ <li class="nav-item">
544
+ <a href="../../docs/faq.html" class="nav-link">
545
+ <i class="nav-icon bi bi-question-circle-fill"></i>
546
+ <p>FAQ</p>
547
+ </a>
548
+ </li>
549
+ <li class="nav-item">
550
+ <a href="../../docs/license.html" class="nav-link">
551
+ <i class="nav-icon bi bi-patch-check-fill"></i>
552
+ <p>License</p>
553
+ </a>
554
+ </li>
430
555
 
431
556
  <li class="nav-header">MULTI LEVEL EXAMPLE</li>
432
557
  <li class="nav-item">
433
- <a href="javascript:;" class="nav-link">
434
- <i class="nav-icon fa-solid fa-circle"></i>
558
+ <a href="#" class="nav-link">
559
+ <i class="nav-icon bi bi-circle-fill"></i>
435
560
  <p>Level 1</p>
436
561
  </a>
437
562
  </li>
438
563
  <li class="nav-item">
439
- <a href="javascript:;" class="nav-link">
440
- <i class="nav-icon fa-solid fa-circle"></i>
564
+ <a href="#" class="nav-link">
565
+ <i class="nav-icon bi bi-circle-fill"></i>
441
566
  <p>
442
567
  Level 1
443
- <i class="nav-arrow fa-solid fa-angle-right"></i>
568
+ <i class="nav-arrow bi bi-chevron-right"></i>
444
569
  </p>
445
570
  </a>
446
571
  <ul class="nav nav-treeview">
447
572
  <li class="nav-item">
448
- <a href="javascript:;" class="nav-link">
449
- <i class="nav-icon fa-regular fa-circle"></i>
573
+ <a href="#" class="nav-link">
574
+ <i class="nav-icon bi bi-circle"></i>
450
575
  <p>Level 2</p>
451
576
  </a>
452
577
  </li>
453
578
  <li class="nav-item">
454
- <a href="javascript:;" class="nav-link">
455
- <i class="nav-icon fa-regular fa-circle"></i>
579
+ <a href="#" class="nav-link">
580
+ <i class="nav-icon bi bi-circle"></i>
456
581
  <p>
457
582
  Level 2
458
- <i class="nav-arrow fa-solid fa-angle-right"></i>
583
+ <i class="nav-arrow bi bi-chevron-right"></i>
459
584
  </p>
460
585
  </a>
461
586
  <ul class="nav nav-treeview">
462
587
  <li class="nav-item">
463
- <a href="javascript:;" class="nav-link">
464
- <i class="nav-icon fa-regular fa-dot-circle"></i>
588
+ <a href="#" class="nav-link">
589
+ <i class="nav-icon bi bi-record-circle-fill"></i>
465
590
  <p>Level 3</p>
466
591
  </a>
467
592
  </li>
468
593
  <li class="nav-item">
469
- <a href="javascript:;" class="nav-link">
470
- <i class="nav-icon fa-regular fa-dot-circle"></i>
594
+ <a href="#" class="nav-link">
595
+ <i class="nav-icon bi bi-record-circle-fill"></i>
471
596
  <p>Level 3</p>
472
597
  </a>
473
598
  </li>
474
599
  <li class="nav-item">
475
- <a href="javascript:;" class="nav-link">
476
- <i class="nav-icon fa-regular fa-dot-circle"></i>
600
+ <a href="#" class="nav-link">
601
+ <i class="nav-icon bi bi-record-circle-fill"></i>
477
602
  <p>Level 3</p>
478
603
  </a>
479
604
  </li>
480
605
  </ul>
481
606
  </li>
482
607
  <li class="nav-item">
483
- <a href="javascript:;" class="nav-link">
484
- <i class="nav-icon fa-regular fa-circle"></i>
608
+ <a href="#" class="nav-link">
609
+ <i class="nav-icon bi bi-circle"></i>
485
610
  <p>Level 2</p>
486
611
  </a>
487
612
  </li>
488
613
  </ul>
489
614
  </li>
490
615
  <li class="nav-item">
491
- <a href="javascript:;" class="nav-link">
492
- <i class="nav-icon fa-solid fa-circle"></i>
616
+ <a href="#" class="nav-link">
617
+ <i class="nav-icon bi bi-circle-fill"></i>
493
618
  <p>Level 1</p>
494
619
  </a>
495
620
  </li>
621
+
496
622
  <li class="nav-header">LABELS</li>
497
623
  <li class="nav-item">
498
- <a href="javascript:;" class="nav-link">
499
- <i class="nav-icon fa-regular fa-circle text-danger"></i>
624
+ <a href="#" class="nav-link">
625
+ <i class="nav-icon bi bi-circle text-danger"></i>
500
626
  <p class="text">Important</p>
501
627
  </a>
502
628
  </li>
503
629
  <li class="nav-item">
504
- <a href="javascript:;" class="nav-link">
505
- <i class="nav-icon fa-regular fa-circle text-warning"></i>
630
+ <a href="#" class="nav-link">
631
+ <i class="nav-icon bi bi-circle text-warning"></i>
506
632
  <p>Warning</p>
507
633
  </a>
508
634
  </li>
509
635
  <li class="nav-item">
510
- <a href="javascript:;" class="nav-link">
511
- <i class="nav-icon fa-regular fa-circle text-info"></i>
636
+ <a href="#" class="nav-link">
637
+ <i class="nav-icon bi bi-circle text-info"></i>
512
638
  <p>Informational</p>
513
639
  </a>
514
640
  </li>
515
641
  </ul>
642
+ <!--end::Sidebar Menu-->
516
643
  </nav>
517
644
  </div>
518
- <!-- /.sidebar -->
645
+ <!--end::Sidebar Wrapper-->
519
646
  </aside>
520
- <!-- Main content -->
647
+ <!--end::Sidebar-->
648
+ <!--begin::App Main-->
521
649
  <main class="app-main">
650
+ <!--begin::App Content Header-->
522
651
  <div class="app-content-header">
652
+ <!--begin::Container-->
523
653
  <div class="container-fluid">
654
+ <!--begin::Row-->
524
655
  <div class="row">
525
656
  <div class="col-sm-6">
526
657
  <h3 class="mb-0">Main Header Component</h3>
@@ -534,32 +665,44 @@
534
665
  </ol>
535
666
  </div>
536
667
  </div>
668
+ <!--end::Row-->
537
669
  </div>
670
+ <!--end::Container-->
538
671
  </div>
539
- <!-- Main content -->
672
+ <!--end::App Content Header-->
673
+ <!--begin::App Content-->
540
674
  <div class="app-content">
675
+ <!--begin::Container-->
541
676
  <div class="container-fluid">
542
677
  <div class="callout callout-warning mb-4">
543
678
  <h5 class="fw-bold">Reminder!</h5>
544
679
  <p>
545
- AdminLTE uses all of Bootstrap 5 components. It's a good start to review the [Bootstrap documentation](https://getbootstrap.com/) to get an idea of the various components that this documentation <b>does not</b> cover.
680
+ AdminLTE uses all of Bootstrap 5 components. It's a good start
681
+ to review the [Bootstrap
682
+ documentation](https://getbootstrap.com/) to get an idea of the
683
+ various components that this documentation <b>does not</b> cover.
546
684
  </p>
547
685
  </div>
548
686
 
549
687
  <div class="callout callout-info mb-4">
550
688
  <h5 class="fw-bold">Tips!</h5>
551
689
  <p>
552
- If you go through the example pages and would like to copy a component, right-click on the component and choose “inspect element” to get to the HTML quicker than scanning the HTML page.
690
+ If you go through the example pages and would like to copy a
691
+ component, right-click on the component and choose “inspect
692
+ element” to get to the HTML quicker than scanning the HTML page.
553
693
  </p>
554
694
  </div>
555
695
 
556
696
  <!-- Navbar -->
557
697
  <nav class="navbar navbar-expand bg-body">
698
+ <!--begin::Container-->
558
699
  <div class="container-fluid">
559
700
  <!-- Start navbar links -->
560
701
  <ul class="navbar-nav">
561
702
  <li class="nav-item">
562
- <a class="nav-link" data-lte-toggle="sidebar" href="#" role="button"><i class="fa-solid fa-bars"></i></a>
703
+ <a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
704
+ <i class="bi bi-list"></i>
705
+ </a>
563
706
  </li>
564
707
  <li class="nav-item d-none d-md-block">
565
708
  <a href="#" class="nav-link">Home</a>
@@ -574,14 +717,14 @@
574
717
  <!-- Navbar Search -->
575
718
  <li class="nav-item">
576
719
  <a class="nav-link" data-widget="navbar-search" href="#" role="button">
577
- <i class="fa-solid fa-search"></i>
720
+ <i class="bi bi-search"></i>
578
721
  </a>
579
722
  </li>
580
723
 
581
724
  <!-- Messages Dropdown Menu -->
582
725
  <li class="nav-item dropdown">
583
726
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
584
- <i class="fa-regular fa-comments"></i>
727
+ <i class="bi bi-chat-text"></i>
585
728
  <span class="navbar-badge badge text-bg-danger">3</span>
586
729
  </a>
587
730
  <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
@@ -594,10 +737,14 @@
594
737
  <div class="flex-grow-1">
595
738
  <h3 class="dropdown-item-title">
596
739
  Brad Diesel
597
- <span class="float-end fs-7 text-danger"><i class="fa-solid fa-star"></i></span>
740
+ <span class="float-end fs-7 text-danger">
741
+ <i class="bi bi-star-fill"></i>
742
+ </span>
598
743
  </h3>
599
744
  <p class="fs-7">Call me whenever you can...</p>
600
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
745
+ <p class="fs-7 text-secondary">
746
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
747
+ </p>
601
748
  </div>
602
749
  </div>
603
750
  <!-- Message End -->
@@ -612,10 +759,14 @@
612
759
  <div class="flex-grow-1">
613
760
  <h3 class="dropdown-item-title">
614
761
  John Pierce
615
- <span class="float-end fs-7 text-secondary"><i class="fa-solid fa-star"></i></span>
762
+ <span class="float-end fs-7 text-secondary">
763
+ <i class="bi bi-star-fill"></i>
764
+ </span>
616
765
  </h3>
617
766
  <p class="fs-7">I got your message bro</p>
618
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
767
+ <p class="fs-7 text-secondary">
768
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
769
+ </p>
619
770
  </div>
620
771
  </div>
621
772
  <!-- Message End -->
@@ -630,43 +781,55 @@
630
781
  <div class="flex-grow-1">
631
782
  <h3 class="dropdown-item-title">
632
783
  Nora Silvester
633
- <span class="float-end fs-7 text-warning"><i class="fa-solid fa-star"></i></span>
784
+ <span class="float-end fs-7 text-warning">
785
+ <i class="bi bi-star-fill"></i>
786
+ </span>
634
787
  </h3>
635
788
  <p class="fs-7">The subject goes here</p>
636
- <p class="fs-7 text-secondary"><i class="fa-regular fa-clock me-1"></i> 4 Hours Ago</p>
789
+ <p class="fs-7 text-secondary">
790
+ <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
791
+ </p>
637
792
  </div>
638
793
  </div>
639
794
  <!-- Message End -->
640
795
  </a>
641
796
  <div class="dropdown-divider"></div>
642
- <a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
797
+ <a href="#" class="dropdown-item dropdown-footer">
798
+ See All Messages
799
+ </a>
643
800
  </div>
644
801
  </li>
645
802
  <!-- Notifications Dropdown Menu -->
646
803
  <li class="nav-item dropdown">
647
804
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
648
- <i class="fa-regular fa-bell"></i>
805
+ <i class="bi bi-bell-fill"></i>
649
806
  <span class="navbar-badge badge text-bg-warning">15</span>
650
807
  </a>
651
808
  <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
652
809
  <span class="dropdown-item dropdown-header">15 Notifications</span>
653
810
  <div class="dropdown-divider"></div>
654
811
  <a href="#" class="dropdown-item">
655
- <i class="fa-solid fa-envelope me-2"></i> 4 new messages
812
+ <i class="bi bi-envelope me-2"></i> 4 new messages
656
813
  <span class="float-end text-secondary fs-7">3 mins</span>
657
814
  </a>
658
815
  <div class="dropdown-divider"></div>
659
816
  <a href="#" class="dropdown-item">
660
- <i class="fa-solid fa-users me-2"></i> 8 friend requests
661
- <span class="float-end text-secondary fs-7">12 hours</span>
817
+ <i class="bi bi-people-fill me-2"></i> 8 friend requests
818
+ <span class="float-end text-secondary fs-7">
819
+ 12 hours
820
+ </span>
662
821
  </a>
663
822
  <div class="dropdown-divider"></div>
664
823
  <a href="#" class="dropdown-item">
665
- <i class="fa-solid fa-file me-2"></i> 3 new reports
666
- <span class="float-end text-secondary fs-7">2 days</span>
824
+ <i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
825
+ <span class="float-end text-secondary fs-7">
826
+ 2 days
827
+ </span>
667
828
  </a>
668
829
  <div class="dropdown-divider"></div>
669
- <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
830
+ <a href="#" class="dropdown-item dropdown-footer">
831
+ See All Notifications
832
+ </a>
670
833
  </div>
671
834
  </li>
672
835
  <li class="nav-item dropdown user-menu">
@@ -686,6 +849,7 @@
686
849
  </li>
687
850
  <!-- Menu Body -->
688
851
  <li class="user-body">
852
+ <!--begin::Row-->
689
853
  <div class="row">
690
854
  <div class="col-4 text-center">
691
855
  <a href="#">Followers</a>
@@ -697,230 +861,277 @@
697
861
  <a href="#">Friends</a>
698
862
  </div>
699
863
  </div>
700
- <!-- /.row -->
864
+ <!--end::Row-->
701
865
  </li>
702
866
  <!-- Menu Footer-->
703
867
  <li class="user-footer">
704
868
  <a href="#" class="btn btn-default btn-flat">Profile</a>
705
- <a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
869
+ <a href="#" class="btn btn-default btn-flat float-end">
870
+ Sign out
871
+ </a>
706
872
  </li>
707
873
  </ul>
708
874
  </li>
709
875
  </ul>
710
876
  </div>
877
+ <!--end::Container-->
711
878
  </nav>
712
879
  <!-- /.navbar -->
713
880
 
714
- <pre is:raw="" class="astro-code dark-plus" style="background-color: #1E1E1E; overflow-x: auto;" tabindex="0"><code><span class="line"><span style="color: #6A9955">&#x3C;!-- Navbar --></span></span>
715
- <span class="line"><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">nav</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"app-header navbar navbar-expand bg-body"</span><span style="color: #808080">></span></span>
716
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"container-fluid"</span><span style="color: #808080">></span></span>
717
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Start navbar links --></span></span>
718
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">ul</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"navbar-nav"</span><span style="color: #808080">></span></span>
719
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item"</span><span style="color: #808080">></span></span>
720
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data-lte-toggle</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"sidebar"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">role</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"button"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-bars"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
721
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
722
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item d-none d-md-block"</span><span style="color: #808080">></span></span>
723
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Home</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
724
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
725
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item d-none d-md-block"</span><span style="color: #808080">></span></span>
726
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Contact</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
727
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
728
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">ul</span><span style="color: #808080">></span></span>
729
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- End navbar links --></span></span>
881
+ <pre class="astro-code dark-plus" style="background-color:#1E1E1E;overflow-x:auto" tabindex="0"><code><span class="line"><span style="color:#6A9955">&lt;!-- Navbar --&gt;</span></span>
882
+ <span class="line"><span style="color:#808080">&lt;</span><span style="color:#569CD6">nav</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;app-header navbar navbar-expand bg-body&quot;</span><span style="color:#808080">&gt;</span></span>
883
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!--begin::Container--&gt;</span></span>
884
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;container-fluid&quot;</span><span style="color:#808080">&gt;</span></span>
885
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Start navbar links --&gt;</span></span>
886
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">ul</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;navbar-nav&quot;</span><span style="color:#808080">&gt;</span></span>
887
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item&quot;</span><span style="color:#808080">&gt;</span></span>
888
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">data-lte-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;sidebar&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">role</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;button&quot;</span><span style="color:#808080">&gt;</span></span>
889
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-list&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
890
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
891
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
892
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item d-none d-md-block&quot;</span><span style="color:#808080">&gt;</span></span>
893
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Home</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
894
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
895
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item d-none d-md-block&quot;</span><span style="color:#808080">&gt;</span></span>
896
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Contact</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
897
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
898
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">ul</span><span style="color:#808080">&gt;</span></span>
899
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- End navbar links --&gt;</span></span>
730
900
  <span class="line"></span>
731
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">ul</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"navbar-nav ms-auto"</span><span style="color: #808080">></span></span>
732
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Navbar Search --></span></span>
733
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item"</span><span style="color: #808080">></span></span>
734
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data-widget</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"navbar-search"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">role</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"button"</span><span style="color: #808080">></span></span>
735
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-search"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span></span>
736
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
737
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
901
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">ul</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;navbar-nav ms-auto&quot;</span><span style="color:#808080">&gt;</span></span>
902
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Navbar Search --&gt;</span></span>
903
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item&quot;</span><span style="color:#808080">&gt;</span></span>
904
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">data-widget</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;navbar-search&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">role</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;button&quot;</span><span style="color:#808080">&gt;</span></span>
905
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-search&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
906
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
907
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
738
908
  <span class="line"></span>
739
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Messages Dropdown Menu --></span></span>
740
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item dropdown"</span><span style="color: #808080">></span></span>
741
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data-bs-toggle</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #808080">></span></span>
742
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-regular fa-comments"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span></span>
743
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"navbar-badge badge text-bg-danger"</span><span style="color: #808080">></span><span style="color: #D4D4D4">3</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
744
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
745
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-menu dropdown-menu-lg dropdown-menu-end"</span><span style="color: #808080">></span></span>
746
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
747
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message Start --></span></span>
748
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"d-flex"</span><span style="color: #808080">></span></span>
749
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-shrink-0"</span><span style="color: #808080">></span></span>
750
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">img</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"../../../dist/assets/img/user1-128x128.jpg"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"User Avatar"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"img-size-50 rounded-circle me-3"</span><span style="color: #808080">></span></span>
751
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
752
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-grow-1"</span><span style="color: #808080">></span></span>
753
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">h3</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item-title"</span><span style="color: #808080">></span></span>
754
- <span class="line"><span style="color: #D4D4D4"> Brad Diesel</span></span>
755
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end fs-7 text-danger"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-star"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
756
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">h3</span><span style="color: #808080">></span></span>
757
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Call me whenever you can...</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
758
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7 text-secondary"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-regular fa-clock me-1"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 4 Hours Ago</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
759
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
760
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
761
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message End --></span></span>
762
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
763
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
764
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
765
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message Start --></span></span>
766
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"d-flex"</span><span style="color: #808080">></span></span>
767
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-shrink-0"</span><span style="color: #808080">></span></span>
768
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">img</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"../../../dist/assets/img/user8-128x128.jpg"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"User Avatar"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"img-size-50 rounded-circle me-3"</span><span style="color: #808080">></span></span>
769
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
770
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-grow-1"</span><span style="color: #808080">></span></span>
771
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">h3</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item-title"</span><span style="color: #808080">></span></span>
772
- <span class="line"><span style="color: #D4D4D4"> John Pierce</span></span>
773
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end fs-7 text-secondary"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-star"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
774
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">h3</span><span style="color: #808080">></span></span>
775
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">I got your message bro</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
776
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7 text-secondary"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-regular fa-clock me-1"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 4 Hours Ago</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
777
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
778
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
779
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message End --></span></span>
780
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
781
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
782
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
783
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message Start --></span></span>
784
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"d-flex"</span><span style="color: #808080">></span></span>
785
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-shrink-0"</span><span style="color: #808080">></span></span>
786
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">img</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"../../../dist/assets/img/user3-128x128.jpg"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"User Avatar"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"img-size-50 rounded-circle me-3"</span><span style="color: #808080">></span></span>
787
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
788
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"flex-grow-1"</span><span style="color: #808080">></span></span>
789
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">h3</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item-title"</span><span style="color: #808080">></span></span>
790
- <span class="line"><span style="color: #D4D4D4"> Nora Silvester</span></span>
791
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end fs-7 text-warning"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-star"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
792
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">h3</span><span style="color: #808080">></span></span>
793
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">The subject goes here</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
794
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fs-7 text-secondary"</span><span style="color: #808080">>&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-regular fa-clock me-1"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 4 Hours Ago</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
795
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
796
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
797
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Message End --></span></span>
798
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
799
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
800
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item dropdown-footer"</span><span style="color: #808080">></span><span style="color: #D4D4D4">See All Messages</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
801
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
802
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
803
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Notifications Dropdown Menu --></span></span>
804
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item dropdown"</span><span style="color: #808080">></span></span>
805
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data-bs-toggle</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #808080">></span></span>
806
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-regular fa-bell"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span></span>
807
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"navbar-badge badge text-bg-warning"</span><span style="color: #808080">></span><span style="color: #D4D4D4">15</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
808
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
809
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-menu dropdown-menu-lg dropdown-menu-end"</span><span style="color: #808080">></span></span>
810
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item dropdown-header"</span><span style="color: #808080">></span><span style="color: #D4D4D4">15 Notifications</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
811
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
812
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
813
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-envelope me-2"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 4 new messages</span></span>
814
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end text-secondary fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">3 mins</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
815
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
816
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
817
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
818
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-users me-2"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 8 friend requests</span></span>
819
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end text-secondary fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">12 hours</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
820
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
821
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
822
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item"</span><span style="color: #808080">></span></span>
823
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">i</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"fa-solid fa-file me-2"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">i</span><span style="color: #808080">></span><span style="color: #D4D4D4"> 3 new reports</span></span>
824
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"float-end text-secondary fs-7"</span><span style="color: #808080">></span><span style="color: #D4D4D4">2 days</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
825
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
826
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-divider"</span><span style="color: #808080">>&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
827
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-item dropdown-footer"</span><span style="color: #808080">></span><span style="color: #D4D4D4">See All Notifications</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
828
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
829
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
830
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-item dropdown user-menu"</span><span style="color: #808080">></span></span>
831
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"nav-link dropdown-toggle"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data-bs-toggle</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown"</span><span style="color: #808080">></span></span>
832
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">img</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"../../../dist/assets/img/user2-160x160.jpg"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"user-image rounded-circle shadow"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"User Image"</span><span style="color: #808080">></span></span>
833
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">span</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"d-none d-md-inline"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Alexander Pierce</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">span</span><span style="color: #808080">></span></span>
834
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
835
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">ul</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"dropdown-menu dropdown-menu-lg dropdown-menu-end"</span><span style="color: #808080">></span></span>
836
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- User image --></span></span>
837
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"user-header text-bg-primary"</span><span style="color: #808080">></span></span>
838
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">img</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"../../../dist/assets/img/user2-160x160.jpg"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"rounded-circle shadow"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"User Image"</span><span style="color: #808080">></span></span>
909
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Messages Dropdown Menu --&gt;</span></span>
910
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item dropdown&quot;</span><span style="color:#808080">&gt;</span></span>
911
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">data-bs-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#808080">&gt;</span></span>
912
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-chat-text&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
913
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;navbar-badge badge text-bg-danger&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">3</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
914
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
915
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-menu dropdown-menu-lg dropdown-menu-end&quot;</span><span style="color:#808080">&gt;</span></span>
916
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
917
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message Start --&gt;</span></span>
918
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;d-flex&quot;</span><span style="color:#808080">&gt;</span></span>
919
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-shrink-0&quot;</span><span style="color:#808080">&gt;</span></span>
920
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">img</span></span>
921
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;../../../dist/assets/img/user1-128x128.jpg&quot;</span></span>
922
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;User Avatar&quot;</span></span>
923
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;img-size-50 rounded-circle me-3&quot;</span></span>
924
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">/&gt;</span></span>
925
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
926
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-grow-1&quot;</span><span style="color:#808080">&gt;</span></span>
927
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">h3</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item-title&quot;</span><span style="color:#808080">&gt;</span></span>
928
+ <span class="line"><span style="color:#D4D4D4"> Brad Diesel</span></span>
929
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end fs-7 text-danger&quot;</span><span style="color:#808080">&gt;</span></span>
930
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-star-fill&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
931
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
932
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">h3</span><span style="color:#808080">&gt;</span></span>
933
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Call me whenever you can...</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
934
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7 text-secondary&quot;</span><span style="color:#808080">&gt;</span></span>
935
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-clock-fill me-1&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 4 Hours Ago</span></span>
936
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
937
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
938
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
939
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message End --&gt;</span></span>
940
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
941
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
942
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
943
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message Start --&gt;</span></span>
944
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;d-flex&quot;</span><span style="color:#808080">&gt;</span></span>
945
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-shrink-0&quot;</span><span style="color:#808080">&gt;</span></span>
946
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">img</span></span>
947
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;../../../dist/assets/img/user8-128x128.jpg&quot;</span></span>
948
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;User Avatar&quot;</span></span>
949
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;img-size-50 rounded-circle me-3&quot;</span></span>
950
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">/&gt;</span></span>
951
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
952
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-grow-1&quot;</span><span style="color:#808080">&gt;</span></span>
953
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">h3</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item-title&quot;</span><span style="color:#808080">&gt;</span></span>
954
+ <span class="line"><span style="color:#D4D4D4"> John Pierce</span></span>
955
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end fs-7 text-secondary&quot;</span><span style="color:#808080">&gt;</span></span>
956
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-star-fill&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
957
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
958
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">h3</span><span style="color:#808080">&gt;</span></span>
959
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">I got your message bro</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
960
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7 text-secondary&quot;</span><span style="color:#808080">&gt;</span></span>
961
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-clock-fill me-1&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 4 Hours Ago</span></span>
962
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
963
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
964
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
965
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message End --&gt;</span></span>
966
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
967
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
968
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
969
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message Start --&gt;</span></span>
970
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;d-flex&quot;</span><span style="color:#808080">&gt;</span></span>
971
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-shrink-0&quot;</span><span style="color:#808080">&gt;</span></span>
972
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">img</span></span>
973
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;../../../dist/assets/img/user3-128x128.jpg&quot;</span></span>
974
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;User Avatar&quot;</span></span>
975
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;img-size-50 rounded-circle me-3&quot;</span></span>
976
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">/&gt;</span></span>
977
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
978
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;flex-grow-1&quot;</span><span style="color:#808080">&gt;</span></span>
979
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">h3</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item-title&quot;</span><span style="color:#808080">&gt;</span></span>
980
+ <span class="line"><span style="color:#D4D4D4"> Nora Silvester</span></span>
981
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end fs-7 text-warning&quot;</span><span style="color:#808080">&gt;</span></span>
982
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-star-fill&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
983
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
984
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">h3</span><span style="color:#808080">&gt;</span></span>
985
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">The subject goes here</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
986
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;fs-7 text-secondary&quot;</span><span style="color:#808080">&gt;</span></span>
987
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-clock-fill me-1&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 4 Hours Ago</span></span>
988
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
989
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
990
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
991
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Message End --&gt;</span></span>
992
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
993
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
994
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item dropdown-footer&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">See All Messages</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
995
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
996
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
997
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Notifications Dropdown Menu --&gt;</span></span>
998
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item dropdown&quot;</span><span style="color:#808080">&gt;</span></span>
999
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">data-bs-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#808080">&gt;</span></span>
1000
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-bell-fill&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span></span>
1001
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;navbar-badge badge text-bg-warning&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">15</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1002
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1003
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-menu dropdown-menu-lg dropdown-menu-end&quot;</span><span style="color:#808080">&gt;</span></span>
1004
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item dropdown-header&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">15 Notifications</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1005
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1006
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
1007
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-envelope me-2&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 4 new messages</span></span>
1008
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end text-secondary fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">3 mins</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1009
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1010
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1011
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
1012
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-people-fill me-2&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 8 friend requests</span></span>
1013
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end text-secondary fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">12 hours</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1014
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1015
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1016
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item&quot;</span><span style="color:#808080">&gt;</span></span>
1017
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">i</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;bi bi-file-earmark-fill me-2&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">i</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4"> 3 new reports</span></span>
1018
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;float-end text-secondary fs-7&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">2 days</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1019
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1020
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-divider&quot;</span><span style="color:#808080">&gt;&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1021
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-item dropdown-footer&quot;</span><span style="color:#808080">&gt;</span></span>
1022
+ <span class="line"><span style="color:#D4D4D4"> See All Notifications</span></span>
1023
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1024
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1025
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
1026
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-item dropdown user-menu&quot;</span><span style="color:#808080">&gt;</span></span>
1027
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;nav-link dropdown-toggle&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">data-bs-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown&quot;</span><span style="color:#808080">&gt;</span></span>
1028
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">img</span></span>
1029
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;../../../dist/assets/img/user2-160x160.jpg&quot;</span></span>
1030
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;user-image rounded-circle shadow&quot;</span></span>
1031
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;User Image&quot;</span></span>
1032
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">/&gt;</span></span>
1033
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">span</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;d-none d-md-inline&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Alexander Pierce</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">span</span><span style="color:#808080">&gt;</span></span>
1034
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1035
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">ul</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;dropdown-menu dropdown-menu-lg dropdown-menu-end&quot;</span><span style="color:#808080">&gt;</span></span>
1036
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- User image --&gt;</span></span>
1037
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;user-header text-bg-primary&quot;</span><span style="color:#808080">&gt;</span></span>
1038
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">img</span></span>
1039
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;../../../dist/assets/img/user2-160x160.jpg&quot;</span></span>
1040
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;rounded-circle shadow&quot;</span></span>
1041
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;User Image&quot;</span></span>
1042
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">/&gt;</span></span>
839
1043
  <span class="line"></span>
840
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
841
- <span class="line"><span style="color: #D4D4D4"> Alexander Pierce - Web Developer</span></span>
842
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">small</span><span style="color: #808080">></span><span style="color: #D4D4D4">Member since Nov. 2023</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">small</span><span style="color: #808080">></span></span>
843
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">p</span><span style="color: #808080">></span></span>
844
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
845
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Menu Body --></span></span>
846
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"user-body"</span><span style="color: #808080">></span></span>
847
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"row"</span><span style="color: #808080">></span></span>
848
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"col-4 text-center"</span><span style="color: #808080">></span></span>
849
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Followers</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
850
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
851
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"col-4 text-center"</span><span style="color: #808080">></span></span>
852
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Sales</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
853
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
854
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"col-4 text-center"</span><span style="color: #808080">></span></span>
855
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Friends</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
856
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
857
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
858
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- /.row --></span></span>
859
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
860
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #6A9955">&#x3C;!-- Menu Footer--></span></span>
861
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">li</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"user-footer"</span><span style="color: #808080">></span></span>
862
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"btn btn-default btn-flat"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Profile</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
863
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;</span><span style="color: #569CD6">a</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">href</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"#"</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">class</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">"btn btn-default btn-flat float-end"</span><span style="color: #808080">></span><span style="color: #D4D4D4">Sign out</span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">a</span><span style="color: #808080">></span></span>
864
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
865
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">ul</span><span style="color: #808080">></span></span>
866
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">li</span><span style="color: #808080">></span></span>
867
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">ul</span><span style="color: #808080">></span></span>
868
- <span class="line"><span style="color: #D4D4D4"> </span><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">div</span><span style="color: #808080">></span></span>
869
- <span class="line"><span style="color: #808080">&#x3C;/</span><span style="color: #569CD6">nav</span><span style="color: #808080">></span></span>
870
- <span class="line"><span style="color: #6A9955">&#x3C;!-- /.navbar --></span></span></code></pre>
1044
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
1045
+ <span class="line"><span style="color:#D4D4D4"> Alexander Pierce - Web Developer</span></span>
1046
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">small</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Member since Nov. 2023</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">small</span><span style="color:#808080">&gt;</span></span>
1047
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">p</span><span style="color:#808080">&gt;</span></span>
1048
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
1049
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Menu Body --&gt;</span></span>
1050
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;user-body&quot;</span><span style="color:#808080">&gt;</span></span>
1051
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!--begin::Row--&gt;</span></span>
1052
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;row&quot;</span><span style="color:#808080">&gt;</span></span>
1053
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;col-4 text-center&quot;</span><span style="color:#808080">&gt;</span></span>
1054
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Followers</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1055
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1056
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;col-4 text-center&quot;</span><span style="color:#808080">&gt;</span></span>
1057
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Sales</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1058
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1059
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">div</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;col-4 text-center&quot;</span><span style="color:#808080">&gt;</span></span>
1060
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Friends</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1061
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1062
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1063
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!--end::Row--&gt;</span></span>
1064
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
1065
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!-- Menu Footer--&gt;</span></span>
1066
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">li</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;user-footer&quot;</span><span style="color:#808080">&gt;</span></span>
1067
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;btn btn-default btn-flat&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Profile</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1068
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;</span><span style="color:#569CD6">a</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;#&quot;</span><span style="color:#D4D4D4"> </span><span style="color:#9CDCFE">class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;btn btn-default btn-flat float-end&quot;</span><span style="color:#808080">&gt;</span><span style="color:#D4D4D4">Sign out</span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
1069
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
1070
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">ul</span><span style="color:#808080">&gt;</span></span>
1071
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">li</span><span style="color:#808080">&gt;</span></span>
1072
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">ul</span><span style="color:#808080">&gt;</span></span>
1073
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1074
+ <span class="line"><span style="color:#D4D4D4"> </span><span style="color:#6A9955">&lt;!--end::Container--&gt;</span></span>
1075
+ <span class="line"><span style="color:#808080">&lt;/</span><span style="color:#569CD6">nav</span><span style="color:#808080">&gt;</span></span>
1076
+ <span class="line"><span style="color:#6A9955">&lt;!-- /.navbar --&gt;</span></span></code></pre>
871
1077
  </div>
872
- <!-- /.container-fluid -->
1078
+ <!--end::Container-->
873
1079
  </div>
874
- <!-- /.content -->
1080
+ <!--end::App Content-->
875
1081
  </main>
876
- <!-- /.app-content -->
877
-
878
- <!-- Main Footer -->
1082
+ <!--end::App Main-->
1083
+ <!--begin::Footer-->
879
1084
  <footer class="app-footer">
880
- <!-- To the end -->
881
- <div class="float-end d-none d-sm-inline">
882
- Anything you want
883
- </div>
884
- <!-- Default to the start -->
885
- <strong>Copyright &copy; 2014-2023 <a href="https://adminlte.io">AdminLTE.io</a>.</strong> All rights reserved.
1085
+ <!--begin::To the end-->
1086
+ <div class="float-end d-none d-sm-inline">Anything you want</div>
1087
+ <!--end::To the end-->
1088
+ <!--begin::Copyright-->
1089
+ <strong>
1090
+ Copyright &copy; 2014-2023
1091
+ <a href="https://adminlte.io">AdminLTE.io</a>.
1092
+ </strong>
1093
+ All rights reserved.
1094
+ <!--end::Copyright-->
886
1095
  </footer>
1096
+ <!--end::Footer-->
887
1097
  </div>
888
- <!-- ./app-wrapper -->
889
-
890
- <!-- OPTIONAL SCRIPTS --><!-- overlayscrollbars -->
1098
+ <!--end::App Wrapper-->
1099
+ <!--begin::Script-->
1100
+ <!--begin::Third Party Plugin(OverlayScrollbars)-->
891
1101
  <script src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.1.0/browser/overlayscrollbars.browser.es6.min.js" integrity="sha256-NRZchBuHZWSXldqrtAOeCZpucH/1n1ToJ3C8mSK95NU=" crossorigin="anonymous"></script>
892
-
893
- <!-- @popperjs for Bootstrap 5 -->
1102
+ <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
894
1103
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.7/dist/umd/popper.min.js" integrity="sha384-zYPOMqeu1DAVkHiLqWBUTcbYfZ8osu1Nd6Z89ify25QV9guujx43ITvfi12/QExE" crossorigin="anonymous"></script>
895
-
896
- <!-- Bootstrap 5 -->
1104
+ <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
897
1105
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.min.js" integrity="sha384-Y4oOpwW3duJdCWv5ly8SCFYWqFDsfob/3GkgExXKV4idmbt98QcxXYs9UoXAB7BZ" crossorigin="anonymous"></script>
898
-
899
- <!-- REQUIRED SCRIPTS --><!-- AdminLTE App -->
1106
+ <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
900
1107
  <script src="../../../../dist/js/adminlte.js"></script>
901
-
902
- <!-- OPTIONAL SCRIPTS -->
1108
+ <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
903
1109
  <script>
904
- const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper'
1110
+ const SELECTOR_SIDEBAR_WRAPPER = ".sidebar-wrapper";
905
1111
  const Default = {
906
- scrollbarTheme: 'os-theme-light',
907
- scrollbarAutoHide: 'leave',
908
- scrollbarClickScroll: true
909
- }
1112
+ scrollbarTheme: "os-theme-light",
1113
+ scrollbarAutoHide: "leave",
1114
+ scrollbarClickScroll: true,
1115
+ };
910
1116
 
911
1117
  document.addEventListener("DOMContentLoaded", function() {
912
- const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER)
913
- if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
1118
+ const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
1119
+ if (
1120
+ sidebarWrapper &&
1121
+ typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== "undefined"
1122
+ ) {
914
1123
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
915
1124
  scrollbars: {
916
1125
  theme: Default.scrollbarTheme,
917
1126
  autoHide: Default.scrollbarAutoHide,
918
- clickScroll: Default.scrollbarClickScroll
919
- }
920
- })
1127
+ clickScroll: Default.scrollbarClickScroll,
1128
+ },
1129
+ });
921
1130
  }
922
- })
1131
+ });
923
1132
  </script>
924
- </body>
1133
+ <!--end::OverlayScrollbars Configure-->
1134
+ <!--end::Script-->
1135
+ </body><!--end::Body-->
925
1136
 
926
1137
  </html>