Home Verkennen Help
Registreren Inloggen
wilson.silva
/
AdminLte
spiegel van https://github.com/almasaeed2010/AdminLTE
1
0
Vork 0
Bestanden Issues 0 Wiki
Boom: 73e0d48805
Aftakkingen Labels
AdminLte
/
dist
/
index2.html

index2.html 86 KB
Geschiedenis Ruwe

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073 
  1. <!doctype html>
    2. 

  2. <html lang="en">
    3. 

  3.   <!--begin::Head-->
    4. 

  4.   <head>
    5. 

  5.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    6. 

  6.     <title>AdminLTE | Dashboard v2</title>
    7. 

  7. 

  8.     <!--begin::Accessibility Meta Tags-->
    9. 

  9.     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
    10. 

  10.     <meta name="color-scheme" content="light dark" />
    11. 

  11.     <meta name="theme-color" content="#007bff" media="(prefers-color-scheme: light)" />
    12. 

  12.     <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
    13. 

  13.     <!--end::Accessibility Meta Tags-->
    14. 

  14. 

  15.     <!--begin::Primary Meta Tags-->
    16. 

  16.     <meta name="title" content="AdminLTE | Dashboard v2" />
    17. 

  17.     <meta name="author" content="ColorlibHQ" />
    18. 

  18.     <meta
    19. 

  19.       name="description"
    20. 

  20.       content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS. Fully accessible with WCAG 2.1 AA compliance."
    21. 

  21.     />
    22. 

  22.     <meta
    23. 

  23.       name="keywords"
    24. 

  24.       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, accessible admin panel, WCAG compliant"
    25. 

  25.     />
    26. 

  26.     <!--end::Primary Meta Tags-->
    27. 

  27. 

  28.     <!--begin::Accessibility Features-->
    29. 

  29.     <!-- Skip links will be dynamically added by accessibility.js -->
    30. 

  30.     <meta name="supported-color-schemes" content="light dark" />
    31. 

  31.     <link rel="preload" href="./css/adminlte.css" as="style" />
    32. 

  32.     <!--end::Accessibility Features-->
    33. 

  33. 

  34.     <!--begin::Fonts-->
    35. 

  35.     <link
    36. 

  36.       rel="stylesheet"
    37. 

  37.       href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
    38. 

  38.       integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
    39. 

  39.       crossorigin="anonymous"
    40. 

  40.       media="print"
    41. 

  41.       onload="this.media = 'all'"
    42. 

  42.     />
    43. 

  43.     <!--end::Fonts-->
    44. 

  44. 

  45.     <!--begin::Third Party Plugin(OverlayScrollbars)-->
    46. 

  46.     <link
    47. 

  47.       rel="stylesheet"
    48. 

  48.       href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/styles/overlayscrollbars.min.css"
    49. 

  49.       crossorigin="anonymous"
    50. 

  50.     />
    51. 

  51.     <!--end::Third Party Plugin(OverlayScrollbars)-->
    52. 

  52. 

  53.     <!--begin::Third Party Plugin(Bootstrap Icons)-->
    54. 

  54.     <link
    55. 

  55.       rel="stylesheet"
    56. 

  56.       href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css"
    57. 

  57.       crossorigin="anonymous"
    58. 

  58.     />
    59. 

  59.     <!--end::Third Party Plugin(Bootstrap Icons)-->
    60. 

  60. 

  61.     <!--begin::Required Plugin(AdminLTE)-->
    62. 

  62.     <link rel="stylesheet" href="./css/adminlte.css" />
    63. 

  63.     <!--end::Required Plugin(AdminLTE)-->
    64. 

  64. 

  65.     <!-- apexcharts -->
    66. 

  66.     <link
    67. 

  67.       rel="stylesheet"
    68. 

  68.       href="https://cdn.jsdelivr.net/npm/apexcharts@3.37.1/dist/apexcharts.css"
    69. 

  69.       integrity="sha256-4MX+61mt9NVvvuPjUWdUdyfZfxSB1/Rf9WtqRHgG5S0="
    70. 

  70.       crossorigin="anonymous"
    71. 

  71.     />
    72. 

  72.   </head>
    73. 

  73. 

  74.   <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
    75. 

  75.     <!--begin::App Wrapper-->
    76. 

  76.     <div class="app-wrapper">
    77. 

  77.       <!--begin::Header-->
    78. 

  78.       <nav class="app-header navbar navbar-expand bg-body">
    79. 

  79.         <!--begin::Container-->
    80. 

  80.         <div class="container-fluid">
    81. 

  81.           <!--begin::Start Navbar Links-->
    82. 

  82.           <ul class="navbar-nav">
    83. 

  83.             <li class="nav-item">
    84. 

  84.               <a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
    85. 

  85.                 <i class="bi bi-list"></i>
    86. 

  86.               </a>
    87. 

  87.             </li>
    88. 

  88.             <li class="nav-item d-none d-md-block">
    89. 

  89.               <a href="#" class="nav-link">Home</a>
    90. 

  90.             </li>
    91. 

  91.             <li class="nav-item d-none d-md-block">
    92. 

  92.               <a href="#" class="nav-link">Contact</a>
    93. 

  93.             </li>
    94. 

  94.           </ul>
    95. 

  95.           <!--end::Start Navbar Links-->
    96. 

  96. 

  97.           <!--begin::End Navbar Links-->
    98. 

  98.           <ul class="navbar-nav ms-auto">
    99. 

  99.             <!--begin::Navbar Search-->
    100. 

  100.             <li class="nav-item">
    101. 

  101.               <a class="nav-link" data-widget="navbar-search" href="#" role="button">
    102. 

  102.                 <i class="bi bi-search"></i>
    103. 

  103.               </a>
    104. 

  104.             </li>
    105. 

  105.             <!--end::Navbar Search-->
    106. 

  106. 

  107.             <!--begin::Messages Dropdown Menu-->
    108. 

  108.             <li class="nav-item dropdown">
    109. 

  109.               <a class="nav-link" data-bs-toggle="dropdown" href="#">
    110. 

  110.                 <i class="bi bi-chat-text"></i>
    111. 

  111.                 <span class="navbar-badge badge text-bg-danger">3</span>
    112. 

  112.               </a>
    113. 

  113.               <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
    114. 

  114.                 <a href="#" class="dropdown-item">
    115. 

  115.                   <!--begin::Message-->
    116. 

  116.                   <div class="d-flex">
    117. 

  117.                     <div class="flex-shrink-0">
    118. 

  118.                       <img
    119. 

  119.                         src="./assets/img/user1-128x128.jpg"
    120. 

  120.                         alt="User Avatar"
    121. 

  121.                         class="img-size-50 rounded-circle me-3"
    122. 

  122.                       />
    123. 

  123.                     </div>
    124. 

  124.                     <div class="flex-grow-1">
    125. 

  125.                       <h3 class="dropdown-item-title">
    126. 

  126.                         Brad Diesel
    127. 

  127.                         <span class="float-end fs-7 text-danger"
    128. 

  128.                           ><i class="bi bi-star-fill"></i
    129. 

  129.                         ></span>
    130. 

  130.                       </h3>
    131. 

  131.                       <p class="fs-7">Call me whenever you can...</p>
    132. 

  132.                       <p class="fs-7 text-secondary">
    133. 

  133.                         <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
    134. 

  134.                       </p>
    135. 

  135.                     </div>
    136. 

  136.                   </div>
    137. 

  137.                   <!--end::Message-->
    138. 

  138.                 </a>
    139. 

  139.                 <div class="dropdown-divider"></div>
    140. 

  140.                 <a href="#" class="dropdown-item">
    141. 

  141.                   <!--begin::Message-->
    142. 

  142.                   <div class="d-flex">
    143. 

  143.                     <div class="flex-shrink-0">
    144. 

  144.                       <img
    145. 

  145.                         src="./assets/img/user8-128x128.jpg"
    146. 

  146.                         alt="User Avatar"
    147. 

  147.                         class="img-size-50 rounded-circle me-3"
    148. 

  148.                       />
    149. 

  149.                     </div>
    150. 

  150.                     <div class="flex-grow-1">
    151. 

  151.                       <h3 class="dropdown-item-title">
    152. 

  152.                         John Pierce
    153. 

  153.                         <span class="float-end fs-7 text-secondary">
    154. 

  154.                           <i class="bi bi-star-fill"></i>
    155. 

  155.                         </span>
    156. 

  156.                       </h3>
    157. 

  157.                       <p class="fs-7">I got your message bro</p>
    158. 

  158.                       <p class="fs-7 text-secondary">
    159. 

  159.                         <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
    160. 

  160.                       </p>
    161. 

  161.                     </div>
    162. 

  162.                   </div>
    163. 

  163.                   <!--end::Message-->
    164. 

  164.                 </a>
    165. 

  165.                 <div class="dropdown-divider"></div>
    166. 

  166.                 <a href="#" class="dropdown-item">
    167. 

  167.                   <!--begin::Message-->
    168. 

  168.                   <div class="d-flex">
    169. 

  169.                     <div class="flex-shrink-0">
    170. 

  170.                       <img
    171. 

  171.                         src="./assets/img/user3-128x128.jpg"
    172. 

  172.                         alt="User Avatar"
    173. 

  173.                         class="img-size-50 rounded-circle me-3"
    174. 

  174.                       />
    175. 

  175.                     </div>
    176. 

  176.                     <div class="flex-grow-1">
    177. 

  177.                       <h3 class="dropdown-item-title">
    178. 

  178.                         Nora Silvester
    179. 

  179.                         <span class="float-end fs-7 text-warning">
    180. 

  180.                           <i class="bi bi-star-fill"></i>
    181. 

  181.                         </span>
    182. 

  182.                       </h3>
    183. 

  183.                       <p class="fs-7">The subject goes here</p>
    184. 

  184.                       <p class="fs-7 text-secondary">
    185. 

  185.                         <i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
    186. 

  186.                       </p>
    187. 

  187.                     </div>
    188. 

  188.                   </div>
    189. 

  189.                   <!--end::Message-->
    190. 

  190.                 </a>
    191. 

  191.                 <div class="dropdown-divider"></div>
    192. 

  192.                 <a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
    193. 

  193.               </div>
    194. 

  194.             </li>
    195. 

  195.             <!--end::Messages Dropdown Menu-->
    196. 

  196. 

  197.             <!--begin::Notifications Dropdown Menu-->
    198. 

  198.             <li class="nav-item dropdown">
    199. 

  199.               <a class="nav-link" data-bs-toggle="dropdown" href="#">
    200. 

  200.                 <i class="bi bi-bell-fill"></i>
    201. 

  201.                 <span class="navbar-badge badge text-bg-warning">15</span>
    202. 

  202.               </a>
    203. 

  203.               <div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
    204. 

  204.                 <span class="dropdown-item dropdown-header">15 Notifications</span>
    205. 

  205.                 <div class="dropdown-divider"></div>
    206. 

  206.                 <a href="#" class="dropdown-item">
    207. 

  207.                   <i class="bi bi-envelope me-2"></i> 4 new messages
    208. 

  208.                   <span class="float-end text-secondary fs-7">3 mins</span>
    209. 

  209.                 </a>
    210. 

  210.                 <div class="dropdown-divider"></div>
    211. 

  211.                 <a href="#" class="dropdown-item">
    212. 

  212.                   <i class="bi bi-people-fill me-2"></i> 8 friend requests
    213. 

  213.                   <span class="float-end text-secondary fs-7">12 hours</span>
    214. 

  214.                 </a>
    215. 

  215.                 <div class="dropdown-divider"></div>
    216. 

  216.                 <a href="#" class="dropdown-item">
    217. 

  217.                   <i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
    218. 

  218.                   <span class="float-end text-secondary fs-7">2 days</span>
    219. 

  219.                 </a>
    220. 

  220.                 <div class="dropdown-divider"></div>
    221. 

  221.                 <a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
    222. 

  222.               </div>
    223. 

  223.             </li>
    224. 

  224.             <!--end::Notifications Dropdown Menu-->
    225. 

  225. 

  226.             <!--begin::Fullscreen Toggle-->
    227. 

  227.             <li class="nav-item">
    228. 

  228.               <a class="nav-link" href="#" data-lte-toggle="fullscreen">
    229. 

  229.                 <i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
    230. 

  230.                 <i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
    231. 

  231.               </a>
    232. 

  232.             </li>
    233. 

  233.             <!--end::Fullscreen Toggle-->
    234. 

  234. 

  235.             <!--begin::User Menu Dropdown-->
    236. 

  236.             <li class="nav-item dropdown user-menu">
    237. 

  237.               <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
    238. 

  238.                 <img
    239. 

  239.                   src="./assets/img/user2-160x160.jpg"
    240. 

  240.                   class="user-image rounded-circle shadow"
    241. 

  241.                   alt="User Image"
    242. 

  242.                 />
    243. 

  243.                 <span class="d-none d-md-inline">Alexander Pierce</span>
    244. 

  244.               </a>
    245. 

  245.               <ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
    246. 

  246.                 <!--begin::User Image-->
    247. 

  247.                 <li class="user-header text-bg-primary">
    248. 

  248.                   <img
    249. 

  249.                     src="./assets/img/user2-160x160.jpg"
    250. 

  250.                     class="rounded-circle shadow"
    251. 

  251.                     alt="User Image"
    252. 

  252.                   />
    253. 

  253.                   <p>
    254. 

  254.                     Alexander Pierce - Web Developer
    255. 

  255.                     <small>Member since Nov. 2023</small>
    256. 

  256.                   </p>
    257. 

  257.                 </li>
    258. 

  258.                 <!--end::User Image-->
    259. 

  259.                 <!--begin::Menu Body-->
    260. 

  260.                 <li class="user-body">
    261. 

  261.                   <!--begin::Row-->
    262. 

  262.                   <div class="row">
    263. 

  263.                     <div class="col-4 text-center">
    264. 

  264.                       <a href="#">Followers</a>
    265. 

  265.                     </div>
    266. 

  266.                     <div class="col-4 text-center">
    267. 

  267.                       <a href="#">Sales</a>
    268. 

  268.                     </div>
    269. 

  269.                     <div class="col-4 text-center">
    270. 

  270.                       <a href="#">Friends</a>
    271. 

  271.                     </div>
    272. 

  272.                   </div>
    273. 

  273.                   <!--end::Row-->
    274. 

  274.                 </li>
    275. 

  275.                 <!--end::Menu Body-->
    276. 

  276.                 <!--begin::Menu Footer-->
    277. 

  277.                 <li class="user-footer">
    278. 

  278.                   <a href="#" class="btn btn-outline-secondary">Profile</a>
    279. 

  279.                   <a href="#" class="btn btn-outline-danger float-end">Sign out</a>
    280. 

  280.                 </li>
    281. 

  281.                 <!--end::Menu Footer-->
    282. 

  282.               </ul>
    283. 

  283.             </li>
    284. 

  284.             <!--end::User Menu Dropdown-->
    285. 

  285.           </ul>
    286. 

  286.           <!--end::End Navbar Links-->
    287. 

  287.         </div>
    288. 

  288.         <!--end::Container-->
    289. 

  289.       </nav>
    290. 

  290.       <!--end::Header-->
    291. 

  291.       <!--begin::Sidebar-->
    292. 

  292.       <aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
    293. 

  293.         <!--begin::Sidebar Brand-->
    294. 

  294.         <div class="sidebar-brand">
    295. 

  295.           <!--begin::Brand Link-->
    296. 

  296.           <a href="./index.html" class="brand-link">
    297. 

  297.             <!--begin::Brand Image-->
    298. 

  298.             <img
    299. 

  299.               src="./assets/img/AdminLTELogo.png"
    300. 

  300.               alt="AdminLTE Logo"
    301. 

  301.               class="brand-image opacity-75 shadow"
    302. 

  302.             />
    303. 

  303.             <!--end::Brand Image-->
    304. 

  304.             <!--begin::Brand Text-->
    305. 

  305.             <span class="brand-text fw-light">AdminLTE 4</span>
    306. 

  306.             <!--end::Brand Text-->
    307. 

  307.           </a>
    308. 

  308.           <!--end::Brand Link-->
    309. 

  309.         </div>
    310. 

  310.         <!--end::Sidebar Brand-->
    311. 

  311.         <!--begin::Sidebar Wrapper-->
    312. 

  312.         <div class="sidebar-wrapper">
    313. 

  313.           <nav class="mt-2">
    314. 

  314.             <!--begin::Sidebar Menu-->
    315. 

  315.             <ul
    316. 

  316.               class="nav sidebar-menu flex-column"
    317. 

  317.               data-lte-toggle="treeview"
    318. 

  318.               role="navigation"
    319. 

  319.               aria-label="Main navigation"
    320. 

  320.               data-accordion="false"
    321. 

  321.               id="navigation"
    322. 

  322.             >
    323. 

  323.               <li class="nav-item menu-open">
    324. 

  324.                 <a href="#" class="nav-link active">
    325. 

  325.                   <i class="nav-icon bi bi-speedometer"></i>
    326. 

  326.                   <p>
    327. 

  327.                     Dashboard
    328. 

  328.                     <i class="nav-arrow bi bi-chevron-right"></i>
    329. 

  329.                   </p>
    330. 

  330.                 </a>
    331. 

  331.                 <ul class="nav nav-treeview">
    332. 

  332.                   <li class="nav-item">
    333. 

  333.                     <a href="./index.html" class="nav-link">
    334. 

  334.                       <i class="nav-icon bi bi-circle"></i>
    335. 

  335.                       <p>Dashboard v1</p>
    336. 

  336.                     </a>
    337. 

  337.                   </li>
    338. 

  338.                   <li class="nav-item">
    339. 

  339.                     <a href="./index2.html" class="nav-link active">
    340. 

  340.                       <i class="nav-icon bi bi-circle"></i>
    341. 

  341.                       <p>Dashboard v2</p>
    342. 

  342.                     </a>
    343. 

  343.                   </li>
    344. 

  344.                   <li class="nav-item">
    345. 

  345.                     <a href="./index3.html" class="nav-link">
    346. 

  346.                       <i class="nav-icon bi bi-circle"></i>
    347. 

  347.                       <p>Dashboard v3</p>
    348. 

  348.                     </a>
    349. 

  349.                   </li>
    350. 

  350.                 </ul>
    351. 

  351.               </li>
    352. 

  352.               <li class="nav-item">
    353. 

  353.                 <a href="./generate/theme.html" class="nav-link">
    354. 

  354.                   <i class="nav-icon bi bi-palette"></i>
    355. 

  355.                   <p>Theme Generate</p>
    356. 

  356.                 </a>
    357. 

  357.               </li>
    358. 

  358.               <li class="nav-item">
    359. 

  359.                 <a href="#" class="nav-link">
    360. 

  360.                   <i class="nav-icon bi bi-box-seam-fill"></i>
    361. 

  361.                   <p>
    362. 

  362.                     Widgets
    363. 

  363.                     <i class="nav-arrow bi bi-chevron-right"></i>
    364. 

  364.                   </p>
    365. 

  365.                 </a>
    366. 

  366.                 <ul class="nav nav-treeview">
    367. 

  367.                   <li class="nav-item">
    368. 

  368.                     <a href="./widgets/small-box.html" class="nav-link">
    369. 

  369.                       <i class="nav-icon bi bi-circle"></i>
    370. 

  370.                       <p>Small Box</p>
    371. 

  371.                     </a>
    372. 

  372.                   </li>
    373. 

  373.                   <li class="nav-item">
    374. 

  374.                     <a href="./widgets/info-box.html" class="nav-link">
    375. 

  375.                       <i class="nav-icon bi bi-circle"></i>
    376. 

  376.                       <p>info Box</p>
    377. 

  377.                     </a>
    378. 

  378.                   </li>
    379. 

  379.                   <li class="nav-item">
    380. 

  380.                     <a href="./widgets/cards.html" class="nav-link">
    381. 

  381.                       <i class="nav-icon bi bi-circle"></i>
    382. 

  382.                       <p>Cards</p>
    383. 

  383.                     </a>
    384. 

  384.                   </li>
    385. 

  385.                 </ul>
    386. 

  386.               </li>
    387. 

  387.               <li class="nav-item">
    388. 

  388.                 <a href="#" class="nav-link">
    389. 

  389.                   <i class="nav-icon bi bi-clipboard-fill"></i>
    390. 

  390.                   <p>
    391. 

  391.                     Layout Options
    392. 

  392.                     <span class="nav-badge badge text-bg-secondary me-3">7</span>
    393. 

  393.                     <i class="nav-arrow bi bi-chevron-right"></i>
    394. 

  394.                   </p>
    395. 

  395.                 </a>
    396. 

  396.                 <ul class="nav nav-treeview">
    397. 

  397.                   <li class="nav-item">
    398. 

  398.                     <a href="./layout/unfixed-sidebar.html" class="nav-link">
    399. 

  399.                       <i class="nav-icon bi bi-circle"></i>
    400. 

  400.                       <p>Default Sidebar</p>
    401. 

  401.                     </a>
    402. 

  402.                   </li>
    403. 

  403.                   <li class="nav-item">
    404. 

  404.                     <a href="./layout/fixed-sidebar.html" class="nav-link">
    405. 

  405.                       <i class="nav-icon bi bi-circle"></i>
    406. 

  406.                       <p>Fixed Sidebar</p>
    407. 

  407.                     </a>
    408. 

  408.                   </li>
    409. 

  409.                   <li class="nav-item">
    410. 

  410.                     <a href="./layout/fixed-header.html" class="nav-link">
    411. 

  411.                       <i class="nav-icon bi bi-circle"></i>
    412. 

  412.                       <p>Fixed Header</p>
    413. 

  413.                     </a>
    414. 

  414.                   </li>
    415. 

  415.                   <li class="nav-item">
    416. 

  416.                     <a href="./layout/fixed-footer.html" class="nav-link">
    417. 

  417.                       <i class="nav-icon bi bi-circle"></i>
    418. 

  418.                       <p>Fixed Footer</p>
    419. 

  419.                     </a>
    420. 

  420.                   </li>
    421. 

  421.                   <li class="nav-item">
    422. 

  422.                     <a href="./layout/fixed-complete.html" class="nav-link">
    423. 

  423.                       <i class="nav-icon bi bi-circle"></i>
    424. 

  424.                       <p>Fixed Complete</p>
    425. 

  425.                     </a>
    426. 

  426.                   </li>
    427. 

  427.                   <li class="nav-item">
    428. 

  428.                     <a href="./layout/layout-custom-area.html" class="nav-link">
    429. 

  429.                       <i class="nav-icon bi bi-circle"></i>
    430. 

  430.                       <p>Layout <small>+ Custom Area </small></p>
    431. 

  431.                     </a>
    432. 

  432.                   </li>
    433. 

  433.                   <li class="nav-item">
    434. 

  434.                     <a href="./layout/sidebar-mini.html" class="nav-link">
    435. 

  435.                       <i class="nav-icon bi bi-circle"></i>
    436. 

  436.                       <p>Sidebar Mini</p>
    437. 

  437.                     </a>
    438. 

  438.                   </li>
    439. 

  439.                   <li class="nav-item">
    440. 

  440.                     <a href="./layout/collapsed-sidebar.html" class="nav-link">
    441. 

  441.                       <i class="nav-icon bi bi-circle"></i>
    442. 

  442.                       <p>Sidebar Mini <small>+ Collapsed</small></p>
    443. 

  443.                     </a>
    444. 

  444.                   </li>
    445. 

  445.                   <li class="nav-item">
    446. 

  446.                     <a href="./layout/collapsed-sidebar-without-hover.html" class="nav-link">
    447. 

  447.                       <i class="nav-icon bi bi-circle"></i>
    448. 

  448.                       <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
    449. 

  449.                     </a>
    450. 

  450.                   </li>
    451. 

  451.                   <li class="nav-item">
    452. 

  452.                     <a href="./layout/logo-switch.html" class="nav-link">
    453. 

  453.                       <i class="nav-icon bi bi-circle"></i>
    454. 

  454.                       <p>Sidebar Mini <small>+ Logo Switch</small></p>
    455. 

  455.                     </a>
    456. 

  456.                   </li>
    457. 

  457.                   <li class="nav-item">
    458. 

  458.                     <a href="./layout/layout-rtl.html" class="nav-link">
    459. 

  459.                       <i class="nav-icon bi bi-circle"></i>
    460. 

  460.                       <p>Layout RTL</p>
    461. 

  461.                     </a>
    462. 

  462.                   </li>
    463. 

  463.                 </ul>
    464. 

  464.               </li>
    465. 

  465.               <li class="nav-item">
    466. 

  466.                 <a href="#" class="nav-link">
    467. 

  467.                   <i class="nav-icon bi bi-tree-fill"></i>
    468. 

  468.                   <p>
    469. 

  469.                     UI Elements
    470. 

  470.                     <i class="nav-arrow bi bi-chevron-right"></i>
    471. 

  471.                   </p>
    472. 

  472.                 </a>
    473. 

  473.                 <ul class="nav nav-treeview">
    474. 

  474.                   <li class="nav-item">
    475. 

  475.                     <a href="./UI/general.html" class="nav-link">
    476. 

  476.                       <i class="nav-icon bi bi-circle"></i>
    477. 

  477.                       <p>General</p>
    478. 

  478.                     </a>
    479. 

  479.                   </li>
    480. 

  480.                   <li class="nav-item">
    481. 

  481.                     <a href="./UI/icons.html" class="nav-link">
    482. 

  482.                       <i class="nav-icon bi bi-circle"></i>
    483. 

  483.                       <p>Icons</p>
    484. 

  484.                     </a>
    485. 

  485.                   </li>
    486. 

  486.                   <li class="nav-item">
    487. 

  487.                     <a href="./UI/timeline.html" class="nav-link">
    488. 

  488.                       <i class="nav-icon bi bi-circle"></i>
    489. 

  489.                       <p>Timeline</p>
    490. 

  490.                     </a>
    491. 

  491.                   </li>
    492. 

  492.                 </ul>
    493. 

  493.               </li>
    494. 

  494.               <li class="nav-item">
    495. 

  495.                 <a href="#" class="nav-link">
    496. 

  496.                   <i class="nav-icon bi bi-pencil-square"></i>
    497. 

  497.                   <p>
    498. 

  498.                     Forms
    499. 

  499.                     <i class="nav-arrow bi bi-chevron-right"></i>
    500. 

  500.                   </p>
    501. 

  501.                 </a>
    502. 

  502.                 <ul class="nav nav-treeview">
    503. 

  503.                   <li class="nav-item">
    504. 

  504.                     <a href="./forms/general.html" class="nav-link">
    505. 

  505.                       <i class="nav-icon bi bi-circle"></i>
    506. 

  506.                       <p>General Elements</p>
    507. 

  507.                     </a>
    508. 

  508.                   </li>
    509. 

  509.                 </ul>
    510. 

  510.               </li>
    511. 

  511.               <li class="nav-item">
    512. 

  512.                 <a href="#" class="nav-link">
    513. 

  513.                   <i class="nav-icon bi bi-table"></i>
    514. 

  514.                   <p>
    515. 

  515.                     Tables
    516. 

  516.                     <i class="nav-arrow bi bi-chevron-right"></i>
    517. 

  517.                   </p>
    518. 

  518.                 </a>
    519. 

  519.                 <ul class="nav nav-treeview">
    520. 

  520.                   <li class="nav-item">
    521. 

  521.                     <a href="./tables/simple.html" class="nav-link">
    522. 

  522.                       <i class="nav-icon bi bi-circle"></i>
    523. 

  523.                       <p>Simple Tables</p>
    524. 

  524.                     </a>
    525. 

  525.                   </li>
    526. 

  526.                 </ul>
    527. 

  527.               </li>
    528. 

  528. 

  529.               <li class="nav-header">EXAMPLES</li>
    530. 

  530.               <li class="nav-item">
    531. 

  531.                 <a href="#" class="nav-link">
    532. 

  532.                   <i class="nav-icon bi bi-box-arrow-in-right"></i>
    533. 

  533.                   <p>
    534. 

  534.                     Auth
    535. 

  535.                     <i class="nav-arrow bi bi-chevron-right"></i>
    536. 

  536.                   </p>
    537. 

  537.                 </a>
    538. 

  538.                 <ul class="nav nav-treeview">
    539. 

  539.                   <li class="nav-item">
    540. 

  540.                     <a href="#" class="nav-link">
    541. 

  541.                       <i class="nav-icon bi bi-box-arrow-in-right"></i>
    542. 

  542.                       <p>
    543. 

  543.                         Version 1
    544. 

  544.                         <i class="nav-arrow bi bi-chevron-right"></i>
    545. 

  545.                       </p>
    546. 

  546.                     </a>
    547. 

  547.                     <ul class="nav nav-treeview">
    548. 

  548.                       <li class="nav-item">
    549. 

  549.                         <a href="./examples/login.html" class="nav-link">
    550. 

  550.                           <i class="nav-icon bi bi-circle"></i>
    551. 

  551.                           <p>Login</p>
    552. 

  552.                         </a>
    553. 

  553.                       </li>
    554. 

  554.                       <li class="nav-item">
    555. 

  555.                         <a href="./examples/register.html" class="nav-link">
    556. 

  556.                           <i class="nav-icon bi bi-circle"></i>
    557. 

  557.                           <p>Register</p>
    558. 

  558.                         </a>
    559. 

  559.                       </li>
    560. 

  560.                     </ul>
    561. 

  561.                   </li>
    562. 

  562.                   <li class="nav-item">
    563. 

  563.                     <a href="#" class="nav-link">
    564. 

  564.                       <i class="nav-icon bi bi-box-arrow-in-right"></i>
    565. 

  565.                       <p>
    566. 

  566.                         Version 2
    567. 

  567.                         <i class="nav-arrow bi bi-chevron-right"></i>
    568. 

  568.                       </p>
    569. 

  569.                     </a>
    570. 

  570.                     <ul class="nav nav-treeview">
    571. 

  571.                       <li class="nav-item">
    572. 

  572.                         <a href="./examples/login-v2.html" class="nav-link">
    573. 

  573.                           <i class="nav-icon bi bi-circle"></i>
    574. 

  574.                           <p>Login</p>
    575. 

  575.                         </a>
    576. 

  576.                       </li>
    577. 

  577.                       <li class="nav-item">
    578. 

  578.                         <a href="./examples/register-v2.html" class="nav-link">
    579. 

  579.                           <i class="nav-icon bi bi-circle"></i>
    580. 

  580.                           <p>Register</p>
    581. 

  581.                         </a>
    582. 

  582.                       </li>
    583. 

  583.                     </ul>
    584. 

  584.                   </li>
    585. 

  585.                   <li class="nav-item">
    586. 

  586.                     <a href="./examples/lockscreen.html" class="nav-link">
    587. 

  587.                       <i class="nav-icon bi bi-circle"></i>
    588. 

  588.                       <p>Lockscreen</p>
    589. 

  589.                     </a>
    590. 

  590.                   </li>
    591. 

  591.                 </ul>
    592. 

  592.               </li>
    593. 

  593. 

  594.               <li class="nav-header">DOCUMENTATIONS</li>
    595. 

  595.               <li class="nav-item">
    596. 

  596.                 <a href="./docs/introduction.html" class="nav-link">
    597. 

  597.                   <i class="nav-icon bi bi-download"></i>
    598. 

  598.                   <p>Installation</p>
    599. 

  599.                 </a>
    600. 

  600.               </li>
    601. 

  601.               <li class="nav-item">
    602. 

  602.                 <a href="./docs/layout.html" class="nav-link">
    603. 

  603.                   <i class="nav-icon bi bi-grip-horizontal"></i>
    604. 

  604.                   <p>Layout</p>
    605. 

  605.                 </a>
    606. 

  606.               </li>
    607. 

  607.               <li class="nav-item">
    608. 

  608.                 <a href="./docs/color-mode.html" class="nav-link">
    609. 

  609.                   <i class="nav-icon bi bi-star-half"></i>
    610. 

  610.                   <p>Color Mode</p>
    611. 

  611.                 </a>
    612. 

  612.               </li>
    613. 

  613.               <li class="nav-item">
    614. 

  614.                 <a href="#" class="nav-link">
    615. 

  615.                   <i class="nav-icon bi bi-ui-checks-grid"></i>
    616. 

  616.                   <p>
    617. 

  617.                     Components
    618. 

  618.                     <i class="nav-arrow bi bi-chevron-right"></i>
    619. 

  619.                   </p>
    620. 

  620.                 </a>
    621. 

  621.                 <ul class="nav nav-treeview">
    622. 

  622.                   <li class="nav-item">
    623. 

  623.                     <a href="./docs/components/main-header.html" class="nav-link">
    624. 

  624.                       <i class="nav-icon bi bi-circle"></i>
    625. 

  625.                       <p>Main Header</p>
    626. 

  626.                     </a>
    627. 

  627.                   </li>
    628. 

  628.                   <li class="nav-item">
    629. 

  629.                     <a href="./docs/components/main-sidebar.html" class="nav-link">
    630. 

  630.                       <i class="nav-icon bi bi-circle"></i>
    631. 

  631.                       <p>Main Sidebar</p>
    632. 

  632.                     </a>
    633. 

  633.                   </li>
    634. 

  634.                 </ul>
    635. 

  635.               </li>
    636. 

  636.               <li class="nav-item">
    637. 

  637.                 <a href="#" class="nav-link">
    638. 

  638.                   <i class="nav-icon bi bi-filetype-js"></i>
    639. 

  639.                   <p>
    640. 

  640.                     Javascript
    641. 

  641.                     <i class="nav-arrow bi bi-chevron-right"></i>
    642. 

  642.                   </p>
    643. 

  643.                 </a>
    644. 

  644.                 <ul class="nav nav-treeview">
    645. 

  645.                   <li class="nav-item">
    646. 

  646.                     <a href="./docs/javascript/layout.html" class="nav-link">
    647. 

  647.                       <i class="nav-icon bi bi-circle"></i>
    648. 

  648.                       <p>Layout</p>
    649. 

  649.                     </a>
    650. 

  650.                   </li>
    651. 

  651.                   <li class="nav-item">
    652. 

  652.                     <a href="./docs/javascript/pushmenu.html" class="nav-link">
    653. 

  653.                       <i class="nav-icon bi bi-circle"></i>
    654. 

  654.                       <p>PushMenu</p>
    655. 

  655.                     </a>
    656. 

  656.                   </li>
    657. 

  657.                   <li class="nav-item">
    658. 

  658.                     <a href="./docs/javascript/treeview.html" class="nav-link">
    659. 

  659.                       <i class="nav-icon bi bi-circle"></i>
    660. 

  660.                       <p>Treeview</p>
    661. 

  661.                     </a>
    662. 

  662.                   </li>
    663. 

  663.                   <li class="nav-item">
    664. 

  664.                     <a href="./docs/javascript/card-widget.html" class="nav-link">
    665. 

  665.                       <i class="nav-icon bi bi-circle"></i>
    666. 

  666.                       <p>Card Widget</p>
    667. 

  667.                     </a>
    668. 

  668.                   </li>
    669. 

  669.                   <li class="nav-item">
    670. 

  670.                     <a href="./docs/javascript/direct-chat.html" class="nav-link">
    671. 

  671.                       <i class="nav-icon bi bi-circle"></i>
    672. 

  672.                       <p>Direct Chat</p>
    673. 

  673.                     </a>
    674. 

  674.                   </li>
    675. 

  675.                   <li class="nav-item">
    676. 

  676.                     <a href="./docs/javascript/fullscreen.html" class="nav-link">
    677. 

  677.                       <i class="nav-icon bi bi-circle"></i>
    678. 

  678.                       <p>Fullscreen</p>
    679. 

  679.                     </a>
    680. 

  680.                   </li>
    681. 

  681.                   <li class="nav-item">
    682. 

  682.                     <a href="./docs/javascript/accessibility.html" class="nav-link">
    683. 

  683.                       <i class="nav-icon bi bi-circle"></i>
    684. 

  684.                       <p>Accessibility</p>
    685. 

  685.                     </a>
    686. 

  686.                   </li>
    687. 

  687.                 </ul>
    688. 

  688.               </li>
    689. 

  689.               <li class="nav-item">
    690. 

  690.                 <a href="./docs/browser-support.html" class="nav-link">
    691. 

  691.                   <i class="nav-icon bi bi-browser-edge"></i>
    692. 

  692.                   <p>Browser Support</p>
    693. 

  693.                 </a>
    694. 

  694.               </li>
    695. 

  695.               <li class="nav-item">
    696. 

  696.                 <a href="./docs/how-to-contribute.html" class="nav-link">
    697. 

  697.                   <i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
    698. 

  698.                   <p>How To Contribute</p>
    699. 

  699.                 </a>
    700. 

  700.               </li>
    701. 

  701.               <li class="nav-item">
    702. 

  702.                 <a href="./docs/faq.html" class="nav-link">
    703. 

  703.                   <i class="nav-icon bi bi-question-circle-fill"></i>
    704. 

  704.                   <p>FAQ</p>
    705. 

  705.                 </a>
    706. 

  706.               </li>
    707. 

  707.               <li class="nav-item">
    708. 

  708.                 <a href="./docs/license.html" class="nav-link">
    709. 

  709.                   <i class="nav-icon bi bi-patch-check-fill"></i>
    710. 

  710.                   <p>License</p>
    711. 

  711.                 </a>
    712. 

  712.               </li>
    713. 

  713. 

  714.               <li class="nav-header">MULTI LEVEL EXAMPLE</li>
    715. 

  715.               <li class="nav-item">
    716. 

  716.                 <a href="#" class="nav-link">
    717. 

  717.                   <i class="nav-icon bi bi-circle-fill"></i>
    718. 

  718.                   <p>Level 1</p>
    719. 

  719.                 </a>
    720. 

  720.               </li>
    721. 

  721.               <li class="nav-item">
    722. 

  722.                 <a href="#" class="nav-link">
    723. 

  723.                   <i class="nav-icon bi bi-circle-fill"></i>
    724. 

  724.                   <p>
    725. 

  725.                     Level 1
    726. 

  726.                     <i class="nav-arrow bi bi-chevron-right"></i>
    727. 

  727.                   </p>
    728. 

  728.                 </a>
    729. 

  729.                 <ul class="nav nav-treeview">
    730. 

  730.                   <li class="nav-item">
    731. 

  731.                     <a href="#" class="nav-link">
    732. 

  732.                       <i class="nav-icon bi bi-circle"></i>
    733. 

  733.                       <p>Level 2</p>
    734. 

  734.                     </a>
    735. 

  735.                   </li>
    736. 

  736.                   <li class="nav-item">
    737. 

  737.                     <a href="#" class="nav-link">
    738. 

  738.                       <i class="nav-icon bi bi-circle"></i>
    739. 

  739.                       <p>
    740. 

  740.                         Level 2
    741. 

  741.                         <i class="nav-arrow bi bi-chevron-right"></i>
    742. 

  742.                       </p>
    743. 

  743.                     </a>
    744. 

  744.                     <ul class="nav nav-treeview">
    745. 

  745.                       <li class="nav-item">
    746. 

  746.                         <a href="#" class="nav-link">
    747. 

  747.                           <i class="nav-icon bi bi-record-circle-fill"></i>
    748. 

  748.                           <p>Level 3</p>
    749. 

  749.                         </a>
    750. 

  750.                       </li>
    751. 

  751.                       <li class="nav-item">
    752. 

  752.                         <a href="#" class="nav-link">
    753. 

  753.                           <i class="nav-icon bi bi-record-circle-fill"></i>
    754. 

  754.                           <p>Level 3</p>
    755. 

  755.                         </a>
    756. 

  756.                       </li>
    757. 

  757.                       <li class="nav-item">
    758. 

  758.                         <a href="#" class="nav-link">
    759. 

  759.                           <i class="nav-icon bi bi-record-circle-fill"></i>
    760. 

  760.                           <p>Level 3</p>
    761. 

  761.                         </a>
    762. 

  762.                       </li>
    763. 

  763.                     </ul>
    764. 

  764.                   </li>
    765. 

  765.                   <li class="nav-item">
    766. 

  766.                     <a href="#" class="nav-link">
    767. 

  767.                       <i class="nav-icon bi bi-circle"></i>
    768. 

  768.                       <p>Level 2</p>
    769. 

  769.                     </a>
    770. 

  770.                   </li>
    771. 

  771.                 </ul>
    772. 

  772.               </li>
    773. 

  773.               <li class="nav-item">
    774. 

  774.                 <a href="#" class="nav-link">
    775. 

  775.                   <i class="nav-icon bi bi-circle-fill"></i>
    776. 

  776.                   <p>Level 1</p>
    777. 

  777.                 </a>
    778. 

  778.               </li>
    779. 

  779. 

  780.               <li class="nav-header">LABELS</li>
    781. 

  781.               <li class="nav-item">
    782. 

  782.                 <a href="#" class="nav-link">
    783. 

  783.                   <i class="nav-icon bi bi-circle text-danger"></i>
    784. 

  784.                   <p class="text">Important</p>
    785. 

  785.                 </a>
    786. 

  786.               </li>
    787. 

  787.               <li class="nav-item">
    788. 

  788.                 <a href="#" class="nav-link">
    789. 

  789.                   <i class="nav-icon bi bi-circle text-warning"></i>
    790. 

  790.                   <p>Warning</p>
    791. 

  791.                 </a>
    792. 

  792.               </li>
    793. 

  793.               <li class="nav-item">
    794. 

  794.                 <a href="#" class="nav-link">
    795. 

  795.                   <i class="nav-icon bi bi-circle text-info"></i>
    796. 

  796.                   <p>Informational</p>
    797. 

  797.                 </a>
    798. 

  798.               </li>
    799. 

  799.             </ul>
    800. 

  800.             <!--end::Sidebar Menu-->
    801. 

  801.           </nav>
    802. 

  802.         </div>
    803. 

  803.         <!--end::Sidebar Wrapper-->
    804. 

  804.       </aside>
    805. 

  805.       <!--end::Sidebar-->
    806. 

  806.       <!--begin::App Main-->
    807. 

  807.       <main class="app-main">
    808. 

  808.         <!--begin::App Content Header-->
    809. 

  809.         <div class="app-content-header">
    810. 

  810.           <!--begin::Container-->
    811. 

  811.           <div class="container-fluid">
    812. 

  812.             <!--begin::Row-->
    813. 

  813.             <div class="row">
    814. 

  814.               <div class="col-sm-6">
    815. 

  815.                 <h3 class="mb-0">Dashboard v2</h3>
    816. 

  816.               </div>
    817. 

  817.               <div class="col-sm-6">
    818. 

  818.                 <ol class="breadcrumb float-sm-end">
    819. 

  819.                   <li class="breadcrumb-item"><a href="#">Home</a></li>
    820. 

  820.                   <li class="breadcrumb-item active" aria-current="page">Dashboard v2</li>
    821. 

  821.                 </ol>
    822. 

  822.               </div>
    823. 

  823.             </div>
    824. 

  824.             <!--end::Row-->
    825. 

  825.           </div>
    826. 

  826.           <!--end::Container-->
    827. 

  827.         </div>
    828. 

  828.         <div class="app-content">
    829. 

  829.           <!--begin::Container-->
    830. 

  830.           <div class="container-fluid">
    831. 

  831.             <!-- Info boxes -->
    832. 

  832.             <div class="row">
    833. 

  833.               <div class="col-12 col-sm-6 col-md-3">
    834. 

  834.                 <div class="info-box">
    835. 

  835.                   <span class="info-box-icon text-bg-primary shadow-sm">
    836. 

  836.                     <i class="bi bi-gear-fill"></i>
    837. 

  837.                   </span>
    838. 

  838. 

  839.                   <div class="info-box-content">
    840. 

  840.                     <span class="info-box-text">CPU Traffic</span>
    841. 

  841.                     <span class="info-box-number">
    842. 

  842.                       10
    843. 

  843.                       <small>%</small>
    844. 

  844.                     </span>
    845. 

  845.                   </div>
    846. 

  846.                   <!-- /.info-box-content -->
    847. 

  847.                 </div>
    848. 

  848.                 <!-- /.info-box -->
    849. 

  849.               </div>
    850. 

  850.               <!-- /.col -->
    851. 

  851.               <div class="col-12 col-sm-6 col-md-3">
    852. 

  852.                 <div class="info-box">
    853. 

  853.                   <span class="info-box-icon text-bg-danger shadow-sm">
    854. 

  854.                     <i class="bi bi-hand-thumbs-up-fill"></i>
    855. 

  855.                   </span>
    856. 

  856. 

  857.                   <div class="info-box-content">
    858. 

  858.                     <span class="info-box-text">Likes</span>
    859. 

  859.                     <span class="info-box-number">41,410</span>
    860. 

  860.                   </div>
    861. 

  861.                   <!-- /.info-box-content -->
    862. 

  862.                 </div>
    863. 

  863.                 <!-- /.info-box -->
    864. 

  864.               </div>
    865. 

  865.               <!-- /.col -->
    866. 

  866. 

  867.               <!-- fix for small devices only -->
    868. 

  868.               <!-- <div class="clearfix hidden-md-up"></div> -->
    869. 

  869. 

  870.               <div class="col-12 col-sm-6 col-md-3">
    871. 

  871.                 <div class="info-box">
    872. 

  872.                   <span class="info-box-icon text-bg-success shadow-sm">
    873. 

  873.                     <i class="bi bi-cart-fill"></i>
    874. 

  874.                   </span>
    875. 

  875. 

  876.                   <div class="info-box-content">
    877. 

  877.                     <span class="info-box-text">Sales</span>
    878. 

  878.                     <span class="info-box-number">760</span>
    879. 

  879.                   </div>
    880. 

  880.                   <!-- /.info-box-content -->
    881. 

  881.                 </div>
    882. 

  882.                 <!-- /.info-box -->
    883. 

  883.               </div>
    884. 

  884.               <!-- /.col -->
    885. 

  885.               <div class="col-12 col-sm-6 col-md-3">
    886. 

  886.                 <div class="info-box">
    887. 

  887.                   <span class="info-box-icon text-bg-warning shadow-sm">
    888. 

  888.                     <i class="bi bi-people-fill"></i>
    889. 

  889.                   </span>
    890. 

  890. 

  891.                   <div class="info-box-content">
    892. 

  892.                     <span class="info-box-text">New Members</span>
    893. 

  893.                     <span class="info-box-number">2,000</span>
    894. 

  894.                   </div>
    895. 

  895.                   <!-- /.info-box-content -->
    896. 

  896.                 </div>
    897. 

  897.                 <!-- /.info-box -->
    898. 

  898.               </div>
    899. 

  899.               <!-- /.col -->
    900. 

  900.             </div>
    901. 

  901.             <!-- /.row -->
    902. 

  902. 

  903.             <!--begin::Row-->
    904. 

  904.             <div class="row">
    905. 

  905.               <div class="col-md-12">
    906. 

  906.                 <div class="card mb-4">
    907. 

  907.                   <div class="card-header">
    908. 

  908.                     <h5 class="card-title">Monthly Recap Report</h5>
    909. 

  909. 

  910.                     <div class="card-tools">
    911. 

  911.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
    912. 

  912.                         <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    913. 

  913.                         <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    914. 

  914.                       </button>
    915. 

  915.                       <div class="btn-group">
    916. 

  916.                         <button
    917. 

  917.                           type="button"
    918. 

  918.                           class="btn btn-tool dropdown-toggle"
    919. 

  919.                           data-bs-toggle="dropdown"
    920. 

  920.                         >
    921. 

  921.                           <i class="bi bi-wrench"></i>
    922. 

  922.                         </button>
    923. 

  923.                         <div class="dropdown-menu dropdown-menu-end" role="menu">
    924. 

  924.                           <a href="#" class="dropdown-item">Action</a>
    925. 

  925.                           <a href="#" class="dropdown-item">Another action</a>
    926. 

  926.                           <a href="#" class="dropdown-item"> Something else here </a>
    927. 

  927.                           <a class="dropdown-divider"></a>
    928. 

  928.                           <a href="#" class="dropdown-item">Separated link</a>
    929. 

  929.                         </div>
    930. 

  930.                       </div>
    931. 

  931.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    932. 

  932.                         <i class="bi bi-x-lg"></i>
    933. 

  933.                       </button>
    934. 

  934.                     </div>
    935. 

  935.                   </div>
    936. 

  936.                   <!-- /.card-header -->
    937. 

  937.                   <div class="card-body">
    938. 

  938.                     <!--begin::Row-->
    939. 

  939.                     <div class="row">
    940. 

  940.                       <div class="col-md-8">
    941. 

  941.                         <p class="text-center">
    942. 

  942.                           <strong>Sales: 1 Jan, 2023 - 30 Jul, 2023</strong>
    943. 

  943.                         </p>
    944. 

  944. 

  945.                         <div id="sales-chart"></div>
    946. 

  946.                       </div>
    947. 

  947.                       <!-- /.col -->
    948. 

  948.                       <div class="col-md-4">
    949. 

  949.                         <p class="text-center">
    950. 

  950.                           <strong>Goal Completion</strong>
    951. 

  951.                         </p>
    952. 

  952. 

  953.                         <div class="progress-group">
    954. 

  954.                           Add Products to Cart
    955. 

  955.                           <span class="float-end"><b>160</b>/200</span>
    956. 

  956.                           <div class="progress progress-sm">
    957. 

  957.                             <div class="progress-bar text-bg-primary" style="width: 80%"></div>
    958. 

  958.                           </div>
    959. 

  959.                         </div>
    960. 

  960.                         <!-- /.progress-group -->
    961. 

  961. 

  962.                         <div class="progress-group">
    963. 

  963.                           Complete Purchase
    964. 

  964.                           <span class="float-end"><b>310</b>/400</span>
    965. 

  965.                           <div class="progress progress-sm">
    966. 

  966.                             <div class="progress-bar text-bg-danger" style="width: 75%"></div>
    967. 

  967.                           </div>
    968. 

  968.                         </div>
    969. 

  969. 

  970.                         <!-- /.progress-group -->
    971. 

  971.                         <div class="progress-group">
    972. 

  972.                           <span class="progress-text">Visit Premium Page</span>
    973. 

  973.                           <span class="float-end"><b>480</b>/800</span>
    974. 

  974.                           <div class="progress progress-sm">
    975. 

  975.                             <div class="progress-bar text-bg-success" style="width: 60%"></div>
    976. 

  976.                           </div>
    977. 

  977.                         </div>
    978. 

  978. 

  979.                         <!-- /.progress-group -->
    980. 

  980.                         <div class="progress-group">
    981. 

  981.                           Send Inquiries
    982. 

  982.                           <span class="float-end"><b>250</b>/500</span>
    983. 

  983.                           <div class="progress progress-sm">
    984. 

  984.                             <div class="progress-bar text-bg-warning" style="width: 50%"></div>
    985. 

  985.                           </div>
    986. 

  986.                         </div>
    987. 

  987.                         <!-- /.progress-group -->
    988. 

  988.                       </div>
    989. 

  989.                       <!-- /.col -->
    990. 

  990.                     </div>
    991. 

  991.                     <!--end::Row-->
    992. 

  992.                   </div>
    993. 

  993.                   <!-- ./card-body -->
    994. 

  994.                   <div class="card-footer">
    995. 

  995.                     <!--begin::Row-->
    996. 

  996.                     <div class="row">
    997. 

  997.                       <div class="col-md-3 col-6">
    998. 

  998.                         <div class="text-center border-end">
    999. 

  999.                           <span class="text-success">
    1000. 

  1000.                             <i class="bi bi-caret-up-fill"></i> 17%
    1001. 

  1001.                           </span>
    1002. 

  1002.                           <h5 class="fw-bold mb-0">$35,210.43</h5>
    1003. 

  1003.                           <span class="text-uppercase">TOTAL REVENUE</span>
    1004. 

  1004.                         </div>
    1005. 

  1005.                       </div>
    1006. 

  1006. 

  1007.                       <!-- /.col -->
    1008. 

  1008.                       <div class="col-md-3 col-6">
    1009. 

  1009.                         <div class="text-center border-end">
    1010. 

  1010.                           <span class="text-info"> <i class="bi bi-caret-left-fill"></i> 0% </span>
    1011. 

  1011.                           <h5 class="fw-bold mb-0">$10,390.90</h5>
    1012. 

  1012.                           <span class="text-uppercase">TOTAL COST</span>
    1013. 

  1013.                         </div>
    1014. 

  1014.                       </div>
    1015. 

  1015.                       <!-- /.col -->
    1016. 

  1016.                       <div class="col-md-3 col-6">
    1017. 

  1017.                         <div class="text-center border-end">
    1018. 

  1018.                           <span class="text-success">
    1019. 

  1019.                             <i class="bi bi-caret-up-fill"></i> 20%
    1020. 

  1020.                           </span>
    1021. 

  1021.                           <h5 class="fw-bold mb-0">$24,813.53</h5>
    1022. 

  1022.                           <span class="text-uppercase">TOTAL PROFIT</span>
    1023. 

  1023.                         </div>
    1024. 

  1024.                       </div>
    1025. 

  1025.                       <!-- /.col -->
    1026. 

  1026.                       <div class="col-md-3 col-6">
    1027. 

  1027.                         <div class="text-center">
    1028. 

  1028.                           <span class="text-danger">
    1029. 

  1029.                             <i class="bi bi-caret-down-fill"></i> 18%
    1030. 

  1030.                           </span>
    1031. 

  1031.                           <h5 class="fw-bold mb-0">1200</h5>
    1032. 

  1032.                           <span class="text-uppercase">GOAL COMPLETIONS</span>
    1033. 

  1033.                         </div>
    1034. 

  1034.                       </div>
    1035. 

  1035.                     </div>
    1036. 

  1036.                     <!--end::Row-->
    1037. 

  1037.                   </div>
    1038. 

  1038.                   <!-- /.card-footer -->
    1039. 

  1039.                 </div>
    1040. 

  1040.                 <!-- /.card -->
    1041. 

  1041.               </div>
    1042. 

  1042.               <!-- /.col -->
    1043. 

  1043.             </div>
    1044. 

  1044.             <!--end::Row-->
    1045. 

  1045. 

  1046.             <!--begin::Row-->
    1047. 

  1047.             <div class="row">
    1048. 

  1048.               <!-- Start col -->
    1049. 

  1049.               <div class="col-md-8">
    1050. 

  1050.                 <!--begin::Row-->
    1051. 

  1051.                 <div class="row g-4 mb-4">
    1052. 

  1052.                   <div class="col-md-6">
    1053. 

  1053.                     <!-- DIRECT CHAT -->
    1054. 

  1054.                     <div class="card direct-chat direct-chat-warning">
    1055. 

  1055.                       <div class="card-header">
    1056. 

  1056.                         <h3 class="card-title">Direct Chat</h3>
    1057. 

  1057. 

  1058.                         <div class="card-tools">
    1059. 

  1059.                           <span title="3 New Messages" class="badge text-bg-warning"> 3 </span>
    1060. 

  1060.                           <button
    1061. 

  1061.                             type="button"
    1062. 

  1062.                             class="btn btn-tool"
    1063. 

  1063.                             data-lte-toggle="card-collapse"
    1064. 

  1064.                           >
    1065. 

  1065.                             <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    1066. 

  1066.                             <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    1067. 

  1067.                           </button>
    1068. 

  1068.                           <button
    1069. 

  1069.                             type="button"
    1070. 

  1070.                             class="btn btn-tool"
    1071. 

  1071.                             title="Contacts"
    1072. 

  1072.                             data-lte-toggle="chat-pane"
    1073. 

  1073.                           >
    1074. 

  1074.                             <i class="bi bi-chat-text-fill"></i>
    1075. 

  1075.                           </button>
    1076. 

  1076.                           <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    1077. 

  1077.                             <i class="bi bi-x-lg"></i>
    1078. 

  1078.                           </button>
    1079. 

  1079.                         </div>
    1080. 

  1080.                       </div>
    1081. 

  1081.                       <!-- /.card-header -->
    1082. 

  1082.                       <div class="card-body">
    1083. 

  1083.                         <!-- Conversations are loaded here -->
    1084. 

  1084.                         <div class="direct-chat-messages">
    1085. 

  1085.                           <!-- Message. Default to the start -->
    1086. 

  1086.                           <div class="direct-chat-msg">
    1087. 

  1087.                             <div class="direct-chat-infos clearfix">
    1088. 

  1088.                               <span class="direct-chat-name float-start"> Alexander Pierce </span>
    1089. 

  1089.                               <span class="direct-chat-timestamp float-end"> 23 Jan 2:00 pm </span>
    1090. 

  1090.                             </div>
    1091. 

  1091.                             <!-- /.direct-chat-infos -->
    1092. 

  1092.                             <img
    1093. 

  1093.                               class="direct-chat-img"
    1094. 

  1094.                               src="./assets/img/user1-128x128.jpg"
    1095. 

  1095.                               alt="message user image"
    1096. 

  1096.                             />
    1097. 

  1097.                             <!-- /.direct-chat-img -->
    1098. 

  1098.                             <div class="direct-chat-text">
    1099. 

  1099.                               Is this template really for free? That's unbelievable!
    1100. 

  1100.                             </div>
    1101. 

  1101.                             <!-- /.direct-chat-text -->
    1102. 

  1102.                           </div>
    1103. 

  1103.                           <!-- /.direct-chat-msg -->
    1104. 

  1104. 

  1105.                           <!-- Message to the end -->
    1106. 

  1106.                           <div class="direct-chat-msg end">
    1107. 

  1107.                             <div class="direct-chat-infos clearfix">
    1108. 

  1108.                               <span class="direct-chat-name float-end"> Sarah Bullock </span>
    1109. 

  1109.                               <span class="direct-chat-timestamp float-start">
    1110. 

  1110.                                 23 Jan 2:05 pm
    1111. 

  1111.                               </span>
    1112. 

  1112.                             </div>
    1113. 

  1113.                             <!-- /.direct-chat-infos -->
    1114. 

  1114.                             <img
    1115. 

  1115.                               class="direct-chat-img"
    1116. 

  1116.                               src="./assets/img/user3-128x128.jpg"
    1117. 

  1117.                               alt="message user image"
    1118. 

  1118.                             />
    1119. 

  1119.                             <!-- /.direct-chat-img -->
    1120. 

  1120.                             <div class="direct-chat-text">You better believe it!</div>
    1121. 

  1121.                             <!-- /.direct-chat-text -->
    1122. 

  1122.                           </div>
    1123. 

  1123.                           <!-- /.direct-chat-msg -->
    1124. 

  1124. 

  1125.                           <!-- Message. Default to the start -->
    1126. 

  1126.                           <div class="direct-chat-msg">
    1127. 

  1127.                             <div class="direct-chat-infos clearfix">
    1128. 

  1128.                               <span class="direct-chat-name float-start"> Alexander Pierce </span>
    1129. 

  1129.                               <span class="direct-chat-timestamp float-end"> 23 Jan 5:37 pm </span>
    1130. 

  1130.                             </div>
    1131. 

  1131.                             <!-- /.direct-chat-infos -->
    1132. 

  1132.                             <img
    1133. 

  1133.                               class="direct-chat-img"
    1134. 

  1134.                               src="./assets/img/user1-128x128.jpg"
    1135. 

  1135.                               alt="message user image"
    1136. 

  1136.                             />
    1137. 

  1137.                             <!-- /.direct-chat-img -->
    1138. 

  1138.                             <div class="direct-chat-text">
    1139. 

  1139.                               Working with AdminLTE on a great new app! Wanna join?
    1140. 

  1140.                             </div>
    1141. 

  1141.                             <!-- /.direct-chat-text -->
    1142. 

  1142.                           </div>
    1143. 

  1143.                           <!-- /.direct-chat-msg -->
    1144. 

  1144. 

  1145.                           <!-- Message to the end -->
    1146. 

  1146.                           <div class="direct-chat-msg end">
    1147. 

  1147.                             <div class="direct-chat-infos clearfix">
    1148. 

  1148.                               <span class="direct-chat-name float-end"> Sarah Bullock </span>
    1149. 

  1149.                               <span class="direct-chat-timestamp float-start">
    1150. 

  1150.                                 23 Jan 6:10 pm
    1151. 

  1151.                               </span>
    1152. 

  1152.                             </div>
    1153. 

  1153.                             <!-- /.direct-chat-infos -->
    1154. 

  1154.                             <img
    1155. 

  1155.                               class="direct-chat-img"
    1156. 

  1156.                               src="./assets/img/user3-128x128.jpg"
    1157. 

  1157.                               alt="message user image"
    1158. 

  1158.                             />
    1159. 

  1159.                             <!-- /.direct-chat-img -->
    1160. 

  1160.                             <div class="direct-chat-text">I would love to.</div>
    1161. 

  1161.                             <!-- /.direct-chat-text -->
    1162. 

  1162.                           </div>
    1163. 

  1163.                           <!-- /.direct-chat-msg -->
    1164. 

  1164.                         </div>
    1165. 

  1165.                         <!-- /.direct-chat-messages-->
    1166. 

  1166. 

  1167.                         <!-- Contacts are loaded here -->
    1168. 

  1168.                         <div class="direct-chat-contacts">
    1169. 

  1169.                           <ul class="contacts-list">
    1170. 

  1170.                             <li>
    1171. 

  1171.                               <a href="#">
    1172. 

  1172.                                 <img
    1173. 

  1173.                                   class="contacts-list-img"
    1174. 

  1174.                                   src="./assets/img/user1-128x128.jpg"
    1175. 

  1175.                                   alt="User Avatar"
    1176. 

  1176.                                 />
    1177. 

  1177. 

  1178.                                 <div class="contacts-list-info">
    1179. 

  1179.                                   <span class="contacts-list-name">
    1180. 

  1180.                                     Count Dracula
    1181. 

  1181.                                     <small class="contacts-list-date float-end"> 2/28/2023 </small>
    1182. 

  1182.                                   </span>
    1183. 

  1183.                                   <span class="contacts-list-msg">
    1184. 

  1184.                                     How have you been? I was...
    1185. 

  1185.                                   </span>
    1186. 

  1186.                                 </div>
    1187. 

  1187.                                 <!-- /.contacts-list-info -->
    1188. 

  1188.                               </a>
    1189. 

  1189.                             </li>
    1190. 

  1190.                             <!-- End Contact Item -->
    1191. 

  1191.                             <li>
    1192. 

  1192.                               <a href="#">
    1193. 

  1193.                                 <img
    1194. 

  1194.                                   class="contacts-list-img"
    1195. 

  1195.                                   src="./assets/img/user7-128x128.jpg"
    1196. 

  1196.                                   alt="User Avatar"
    1197. 

  1197.                                 />
    1198. 

  1198. 

  1199.                                 <div class="contacts-list-info">
    1200. 

  1200.                                   <span class="contacts-list-name">
    1201. 

  1201.                                     Sarah Doe
    1202. 

  1202.                                     <small class="contacts-list-date float-end"> 2/23/2023 </small>
    1203. 

  1203.                                   </span>
    1204. 

  1204.                                   <span class="contacts-list-msg"> I will be waiting for... </span>
    1205. 

  1205.                                 </div>
    1206. 

  1206.                                 <!-- /.contacts-list-info -->
    1207. 

  1207.                               </a>
    1208. 

  1208.                             </li>
    1209. 

  1209.                             <!-- End Contact Item -->
    1210. 

  1210.                             <li>
    1211. 

  1211.                               <a href="#">
    1212. 

  1212.                                 <img
    1213. 

  1213.                                   class="contacts-list-img"
    1214. 

  1214.                                   src="./assets/img/user3-128x128.jpg"
    1215. 

  1215.                                   alt="User Avatar"
    1216. 

  1216.                                 />
    1217. 

  1217. 

  1218.                                 <div class="contacts-list-info">
    1219. 

  1219.                                   <span class="contacts-list-name">
    1220. 

  1220.                                     Nadia Jolie
    1221. 

  1221.                                     <small class="contacts-list-date float-end"> 2/20/2023 </small>
    1222. 

  1222.                                   </span>
    1223. 

  1223.                                   <span class="contacts-list-msg"> I'll call you back at... </span>
    1224. 

  1224.                                 </div>
    1225. 

  1225.                                 <!-- /.contacts-list-info -->
    1226. 

  1226.                               </a>
    1227. 

  1227.                             </li>
    1228. 

  1228.                             <!-- End Contact Item -->
    1229. 

  1229.                             <li>
    1230. 

  1230.                               <a href="#">
    1231. 

  1231.                                 <img
    1232. 

  1232.                                   class="contacts-list-img"
    1233. 

  1233.                                   src="./assets/img/user5-128x128.jpg"
    1234. 

  1234.                                   alt="User Avatar"
    1235. 

  1235.                                 />
    1236. 

  1236. 

  1237.                                 <div class="contacts-list-info">
    1238. 

  1238.                                   <span class="contacts-list-name">
    1239. 

  1239.                                     Nora S. Vans
    1240. 

  1240.                                     <small class="contacts-list-date float-end"> 2/10/2023 </small>
    1241. 

  1241.                                   </span>
    1242. 

  1242.                                   <span class="contacts-list-msg"> Where is your new... </span>
    1243. 

  1243.                                 </div>
    1244. 

  1244.                                 <!-- /.contacts-list-info -->
    1245. 

  1245.                               </a>
    1246. 

  1246.                             </li>
    1247. 

  1247.                             <!-- End Contact Item -->
    1248. 

  1248.                             <li>
    1249. 

  1249.                               <a href="#">
    1250. 

  1250.                                 <img
    1251. 

  1251.                                   class="contacts-list-img"
    1252. 

  1252.                                   src="./assets/img/user6-128x128.jpg"
    1253. 

  1253.                                   alt="User Avatar"
    1254. 

  1254.                                 />
    1255. 

  1255. 

  1256.                                 <div class="contacts-list-info">
    1257. 

  1257.                                   <span class="contacts-list-name">
    1258. 

  1258.                                     John K.
    1259. 

  1259.                                     <small class="contacts-list-date float-end"> 1/27/2023 </small>
    1260. 

  1260.                                   </span>
    1261. 

  1261.                                   <span class="contacts-list-msg"> Can I take a look at... </span>
    1262. 

  1262.                                 </div>
    1263. 

  1263.                                 <!-- /.contacts-list-info -->
    1264. 

  1264.                               </a>
    1265. 

  1265.                             </li>
    1266. 

  1266.                             <!-- End Contact Item -->
    1267. 

  1267.                             <li>
    1268. 

  1268.                               <a href="#">
    1269. 

  1269.                                 <img
    1270. 

  1270.                                   class="contacts-list-img"
    1271. 

  1271.                                   src="./assets/img/user8-128x128.jpg"
    1272. 

  1272.                                   alt="User Avatar"
    1273. 

  1273.                                 />
    1274. 

  1274. 

  1275.                                 <div class="contacts-list-info">
    1276. 

  1276.                                   <span class="contacts-list-name">
    1277. 

  1277.                                     Kenneth M.
    1278. 

  1278.                                     <small class="contacts-list-date float-end"> 1/4/2023 </small>
    1279. 

  1279.                                   </span>
    1280. 

  1280.                                   <span class="contacts-list-msg"> Never mind I found... </span>
    1281. 

  1281.                                 </div>
    1282. 

  1282.                                 <!-- /.contacts-list-info -->
    1283. 

  1283.                               </a>
    1284. 

  1284.                             </li>
    1285. 

  1285.                             <!-- End Contact Item -->
    1286. 

  1286.                           </ul>
    1287. 

  1287.                           <!-- /.contacts-list -->
    1288. 

  1288.                         </div>
    1289. 

  1289.                         <!-- /.direct-chat-pane -->
    1290. 

  1290.                       </div>
    1291. 

  1291.                       <!-- /.card-body -->
    1292. 

  1292.                       <div class="card-footer">
    1293. 

  1293.                         <form action="#" method="post">
    1294. 

  1294.                           <div class="input-group">
    1295. 

  1295.                             <input
    1296. 

  1296.                               type="text"
    1297. 

  1297.                               name="message"
    1298. 

  1298.                               placeholder="Type Message ..."
    1299. 

  1299.                               class="form-control"
    1300. 

  1300.                             />
    1301. 

  1301.                             <span class="input-group-append">
    1302. 

  1302.                               <button type="button" class="btn btn-warning">Send</button>
    1303. 

  1303.                             </span>
    1304. 

  1304.                           </div>
    1305. 

  1305.                         </form>
    1306. 

  1306.                       </div>
    1307. 

  1307.                       <!-- /.card-footer-->
    1308. 

  1308.                     </div>
    1309. 

  1309.                     <!-- /.direct-chat -->
    1310. 

  1310.                   </div>
    1311. 

  1311.                   <!-- /.col -->
    1312. 

  1312. 

  1313.                   <div class="col-md-6">
    1314. 

  1314.                     <!-- USERS LIST -->
    1315. 

  1315.                     <div class="card">
    1316. 

  1316.                       <div class="card-header">
    1317. 

  1317.                         <h3 class="card-title">Latest Members</h3>
    1318. 

  1318. 

  1319.                         <div class="card-tools">
    1320. 

  1320.                           <span class="badge text-bg-danger"> 8 New Members </span>
    1321. 

  1321.                           <button
    1322. 

  1322.                             type="button"
    1323. 

  1323.                             class="btn btn-tool"
    1324. 

  1324.                             data-lte-toggle="card-collapse"
    1325. 

  1325.                           >
    1326. 

  1326.                             <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    1327. 

  1327.                             <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    1328. 

  1328.                           </button>
    1329. 

  1329.                           <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    1330. 

  1330.                             <i class="bi bi-x-lg"></i>
    1331. 

  1331.                           </button>
    1332. 

  1332.                         </div>
    1333. 

  1333.                       </div>
    1334. 

  1334.                       <!-- /.card-header -->
    1335. 

  1335.                       <div class="card-body p-0">
    1336. 

  1336.                         <div class="row text-center m-1">
    1337. 

  1337.                           <div class="col-3 p-2">
    1338. 

  1338.                             <img
    1339. 

  1339.                               class="img-fluid rounded-circle"
    1340. 

  1340.                               src="./assets/img/user1-128x128.jpg"
    1341. 

  1341.                               alt="User Image"
    1342. 

  1342.                             />
    1343. 

  1343.                             <a
    1344. 

  1344.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1345. 

  1345.                               href="#"
    1346. 

  1346.                             >
    1347. 

  1347.                               Alexander Pierce
    1348. 

  1348.                             </a>
    1349. 

  1349.                             <div class="fs-8">Today</div>
    1350. 

  1350.                           </div>
    1351. 

  1351.                           <div class="col-3 p-2">
    1352. 

  1352.                             <img
    1353. 

  1353.                               class="img-fluid rounded-circle"
    1354. 

  1354.                               src="./assets/img/user1-128x128.jpg"
    1355. 

  1355.                               alt="User Image"
    1356. 

  1356.                             />
    1357. 

  1357.                             <a
    1358. 

  1358.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1359. 

  1359.                               href="#"
    1360. 

  1360.                             >
    1361. 

  1361.                               Norman
    1362. 

  1362.                             </a>
    1363. 

  1363.                             <div class="fs-8">Yesterday</div>
    1364. 

  1364.                           </div>
    1365. 

  1365.                           <div class="col-3 p-2">
    1366. 

  1366.                             <img
    1367. 

  1367.                               class="img-fluid rounded-circle"
    1368. 

  1368.                               src="./assets/img/user7-128x128.jpg"
    1369. 

  1369.                               alt="User Image"
    1370. 

  1370.                             />
    1371. 

  1371.                             <a
    1372. 

  1372.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1373. 

  1373.                               href="#"
    1374. 

  1374.                             >
    1375. 

  1375.                               Jane
    1376. 

  1376.                             </a>
    1377. 

  1377.                             <div class="fs-8">12 Jan</div>
    1378. 

  1378.                           </div>
    1379. 

  1379.                           <div class="col-3 p-2">
    1380. 

  1380.                             <img
    1381. 

  1381.                               class="img-fluid rounded-circle"
    1382. 

  1382.                               src="./assets/img/user6-128x128.jpg"
    1383. 

  1383.                               alt="User Image"
    1384. 

  1384.                             />
    1385. 

  1385.                             <a
    1386. 

  1386.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1387. 

  1387.                               href="#"
    1388. 

  1388.                             >
    1389. 

  1389.                               John
    1390. 

  1390.                             </a>
    1391. 

  1391.                             <div class="fs-8">12 Jan</div>
    1392. 

  1392.                           </div>
    1393. 

  1393.                           <div class="col-3 p-2">
    1394. 

  1394.                             <img
    1395. 

  1395.                               class="img-fluid rounded-circle"
    1396. 

  1396.                               src="./assets/img/user2-160x160.jpg"
    1397. 

  1397.                               alt="User Image"
    1398. 

  1398.                             />
    1399. 

  1399.                             <a
    1400. 

  1400.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1401. 

  1401.                               href="#"
    1402. 

  1402.                             >
    1403. 

  1403.                               Alexander
    1404. 

  1404.                             </a>
    1405. 

  1405.                             <div class="fs-8">13 Jan</div>
    1406. 

  1406.                           </div>
    1407. 

  1407.                           <div class="col-3 p-2">
    1408. 

  1408.                             <img
    1409. 

  1409.                               class="img-fluid rounded-circle"
    1410. 

  1410.                               src="./assets/img/user5-128x128.jpg"
    1411. 

  1411.                               alt="User Image"
    1412. 

  1412.                             />
    1413. 

  1413.                             <a
    1414. 

  1414.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1415. 

  1415.                               href="#"
    1416. 

  1416.                             >
    1417. 

  1417.                               Sarah
    1418. 

  1418.                             </a>
    1419. 

  1419.                             <div class="fs-8">14 Jan</div>
    1420. 

  1420.                           </div>
    1421. 

  1421.                           <div class="col-3 p-2">
    1422. 

  1422.                             <img
    1423. 

  1423.                               class="img-fluid rounded-circle"
    1424. 

  1424.                               src="./assets/img/user4-128x128.jpg"
    1425. 

  1425.                               alt="User Image"
    1426. 

  1426.                             />
    1427. 

  1427.                             <a
    1428. 

  1428.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1429. 

  1429.                               href="#"
    1430. 

  1430.                             >
    1431. 

  1431.                               Nora
    1432. 

  1432.                             </a>
    1433. 

  1433.                             <div class="fs-8">15 Jan</div>
    1434. 

  1434.                           </div>
    1435. 

  1435.                           <div class="col-3 p-2">
    1436. 

  1436.                             <img
    1437. 

  1437.                               class="img-fluid rounded-circle"
    1438. 

  1438.                               src="./assets/img/user3-128x128.jpg"
    1439. 

  1439.                               alt="User Image"
    1440. 

  1440.                             />
    1441. 

  1441.                             <a
    1442. 

  1442.                               class="btn fw-bold fs-7 text-secondary text-truncate w-100 p-0"
    1443. 

  1443.                               href="#"
    1444. 

  1444.                             >
    1445. 

  1445.                               Nadia
    1446. 

  1446.                             </a>
    1447. 

  1447.                             <div class="fs-8">15 Jan</div>
    1448. 

  1448.                           </div>
    1449. 

  1449.                         </div>
    1450. 

  1450.                         <!-- /.users-list -->
    1451. 

  1451.                       </div>
    1452. 

  1452.                       <!-- /.card-body -->
    1453. 

  1453.                       <div class="card-footer text-center">
    1454. 

  1454.                         <a
    1455. 

  1455.                           href="javascript:"
    1456. 

  1456.                           class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1457. 

  1457.                           >View All Users</a
    1458. 

  1458.                         >
    1459. 

  1459.                       </div>
    1460. 

  1460.                       <!-- /.card-footer -->
    1461. 

  1461.                     </div>
    1462. 

  1462.                     <!-- /.card -->
    1463. 

  1463.                   </div>
    1464. 

  1464.                   <!-- /.col -->
    1465. 

  1465.                 </div>
    1466. 

  1466.                 <!--end::Row-->
    1467. 

  1467. 

  1468.                 <!--begin::Latest Order Widget-->
    1469. 

  1469.                 <div class="card">
    1470. 

  1470.                   <div class="card-header">
    1471. 

  1471.                     <h3 class="card-title">Latest Orders</h3>
    1472. 

  1472. 

  1473.                     <div class="card-tools">
    1474. 

  1474.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
    1475. 

  1475.                         <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    1476. 

  1476.                         <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    1477. 

  1477.                       </button>
    1478. 

  1478.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    1479. 

  1479.                         <i class="bi bi-x-lg"></i>
    1480. 

  1480.                       </button>
    1481. 

  1481.                     </div>
    1482. 

  1482.                   </div>
    1483. 

  1483.                   <!-- /.card-header -->
    1484. 

  1484.                   <div class="card-body p-0">
    1485. 

  1485.                     <div class="table-responsive">
    1486. 

  1486.                       <table class="table m-0">
    1487. 

  1487.                         <thead>
    1488. 

  1488.                           <tr>
    1489. 

  1489.                             <th>Order ID</th>
    1490. 

  1490.                             <th>Item</th>
    1491. 

  1491.                             <th>Status</th>
    1492. 

  1492.                             <th>Popularity</th>
    1493. 

  1493.                           </tr>
    1494. 

  1494.                         </thead>
    1495. 

  1495.                         <tbody>
    1496. 

  1496.                           <tr>
    1497. 

  1497.                             <td>
    1498. 

  1498.                               <a
    1499. 

  1499.                                 href="pages/examples/invoice.html"
    1500. 

  1500.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1501. 

  1501.                                 >OR9842</a
    1502. 

  1502.                               >
    1503. 

  1503.                             </td>
    1504. 

  1504.                             <td>Call of Duty IV</td>
    1505. 

  1505.                             <td>
    1506. 

  1506.                               <span class="badge text-bg-success"> Shipped </span>
    1507. 

  1507.                             </td>
    1508. 

  1508.                             <td>
    1509. 

  1509.                               <div id="table-sparkline-1"></div>
    1510. 

  1510.                             </td>
    1511. 

  1511.                           </tr>
    1512. 

  1512.                           <tr>
    1513. 

  1513.                             <td>
    1514. 

  1514.                               <a
    1515. 

  1515.                                 href="pages/examples/invoice.html"
    1516. 

  1516.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1517. 

  1517.                                 >OR1848</a
    1518. 

  1518.                               >
    1519. 

  1519.                             </td>
    1520. 

  1520.                             <td>Samsung Smart TV</td>
    1521. 

  1521.                             <td>
    1522. 

  1522.                               <span class="badge text-bg-warning">Pending</span>
    1523. 

  1523.                             </td>
    1524. 

  1524.                             <td>
    1525. 

  1525.                               <div id="table-sparkline-2"></div>
    1526. 

  1526.                             </td>
    1527. 

  1527.                           </tr>
    1528. 

  1528.                           <tr>
    1529. 

  1529.                             <td>
    1530. 

  1530.                               <a
    1531. 

  1531.                                 href="pages/examples/invoice.html"
    1532. 

  1532.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1533. 

  1533.                                 >OR7429</a
    1534. 

  1534.                               >
    1535. 

  1535.                             </td>
    1536. 

  1536.                             <td>iPhone 6 Plus</td>
    1537. 

  1537.                             <td>
    1538. 

  1538.                               <span class="badge text-bg-danger"> Delivered </span>
    1539. 

  1539.                             </td>
    1540. 

  1540.                             <td>
    1541. 

  1541.                               <div id="table-sparkline-3"></div>
    1542. 

  1542.                             </td>
    1543. 

  1543.                           </tr>
    1544. 

  1544.                           <tr>
    1545. 

  1545.                             <td>
    1546. 

  1546.                               <a
    1547. 

  1547.                                 href="pages/examples/invoice.html"
    1548. 

  1548.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1549. 

  1549.                                 >OR7429</a
    1550. 

  1550.                               >
    1551. 

  1551.                             </td>
    1552. 

  1552.                             <td>Samsung Smart TV</td>
    1553. 

  1553.                             <td>
    1554. 

  1554.                               <span class="badge text-bg-info">Processing</span>
    1555. 

  1555.                             </td>
    1556. 

  1556.                             <td>
    1557. 

  1557.                               <div id="table-sparkline-4"></div>
    1558. 

  1558.                             </td>
    1559. 

  1559.                           </tr>
    1560. 

  1560.                           <tr>
    1561. 

  1561.                             <td>
    1562. 

  1562.                               <a
    1563. 

  1563.                                 href="pages/examples/invoice.html"
    1564. 

  1564.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1565. 

  1565.                                 >OR1848</a
    1566. 

  1566.                               >
    1567. 

  1567.                             </td>
    1568. 

  1568.                             <td>Samsung Smart TV</td>
    1569. 

  1569.                             <td>
    1570. 

  1570.                               <span class="badge text-bg-warning">Pending</span>
    1571. 

  1571.                             </td>
    1572. 

  1572.                             <td>
    1573. 

  1573.                               <div id="table-sparkline-5"></div>
    1574. 

  1574.                             </td>
    1575. 

  1575.                           </tr>
    1576. 

  1576.                           <tr>
    1577. 

  1577.                             <td>
    1578. 

  1578.                               <a
    1579. 

  1579.                                 href="pages/examples/invoice.html"
    1580. 

  1580.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1581. 

  1581.                                 >OR7429</a
    1582. 

  1582.                               >
    1583. 

  1583.                             </td>
    1584. 

  1584.                             <td>iPhone 6 Plus</td>
    1585. 

  1585.                             <td>
    1586. 

  1586.                               <span class="badge text-bg-danger"> Delivered </span>
    1587. 

  1587.                             </td>
    1588. 

  1588.                             <td>
    1589. 

  1589.                               <div id="table-sparkline-6"></div>
    1590. 

  1590.                             </td>
    1591. 

  1591.                           </tr>
    1592. 

  1592.                           <tr>
    1593. 

  1593.                             <td>
    1594. 

  1594.                               <a
    1595. 

  1595.                                 href="pages/examples/invoice.html"
    1596. 

  1596.                                 class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
    1597. 

  1597.                                 >OR9842</a
    1598. 

  1598.                               >
    1599. 

  1599.                             </td>
    1600. 

  1600.                             <td>Call of Duty IV</td>
    1601. 

  1601.                             <td>
    1602. 

  1602.                               <span class="badge text-bg-success">Shipped</span>
    1603. 

  1603.                             </td>
    1604. 

  1604.                             <td>
    1605. 

  1605.                               <div id="table-sparkline-7"></div>
    1606. 

  1606.                             </td>
    1607. 

  1607.                           </tr>
    1608. 

  1608.                         </tbody>
    1609. 

  1609.                       </table>
    1610. 

  1610.                     </div>
    1611. 

  1611.                     <!-- /.table-responsive -->
    1612. 

  1612.                   </div>
    1613. 

  1613.                   <!-- /.card-body -->
    1614. 

  1614.                   <div class="card-footer clearfix">
    1615. 

  1615.                     <a href="javascript:void(0)" class="btn btn-sm btn-primary float-start">
    1616. 

  1616.                       Place New Order
    1617. 

  1617.                     </a>
    1618. 

  1618.                     <a href="javascript:void(0)" class="btn btn-sm btn-secondary float-end">
    1619. 

  1619.                       View All Orders
    1620. 

  1620.                     </a>
    1621. 

  1621.                   </div>
    1622. 

  1622.                   <!-- /.card-footer -->
    1623. 

  1623.                 </div>
    1624. 

  1624.                 <!-- /.card -->
    1625. 

  1625.               </div>
    1626. 

  1626.               <!-- /.col -->
    1627. 

  1627. 

  1628.               <div class="col-md-4">
    1629. 

  1629.                 <!-- Info Boxes Style 2 -->
    1630. 

  1630.                 <div class="info-box mb-3 text-bg-warning">
    1631. 

  1631.                   <span class="info-box-icon">
    1632. 

  1632.                     <i class="bi bi-tag-fill"></i>
    1633. 

  1633.                   </span>
    1634. 

  1634. 

  1635.                   <div class="info-box-content">
    1636. 

  1636.                     <span class="info-box-text">Inventory</span>
    1637. 

  1637.                     <span class="info-box-number">5,200</span>
    1638. 

  1638.                   </div>
    1639. 

  1639.                   <!-- /.info-box-content -->
    1640. 

  1640.                 </div>
    1641. 

  1641.                 <!-- /.info-box -->
    1642. 

  1642.                 <div class="info-box mb-3 text-bg-success">
    1643. 

  1643.                   <span class="info-box-icon">
    1644. 

  1644.                     <i class="bi bi-heart-fill"></i>
    1645. 

  1645.                   </span>
    1646. 

  1646. 

  1647.                   <div class="info-box-content">
    1648. 

  1648.                     <span class="info-box-text">Mentions</span>
    1649. 

  1649.                     <span class="info-box-number">92,050</span>
    1650. 

  1650.                   </div>
    1651. 

  1651.                   <!-- /.info-box-content -->
    1652. 

  1652.                 </div>
    1653. 

  1653.                 <!-- /.info-box -->
    1654. 

  1654.                 <div class="info-box mb-3 text-bg-danger">
    1655. 

  1655.                   <span class="info-box-icon">
    1656. 

  1656.                     <i class="bi bi-cloud-download"></i>
    1657. 

  1657.                   </span>
    1658. 

  1658. 

  1659.                   <div class="info-box-content">
    1660. 

  1660.                     <span class="info-box-text">Downloads</span>
    1661. 

  1661.                     <span class="info-box-number">114,381</span>
    1662. 

  1662.                   </div>
    1663. 

  1663.                   <!-- /.info-box-content -->
    1664. 

  1664.                 </div>
    1665. 

  1665.                 <!-- /.info-box -->
    1666. 

  1666.                 <div class="info-box mb-3 text-bg-info">
    1667. 

  1667.                   <span class="info-box-icon">
    1668. 

  1668.                     <i class="bi bi-chat-fill"></i>
    1669. 

  1669.                   </span>
    1670. 

  1670. 

  1671.                   <div class="info-box-content">
    1672. 

  1672.                     <span class="info-box-text">Direct Messages</span>
    1673. 

  1673.                     <span class="info-box-number">163,921</span>
    1674. 

  1674.                   </div>
    1675. 

  1675.                   <!-- /.info-box-content -->
    1676. 

  1676.                 </div>
    1677. 

  1677.                 <!-- /.info-box -->
    1678. 

  1678. 

  1679.                 <div class="card mb-4">
    1680. 

  1680.                   <div class="card-header">
    1681. 

  1681.                     <h3 class="card-title">Browser Usage</h3>
    1682. 

  1682. 

  1683.                     <div class="card-tools">
    1684. 

  1684.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
    1685. 

  1685.                         <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    1686. 

  1686.                         <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    1687. 

  1687.                       </button>
    1688. 

  1688.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    1689. 

  1689.                         <i class="bi bi-x-lg"></i>
    1690. 

  1690.                       </button>
    1691. 

  1691.                     </div>
    1692. 

  1692.                   </div>
    1693. 

  1693.                   <!-- /.card-header -->
    1694. 

  1694.                   <div class="card-body">
    1695. 

  1695.                     <!--begin::Row-->
    1696. 

  1696.                     <div class="row">
    1697. 

  1697.                       <div class="col-12">
    1698. 

  1698.                         <div id="pie-chart"></div>
    1699. 

  1699.                       </div>
    1700. 

  1700.                       <!-- /.col -->
    1701. 

  1701.                     </div>
    1702. 

  1702.                     <!--end::Row-->
    1703. 

  1703.                   </div>
    1704. 

  1704.                   <!-- /.card-body -->
    1705. 

  1705.                   <div class="card-footer p-0">
    1706. 

  1706.                     <ul class="nav nav-pills flex-column">
    1707. 

  1707.                       <li class="nav-item">
    1708. 

  1708.                         <a href="#" class="nav-link">
    1709. 

  1709.                           United States of America
    1710. 

  1710.                           <span class="float-end text-danger">
    1711. 

  1711.                             <i class="bi bi-arrow-down fs-7"></i>
    1712. 

  1712.                             12%
    1713. 

  1713.                           </span>
    1714. 

  1714.                         </a>
    1715. 

  1715.                       </li>
    1716. 

  1716.                       <li class="nav-item">
    1717. 

  1717.                         <a href="#" class="nav-link">
    1718. 

  1718.                           India
    1719. 

  1719.                           <span class="float-end text-success">
    1720. 

  1720.                             <i class="bi bi-arrow-up fs-7"></i> 4%
    1721. 

  1721.                           </span>
    1722. 

  1722.                         </a>
    1723. 

  1723.                       </li>
    1724. 

  1724.                       <li class="nav-item">
    1725. 

  1725.                         <a href="#" class="nav-link">
    1726. 

  1726.                           China
    1727. 

  1727.                           <span class="float-end text-info">
    1728. 

  1728.                             <i class="bi bi-arrow-left fs-7"></i> 0%
    1729. 

  1729.                           </span>
    1730. 

  1730.                         </a>
    1731. 

  1731.                       </li>
    1732. 

  1732.                     </ul>
    1733. 

  1733.                   </div>
    1734. 

  1734.                   <!-- /.footer -->
    1735. 

  1735.                 </div>
    1736. 

  1736.                 <!-- /.card -->
    1737. 

  1737. 

  1738.                 <!-- PRODUCT LIST -->
    1739. 

  1739.                 <div class="card">
    1740. 

  1740.                   <div class="card-header">
    1741. 

  1741.                     <h3 class="card-title">Recently Added Products</h3>
    1742. 

  1742. 

  1743.                     <div class="card-tools">
    1744. 

  1744.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
    1745. 

  1745.                         <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
    1746. 

  1746.                         <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
    1747. 

  1747.                       </button>
    1748. 

  1748.                       <button type="button" class="btn btn-tool" data-lte-toggle="card-remove">
    1749. 

  1749.                         <i class="bi bi-x-lg"></i>
    1750. 

  1750.                       </button>
    1751. 

  1751.                     </div>
    1752. 

  1752.                   </div>
    1753. 

  1753.                   <!-- /.card-header -->
    1754. 

  1754.                   <div class="card-body p-0">
    1755. 

  1755.                     <div class="px-2">
    1756. 

  1756.                       <div class="d-flex border-top py-2 px-1">
    1757. 

  1757.                         <div class="col-2">
    1758. 

  1758.                           <img
    1759. 

  1759.                             src="./assets/img/default-150x150.png"
    1760. 

  1760.                             alt="Product Image"
    1761. 

  1761.                             class="img-size-50"
    1762. 

  1762.                           />
    1763. 

  1763.                         </div>
    1764. 

  1764.                         <div class="col-10">
    1765. 

  1765.                           <a href="javascript:void(0)" class="fw-bold">
    1766. 

  1766.                             Samsung TV
    1767. 

  1767.                             <span class="badge text-bg-warning float-end"> $1800 </span>
    1768. 

  1768.                           </a>
    1769. 

  1769.                           <div class="text-truncate">Samsung 32" 1080p 60Hz LED Smart HDTV.</div>
    1770. 

  1770.                         </div>
    1771. 

  1771.                       </div>
    1772. 

  1772.                       <!-- /.item -->
    1773. 

  1773.                       <div class="d-flex border-top py-2 px-1">
    1774. 

  1774.                         <div class="col-2">
    1775. 

  1775.                           <img
    1776. 

  1776.                             src="./assets/img/default-150x150.png"
    1777. 

  1777.                             alt="Product Image"
    1778. 

  1778.                             class="img-size-50"
    1779. 

  1779.                           />
    1780. 

  1780.                         </div>
    1781. 

  1781.                         <div class="col-10">
    1782. 

  1782.                           <a href="javascript:void(0)" class="fw-bold">
    1783. 

  1783.                             Bicycle
    1784. 

  1784.                             <span class="badge text-bg-info float-end"> $700 </span>
    1785. 

  1785.                           </a>
    1786. 

  1786.                           <div class="text-truncate">
    1787. 

  1787.                             26" Mongoose Dolomite Men's 7-speed, Navy Blue.
    1788. 

  1788.                           </div>
    1789. 

  1789.                         </div>
    1790. 

  1790.                       </div>
    1791. 

  1791.                       <!-- /.item -->
    1792. 

  1792.                       <div class="d-flex border-top py-2 px-1">
    1793. 

  1793.                         <div class="col-2">
    1794. 

  1794.                           <img
    1795. 

  1795.                             src="./assets/img/default-150x150.png"
    1796. 

  1796.                             alt="Product Image"
    1797. 

  1797.                             class="img-size-50"
    1798. 

  1798.                           />
    1799. 

  1799.                         </div>
    1800. 

  1800.                         <div class="col-10">
    1801. 

  1801.                           <a href="javascript:void(0)" class="fw-bold">
    1802. 

  1802.                             Xbox One
    1803. 

  1803.                             <span class="badge text-bg-danger float-end"> $350 </span>
    1804. 

  1804.                           </a>
    1805. 

  1805.                           <div class="text-truncate">
    1806. 

  1806.                             Xbox One Console Bundle with Halo Master Chief Collection.
    1807. 

  1807.                           </div>
    1808. 

  1808.                         </div>
    1809. 

  1809.                       </div>
    1810. 

  1810.                       <!-- /.item -->
    1811. 

  1811.                       <div class="d-flex border-top py-2 px-1">
    1812. 

  1812.                         <div class="col-2">
    1813. 

  1813.                           <img
    1814. 

  1814.                             src="./assets/img/default-150x150.png"
    1815. 

  1815.                             alt="Product Image"
    1816. 

  1816.                             class="img-size-50"
    1817. 

  1817.                           />
    1818. 

  1818.                         </div>
    1819. 

  1819.                         <div class="col-10">
    1820. 

  1820.                           <a href="javascript:void(0)" class="fw-bold">
    1821. 

  1821.                             PlayStation 4
    1822. 

  1822.                             <span class="badge text-bg-success float-end"> $399 </span>
    1823. 

  1823.                           </a>
    1824. 

  1824.                           <div class="text-truncate">PlayStation 4 500GB Console (PS4)</div>
    1825. 

  1825.                         </div>
    1826. 

  1826.                       </div>
    1827. 

  1827.                       <!-- /.item -->
    1828. 

  1828.                     </div>
    1829. 

  1829.                   </div>
    1830. 

  1830.                   <!-- /.card-body -->
    1831. 

  1831.                   <div class="card-footer text-center">
    1832. 

  1832.                     <a href="javascript:void(0)" class="uppercase"> View All Products </a>
    1833. 

  1833.                   </div>
    1834. 

  1834.                   <!-- /.card-footer -->
    1835. 

  1835.                 </div>
    1836. 

  1836.                 <!-- /.card -->
    1837. 

  1837.               </div>
    1838. 

  1838.               <!-- /.col -->
    1839. 

  1839.             </div>
    1840. 

  1840.             <!--end::Row-->
    1841. 

  1841.           </div>
    1842. 

  1842.           <!--end::Container-->
    1843. 

  1843.         </div>
    1844. 

  1844.         <!--end::App Content-->
    1845. 

  1845.       </main>
    1846. 

  1846.       <!--end::App Main-->
    1847. 

  1847.       <!--begin::Footer-->
    1848. 

  1848.       <footer class="app-footer">
    1849. 

  1849.         <!--begin::To the end-->
    1850. 

  1850.         <div class="float-end d-none d-sm-inline">Anything you want</div>
    1851. 

  1851.         <!--end::To the end-->
    1852. 

  1852.         <!--begin::Copyright-->
    1853. 

  1853.         <strong>
    1854. 

  1854.           Copyright &copy; 2014-2026&nbsp;
    1855. 

  1855.           <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
    1856. 

  1856.         </strong>
    1857. 

  1857.         All rights reserved.
    1858. 

  1858.         <!--end::Copyright-->
    1859. 

  1859.       </footer>
    1860. 

  1860.       <!--end::Footer-->
    1861. 

  1861.     </div>
    1862. 

  1862.     <!--end::App Wrapper-->
    1863. 

  1863.     <!--begin::Script-->
    1864. 

  1864.     <!--begin::Third Party Plugin(OverlayScrollbars)-->
    1865. 

  1865.     <script
    1866. 

  1866.       src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/browser/overlayscrollbars.browser.es6.min.js"
    1867. 

  1867.       crossorigin="anonymous"
    1868. 

  1868.     ></script>
    1869. 

  1869.     <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
    1870. 

  1870.     <script
    1871. 

  1871.       src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
    1872. 

  1872.       crossorigin="anonymous"
    1873. 

  1873.     ></script>
    1874. 

  1874.     <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
    1875. 

  1875.     <script
    1876. 

  1876.       src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js"
    1877. 

  1877.       crossorigin="anonymous"
    1878. 

  1878.     ></script>
    1879. 

  1879.     <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
    1880. 

  1880.     <script src="./js/adminlte.js"></script>
    1881. 

  1881.     <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
    1882. 

  1882.     <script>
    1883. 

  1883.       const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
    1884. 

  1884.       const Default = {
    1885. 

  1885.         scrollbarTheme: 'os-theme-light',
    1886. 

  1886.         scrollbarAutoHide: 'leave',
    1887. 

  1887.         scrollbarClickScroll: true,
    1888. 

  1888.       };
    1889. 

  1889.       document.addEventListener('DOMContentLoaded', function () {
    1890. 

  1890.         const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
    1891. 

  1891. 

  1892.         // Disable OverlayScrollbars on mobile devices to prevent touch interference
    1893. 

  1893.         const isMobile = window.innerWidth <= 992;
    1894. 

  1894. 

  1895.         if (
    1896. 

  1896.           sidebarWrapper &&
    1897. 

  1897.           OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined &&
    1898. 

  1898.           !isMobile
    1899. 

  1899.         ) {
    1900. 

  1900.           OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
    1901. 

  1901.             scrollbars: {
    1902. 

  1902.               theme: Default.scrollbarTheme,
    1903. 

  1903.               autoHide: Default.scrollbarAutoHide,
    1904. 

  1904.               clickScroll: Default.scrollbarClickScroll,
    1905. 

  1905.             },
    1906. 

  1906.           });
    1907. 

  1907.         }
    1908. 

  1908.       });
    1909. 

  1909.     </script>
    1910. 

  1910.     <!--end::OverlayScrollbars Configure-->
    1911. 

  1911. 

  1912.     <!-- OPTIONAL SCRIPTS -->
    1913. 

  1913. 

  1914.     <!-- apexcharts -->
    1915. 

  1915.     <script
    1916. 

  1916.       src="https://cdn.jsdelivr.net/npm/apexcharts@3.37.1/dist/apexcharts.min.js"
    1917. 

  1917.       integrity="sha256-+vh8GkaU7C9/wbSLIcwq82tQ2wTf44aOHA8HlBMwRI8="
    1918. 

  1918.       crossorigin="anonymous"
    1919. 

  1919.     ></script>
    1920. 

  1920. 

  1921.     <script>
    1922. 

  1922.       // NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
    1923. 

  1923.       // IT'S ALL JUST JUNK FOR DEMO
    1924. 

  1924.       // ++++++++++++++++++++++++++++++++++++++++++
    1925. 

  1925. 

  1926.       /* apexcharts
    1927. 

  1927.        * -------
    1928. 

  1928.        * Here we will create a few charts using apexcharts
    1929. 

  1929.        */
    1930. 

  1930. 

  1931.       //-----------------------
    1932. 

  1932.       // - MONTHLY SALES CHART -
    1933. 

  1933.       //-----------------------
    1934. 

  1934. 

  1935.       const sales_chart_options = {
    1936. 

  1936.         series: [
    1937. 

  1937.           {
    1938. 

  1938.             name: 'Digital Goods',
    1939. 

  1939.             data: [28, 48, 40, 19, 86, 27, 90],
    1940. 

  1940.           },
    1941. 

  1941.           {
    1942. 

  1942.             name: 'Electronics',
    1943. 

  1943.             data: [65, 59, 80, 81, 56, 55, 40],
    1944. 

  1944.           },
    1945. 

  1945.         ],
    1946. 

  1946.         chart: {
    1947. 

  1947.           height: 180,
    1948. 

  1948.           type: 'area',
    1949. 

  1949.           toolbar: {
    1950. 

  1950.             show: false,
    1951. 

  1951.           },
    1952. 

  1952.         },
    1953. 

  1953.         legend: {
    1954. 

  1954.           show: false,
    1955. 

  1955.         },
    1956. 

  1956.         colors: ['#0d6efd', '#20c997'],
    1957. 

  1957.         dataLabels: {
    1958. 

  1958.           enabled: false,
    1959. 

  1959.         },
    1960. 

  1960.         stroke: {
    1961. 

  1961.           curve: 'smooth',
    1962. 

  1962.         },
    1963. 

  1963.         xaxis: {
    1964. 

  1964.           type: 'datetime',
    1965. 

  1965.           categories: [
    1966. 

  1966.             '2023-01-01',
    1967. 

  1967.             '2023-02-01',
    1968. 

  1968.             '2023-03-01',
    1969. 

  1969.             '2023-04-01',
    1970. 

  1970.             '2023-05-01',
    1971. 

  1971.             '2023-06-01',
    1972. 

  1972.             '2023-07-01',
    1973. 

  1973.           ],
    1974. 

  1974.         },
    1975. 

  1975.         tooltip: {
    1976. 

  1976.           x: {
    1977. 

  1977.             format: 'MMMM yyyy',
    1978. 

  1978.           },
    1979. 

  1979.         },
    1980. 

  1980.       };
    1981. 

  1981. 

  1982.       const sales_chart = new ApexCharts(
    1983. 

  1983.         document.querySelector('#sales-chart'),
    1984. 

  1984.         sales_chart_options,
    1985. 

  1985.       );
    1986. 

  1986.       sales_chart.render();
    1987. 

  1987. 

  1988.       //---------------------------
    1989. 

  1989.       // - END MONTHLY SALES CHART -
    1990. 

  1990.       //---------------------------
    1991. 

  1991. 

  1992.       function createSparklineChart(selector, data) {
    1993. 

  1993.         const options = {
    1994. 

  1994.           series: [{ data }],
    1995. 

  1995.           chart: {
    1996. 

  1996.             type: 'line',
    1997. 

  1997.             width: 150,
    1998. 

  1998.             height: 30,
    1999. 

  1999.             sparkline: {
    2000. 

  2000.               enabled: true,
    2001. 

  2001.             },
    2002. 

  2002.           },
    2003. 

  2003.           colors: ['var(--bs-primary)'],
    2004. 

  2004.           stroke: {
    2005. 

  2005.             width: 2,
    2006. 

  2006.           },
    2007. 

  2007.           tooltip: {
    2008. 

  2008.             fixed: {
    2009. 

  2009.               enabled: false,
    2010. 

  2010.             },
    2011. 

  2011.             x: {
    2012. 

  2012.               show: false,
    2013. 

  2013.             },
    2014. 

  2014.             y: {
    2015. 

  2015.               title: {
    2016. 

  2016.                 formatter() {
    2017. 

  2017.                   return '';
    2018. 

  2018.                 },
    2019. 

  2019.               },
    2020. 

  2020.             },
    2021. 

  2021.             marker: {
    2022. 

  2022.               show: false,
    2023. 

  2023.             },
    2024. 

  2024.           },
    2025. 

  2025.         };
    2026. 

  2026. 

  2027.         const chart = new ApexCharts(document.querySelector(selector), options);
    2028. 

  2028.         chart.render();
    2029. 

  2029.       }
    2030. 

  2030. 

  2031.       const table_sparkline_1_data = [25, 66, 41, 89, 63, 25, 44, 12, 36, 9, 54];
    2032. 

  2032.       const table_sparkline_2_data = [12, 56, 21, 39, 73, 45, 64, 52, 36, 59, 44];
    2033. 

  2033.       const table_sparkline_3_data = [15, 46, 21, 59, 33, 15, 34, 42, 56, 19, 64];
    2034. 

  2034.       const table_sparkline_4_data = [30, 56, 31, 69, 43, 35, 24, 32, 46, 29, 64];
    2035. 

  2035.       const table_sparkline_5_data = [20, 76, 51, 79, 53, 35, 54, 22, 36, 49, 64];
    2036. 

  2036.       const table_sparkline_6_data = [5, 36, 11, 69, 23, 15, 14, 42, 26, 19, 44];
    2037. 

  2037.       const table_sparkline_7_data = [12, 56, 21, 39, 73, 45, 64, 52, 36, 59, 74];
    2038. 

  2038. 

  2039.       createSparklineChart('#table-sparkline-1', table_sparkline_1_data);
    2040. 

  2040.       createSparklineChart('#table-sparkline-2', table_sparkline_2_data);
    2041. 

  2041.       createSparklineChart('#table-sparkline-3', table_sparkline_3_data);
    2042. 

  2042.       createSparklineChart('#table-sparkline-4', table_sparkline_4_data);
    2043. 

  2043.       createSparklineChart('#table-sparkline-5', table_sparkline_5_data);
    2044. 

  2044.       createSparklineChart('#table-sparkline-6', table_sparkline_6_data);
    2045. 

  2045.       createSparklineChart('#table-sparkline-7', table_sparkline_7_data);
    2046. 

  2046. 

  2047.       //-------------
    2048. 

  2048.       // - PIE CHART -
    2049. 

  2049.       //-------------
    2050. 

  2050. 

  2051.       const pie_chart_options = {
    2052. 

  2052.         series: [700, 500, 400, 600, 300, 100],
    2053. 

  2053.         chart: {
    2054. 

  2054.           type: 'donut',
    2055. 

  2055.         },
    2056. 

  2056.         labels: ['Chrome', 'Edge', 'FireFox', 'Safari', 'Opera', 'IE'],
    2057. 

  2057.         dataLabels: {
    2058. 

  2058.           enabled: false,
    2059. 

  2059.         },
    2060. 

  2060.         colors: ['#0d6efd', '#20c997', '#ffc107', '#d63384', '#6f42c1', '#adb5bd'],
    2061. 

  2061.       };
    2062. 

  2062. 

  2063.       const pie_chart = new ApexCharts(document.querySelector('#pie-chart'), pie_chart_options);
    2064. 

  2064.       pie_chart.render();
    2065. 

  2065. 

  2066.       //-----------------
    2067. 

  2067.       // - END PIE CHART -
    2068. 

  2068.       //-----------------
    2069. 

  2069.     </script>
    2070. 

  2070.     <!--end::Script-->
    2071. 

  2071.   </body>
    2072. 

  2072.   <!--end::Body-->
    2073. 

  2073. </html>
    2074.