index.php 61 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865
  1. <?php
  2. require('autoload.php');
  3. ?>
  4. <!DOCTYPE html>
  5. <html lang="en">
  6. <head>
  7. <meta charset="utf-8">
  8. <title>EQ2EMU Labs</title>
  9. <meta name="description" content="Page Titile">
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  11. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no, minimal-ui">
  12. <!-- Call App Mode on ios devices -->
  13. <meta name="apple-mobile-web-app-capable" content="yes" />
  14. <!-- Remove Tap Highlight on Windows Phone IE -->
  15. <meta name="msapplication-tap-highlight" content="no">
  16. <!-- base css -->
  17. <link rel="stylesheet" media="screen, print" href="css/vendors.bundle.css">
  18. <link rel="stylesheet" media="screen, print" href="css/app.bundle.css">
  19. <!-- Place favicon.ico in the root directory -->
  20. <link rel="apple-touch-icon" sizes="180x180" href="img/eq2emu_labs_logo_180.png">
  21. <link rel="icon" type="image/png" sizes="32x32" href="img/favicon/eq2emu_labs_favico_32.png">
  22. <link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg" color="#5bbad5">
  23. <link rel="stylesheet" href="css/animate.min.css">
  24. <link rel="stylesheet" href="css/fa-light.css">
  25. <link rel="stylesheet" href="css/fa-regular.css">
  26. <link rel="stylesheet" href="css/fa-solid.css">
  27. <link rel="stylesheet" href="css/fa-duotone.css">
  28. <link rel="stylesheet" href="css/fa-brands.css">
  29. <link rel="stylesheet" href="css/eq2emu.css">
  30. <link rel="stylesheet" media="screen, print" href="css/datagrid/datatables/datatables.bundle.css">
  31. <script src="js/datagrid/datatables/datatables.bundle.js"></script>
  32. <!--<link rel="stylesheet" media="screen, print" href="css/your_styles.css">-->
  33. <script src="js/vendors.bundle.js"></script>
  34. <script src="js/app.bundle.js"></script>
  35. <script src="js/eq2emu.js"></script>
  36. </head>
  37. <body class="mod-bg-1 ">
  38. <!-- DOC: script to save and load page settings -->
  39. <script>
  40. <?php include('js/pagescript.php'); ?>
  41. </script>
  42. <!-- BEGIN Page Wrapper -->
  43. <div class="page-wrapper">
  44. <div class="page-inner">
  45. <!-- BEGIN Left Aside -->
  46. <aside class="page-sidebar">
  47. <!-- <div class="page-logo">
  48. </div>
  49. BEGIN PRIMARY NAVIGATION -->
  50. <nav id="js-primary-nav" class="primary-nav" role="navigation">
  51. <div class="nav-filter">
  52. <div class="position-relative">
  53. <input type="text" id="nav_filter_input" placeholder="Filter menu" class="form-control" tabindex="0">
  54. <a href="#" onclick="return false;" class="btn-primary btn-search-close js-waves-off" data-action="toggle" data-class="list-filter-active" data-target=".page-sidebar">
  55. <i class="fal fa-chevron-up"></i>
  56. </a>
  57. </div>
  58. </div>
  59. <div class="info-card">
  60. <img src="img/eq2emu_nav_logo.png"/>
  61. </div>
  62. <ul id="js-nav-menu" class="nav-menu">
  63. <?php echo get_nav_menu(); ?>
  64. </ul>
  65. <div class="filter-message js-filter-message bg-success-600"></div>
  66. </nav>
  67. <!-- END PRIMARY NAVIGATION -->
  68. <!-- NAV FOOTER -->
  69. <div class="nav-footer shadow-top">
  70. <a href="#" onclick="return false;" data-action="toggle" data-class="nav-function-minify" class="hidden-md-down">
  71. <i class="ni ni-chevron-right"></i>
  72. <i class="ni ni-chevron-right"></i>
  73. </a>
  74. <ul class="list-table m-auto nav-footer-buttons">
  75. <li>
  76. <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Chat logs">
  77. <i class="fal fa-comments"></i>
  78. </a>
  79. </li>
  80. <li>
  81. <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Support Chat">
  82. <i class="fal fa-life-ring"></i>
  83. </a>
  84. </li>
  85. <li>
  86. <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Make a call">
  87. <i class="fal fa-phone"></i>
  88. </a>
  89. </li>
  90. </ul>
  91. </div> <!-- END NAV FOOTER -->
  92. </aside>
  93. <!-- END Left Aside -->
  94. <div class="page-content-wrapper">
  95. <main id="js-page-content" role="main" class="page-content">
  96. <div class="subheader">
  97. <h1 class="subheader-title">
  98. <i class='subheader-icon <?php echo $_m['icon'];?>'></i> <?php echo $_m['title'];?><span class='fw-300'></span> <sup class='badge badge-primary fw-500'>Module</sup>
  99. <small>
  100. <?php echo $_m['desc'];?>
  101. </small>
  102. </h1>
  103. </div>
  104. <!-- the #js-page-content id is needed for some plugins to initialize -->
  105. <?php
  106. if(file_exists('inc/modules/'.$_modules[$_SESSION[_sid]['view']]['file'].'.php')) {
  107. include('inc/modules/'.$_modules[$_SESSION[_sid]['view']]['file'].'.php');
  108. } else {
  109. include('inc/modules/module.404.php');
  110. }
  111. ?>
  112. </main>
  113. <!-- this overlay is activated only when mobile menu is triggered -->
  114. <div class="page-content-overlay" data-action="toggle" data-class="mobile-nav-on"></div> <!-- END Page Content -->
  115. <!-- BEGIN Page Footer -->
  116. <footer class="page-footer" role="contentinfo">
  117. <div class="d-flex align-items-center flex-1 text-muted">
  118. <span class="hidden-md-down fw-700">2020 © SmartAdmin by&nbsp;<a href='https://www.gotbootstrap.com' class='text-primary fw-500' title='gotbootstrap.com' target='_blank'>gotbootstrap.com</a></span>
  119. </div>
  120. <div>
  121. <ul class="list-table m-0">
  122. <li><a href="intel_introduction.html" class="text-secondary fw-700">About</a></li>
  123. <li class="pl-3"><a href="info_app_licensing.html" class="text-secondary fw-700">License</a></li>
  124. <li class="pl-3"><a href="info_app_docs.html" class="text-secondary fw-700">Documentation</a></li>
  125. <li class="pl-3 fs-xl"><a href="https://wrapbootstrap.com/user/MyOrange" class="text-secondary" target="_blank"><i class="fal fa-question-circle" aria-hidden="true"></i></a></li>
  126. </ul>
  127. </div>
  128. </footer>
  129. <!-- END Page Footer -->
  130. <!-- BEGIN Shortcuts -->
  131. <div class="modal fade modal-backdrop-transparent" id="modal-shortcut" tabindex="-1" role="dialog" aria-labelledby="modal-shortcut" aria-hidden="true">
  132. <div class="modal-dialog modal-dialog-top modal-transparent" role="document">
  133. <div class="modal-content">
  134. <div class="modal-body">
  135. <ul class="app-list w-auto h-auto p-0 text-left">
  136. <li>
  137. <a href="intel_introduction.html" class="app-list-item text-white border-0 m-0">
  138. <div class="icon-stack">
  139. <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
  140. <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
  141. <i class="fal fa-home icon-stack-1x opacity-100 color-white"></i>
  142. </div>
  143. <span class="app-list-name">
  144. Home
  145. </span>
  146. </a>
  147. </li>
  148. <li>
  149. <a href="page_inbox_general.html" class="app-list-item text-white border-0 m-0">
  150. <div class="icon-stack">
  151. <i class="base base-7 icon-stack-3x opacity-100 color-success-500 "></i>
  152. <i class="base base-7 icon-stack-2x opacity-100 color-success-300 "></i>
  153. <i class="ni ni-envelope icon-stack-1x text-white"></i>
  154. </div>
  155. <span class="app-list-name">
  156. Inbox
  157. </span>
  158. </a>
  159. </li>
  160. <li>
  161. <a href="intel_introduction.html" class="app-list-item text-white border-0 m-0">
  162. <div class="icon-stack">
  163. <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
  164. <i class="fal fa-plus icon-stack-1x opacity-100 color-white"></i>
  165. </div>
  166. <span class="app-list-name">
  167. Add More
  168. </span>
  169. </a>
  170. </li>
  171. </ul>
  172. </div>
  173. </div>
  174. </div>
  175. </div>
  176. <!-- END Shortcuts -->
  177. <!-- BEGIN Color profile -->
  178. <!-- this area is hidden and will not be seen on screens or screen readers -->
  179. <!-- we use this only for CSS color refernce for JS stuff -->
  180. <p id="js-color-profile" class="d-none">
  181. <span class="color-primary-50"></span>
  182. <span class="color-primary-100"></span>
  183. <span class="color-primary-200"></span>
  184. <span class="color-primary-300"></span>
  185. <span class="color-primary-400"></span>
  186. <span class="color-primary-500"></span>
  187. <span class="color-primary-600"></span>
  188. <span class="color-primary-700"></span>
  189. <span class="color-primary-800"></span>
  190. <span class="color-primary-900"></span>
  191. <span class="color-info-50"></span>
  192. <span class="color-info-100"></span>
  193. <span class="color-info-200"></span>
  194. <span class="color-info-300"></span>
  195. <span class="color-info-400"></span>
  196. <span class="color-info-500"></span>
  197. <span class="color-info-600"></span>
  198. <span class="color-info-700"></span>
  199. <span class="color-info-800"></span>
  200. <span class="color-info-900"></span>
  201. <span class="color-danger-50"></span>
  202. <span class="color-danger-100"></span>
  203. <span class="color-danger-200"></span>
  204. <span class="color-danger-300"></span>
  205. <span class="color-danger-400"></span>
  206. <span class="color-danger-500"></span>
  207. <span class="color-danger-600"></span>
  208. <span class="color-danger-700"></span>
  209. <span class="color-danger-800"></span>
  210. <span class="color-danger-900"></span>
  211. <span class="color-warning-50"></span>
  212. <span class="color-warning-100"></span>
  213. <span class="color-warning-200"></span>
  214. <span class="color-warning-300"></span>
  215. <span class="color-warning-400"></span>
  216. <span class="color-warning-500"></span>
  217. <span class="color-warning-600"></span>
  218. <span class="color-warning-700"></span>
  219. <span class="color-warning-800"></span>
  220. <span class="color-warning-900"></span>
  221. <span class="color-success-50"></span>
  222. <span class="color-success-100"></span>
  223. <span class="color-success-200"></span>
  224. <span class="color-success-300"></span>
  225. <span class="color-success-400"></span>
  226. <span class="color-success-500"></span>
  227. <span class="color-success-600"></span>
  228. <span class="color-success-700"></span>
  229. <span class="color-success-800"></span>
  230. <span class="color-success-900"></span>
  231. <span class="color-fusion-50"></span>
  232. <span class="color-fusion-100"></span>
  233. <span class="color-fusion-200"></span>
  234. <span class="color-fusion-300"></span>
  235. <span class="color-fusion-400"></span>
  236. <span class="color-fusion-500"></span>
  237. <span class="color-fusion-600"></span>
  238. <span class="color-fusion-700"></span>
  239. <span class="color-fusion-800"></span>
  240. <span class="color-fusion-900"></span>
  241. </p>
  242. <!-- END Color profile -->
  243. </div>
  244. </div>
  245. </div>
  246. <!-- END Page Wrapper -->
  247. <!-- BEGIN Quick Menu -->
  248. <!-- to add more items, please make sure to change the variable '$menu-items: number;' in your _page-components-shortcut.scss -->
  249. <nav class="shortcut-menu d-none d-sm-block">
  250. <input type="checkbox" class="menu-open" name="menu-open" id="menu_open" />
  251. <label for="menu_open" class="menu-open-button ">
  252. <span class="app-shortcut-icon d-block"></span>
  253. </label>
  254. <a href="#" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Scroll Top">
  255. <i class="fal fa-arrow-up"></i>
  256. </a>
  257. <a href="page_login.html" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Logout">
  258. <i class="fal fa-sign-out"></i>
  259. </a>
  260. <a href="#" class="menu-item btn" data-action="app-fullscreen" data-toggle="tooltip" data-placement="left" title="Full Screen">
  261. <i class="fal fa-expand"></i>
  262. </a>
  263. <a href="#" class="menu-item btn" data-action="app-print" data-toggle="tooltip" data-placement="left" title="Print page">
  264. <i class="fal fa-print"></i>
  265. </a>
  266. <a href="#" class="menu-item btn" data-action="app-voice" data-toggle="tooltip" data-placement="left" title="Voice command">
  267. <i class="fal fa-microphone"></i>
  268. </a>
  269. </nav>
  270. <!-- END Quick Menu -->
  271. <!-- BEGIN Messenger -->
  272. <div class="modal fade js-modal-messenger modal-backdrop-transparent" tabindex="-1" role="dialog" aria-hidden="true">
  273. <div class="modal-dialog modal-dialog-right">
  274. <div class="modal-content h-100">
  275. <div class="dropdown-header bg-trans-gradient d-flex align-items-center w-100">
  276. <div class="d-flex flex-row align-items-center mt-1 mb-1 color-white">
  277. <span class="mr-2">
  278. <span class="rounded-circle profile-image d-block" style="background-image:url('img/demo/avatars/avatar-d.png'); background-size: cover;"></span>
  279. </span>
  280. <div class="info-card-text">
  281. <a href="javascript:void(0);" class="fs-lg text-truncate text-truncate-lg text-white" data-toggle="dropdown" aria-expanded="false">
  282. Tracey Chang
  283. <i class="fal fa-angle-down d-inline-block ml-1 text-white fs-md"></i>
  284. </a>
  285. <div class="dropdown-menu">
  286. <a class="dropdown-item" href="#">Send Email</a>
  287. <a class="dropdown-item" href="#">Create Appointment</a>
  288. <a class="dropdown-item" href="#">Block User</a>
  289. </div>
  290. <span class="text-truncate text-truncate-md opacity-80">IT Director</span>
  291. </div>
  292. </div>
  293. <button type="button" class="close text-white position-absolute pos-top pos-right p-2 m-1 mr-2" data-dismiss="modal" aria-label="Close">
  294. <span aria-hidden="true"><i class="fal fa-times"></i></span>
  295. </button>
  296. </div>
  297. <div class="modal-body p-0 h-100 d-flex">
  298. <!-- BEGIN msgr-list -->
  299. <div class="msgr-list d-flex flex-column bg-faded border-faded border-top-0 border-right-0 border-bottom-0 position-absolute pos-top pos-bottom">
  300. <div>
  301. <div class="height-4 width-3 h3 m-0 d-flex justify-content-center flex-column color-primary-500 pl-3 mt-2">
  302. <i class="fal fa-search"></i>
  303. </div>
  304. <input type="text" class="form-control bg-white" id="msgr_listfilter_input" placeholder="Filter contacts" aria-label="FriendSearch" data-listfilter="#js-msgr-listfilter">
  305. </div>
  306. <div class="flex-1 h-100 custom-scroll">
  307. <div class="w-100">
  308. <ul id="js-msgr-listfilter" class="list-unstyled m-0">
  309. <li>
  310. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="tracey chang online">
  311. <div class="d-table-cell align-middle status status-success status-sm ">
  312. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-d.png'); background-size: cover;"></span>
  313. </div>
  314. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  315. <div class="text-truncate text-truncate-md">
  316. Tracey Chang
  317. <small class="d-block font-italic text-success fs-xs">
  318. Online
  319. </small>
  320. </div>
  321. </div>
  322. </a>
  323. </li>
  324. <li>
  325. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="oliver kopyuv online">
  326. <div class="d-table-cell align-middle status status-success status-sm ">
  327. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-b.png'); background-size: cover;"></span>
  328. </div>
  329. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  330. <div class="text-truncate text-truncate-md">
  331. Oliver Kopyuv
  332. <small class="d-block font-italic text-success fs-xs">
  333. Online
  334. </small>
  335. </div>
  336. </div>
  337. </a>
  338. </li>
  339. <li>
  340. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="dr john cook phd away">
  341. <div class="d-table-cell align-middle status status-warning status-sm ">
  342. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-e.png'); background-size: cover;"></span>
  343. </div>
  344. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  345. <div class="text-truncate text-truncate-md">
  346. Dr. John Cook PhD
  347. <small class="d-block font-italic fs-xs">
  348. Away
  349. </small>
  350. </div>
  351. </div>
  352. </a>
  353. </li>
  354. <li>
  355. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="ali amdaney online">
  356. <div class="d-table-cell align-middle status status-success status-sm ">
  357. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-g.png'); background-size: cover;"></span>
  358. </div>
  359. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  360. <div class="text-truncate text-truncate-md">
  361. Ali Amdaney
  362. <small class="d-block font-italic fs-xs text-success">
  363. Online
  364. </small>
  365. </div>
  366. </div>
  367. </a>
  368. </li>
  369. <li>
  370. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="sarah mcbrook online">
  371. <div class="d-table-cell align-middle status status-success status-sm">
  372. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-h.png'); background-size: cover;"></span>
  373. </div>
  374. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  375. <div class="text-truncate text-truncate-md">
  376. Sarah McBrook
  377. <small class="d-block font-italic fs-xs text-success">
  378. Online
  379. </small>
  380. </div>
  381. </div>
  382. </a>
  383. </li>
  384. <li>
  385. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="ali amdaney offline">
  386. <div class="d-table-cell align-middle status status-sm">
  387. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-a.png'); background-size: cover;"></span>
  388. </div>
  389. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  390. <div class="text-truncate text-truncate-md">
  391. oliver.kopyuv@gotbootstrap.com
  392. <small class="d-block font-italic fs-xs">
  393. Offline
  394. </small>
  395. </div>
  396. </div>
  397. </a>
  398. </li>
  399. <li>
  400. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="ali amdaney busy">
  401. <div class="d-table-cell align-middle status status-danger status-sm">
  402. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-j.png'); background-size: cover;"></span>
  403. </div>
  404. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  405. <div class="text-truncate text-truncate-md">
  406. oliver.kopyuv@gotbootstrap.com
  407. <small class="d-block font-italic fs-xs text-danger">
  408. Busy
  409. </small>
  410. </div>
  411. </div>
  412. </a>
  413. </li>
  414. <li>
  415. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="ali amdaney offline">
  416. <div class="d-table-cell align-middle status status-sm">
  417. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-c.png'); background-size: cover;"></span>
  418. </div>
  419. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  420. <div class="text-truncate text-truncate-md">
  421. oliver.kopyuv@gotbootstrap.com
  422. <small class="d-block font-italic fs-xs">
  423. Offline
  424. </small>
  425. </div>
  426. </div>
  427. </a>
  428. </li>
  429. <li>
  430. <a href="#" class="d-table w-100 px-2 py-2 text-dark hover-white" data-filter-tags="ali amdaney inactive">
  431. <div class="d-table-cell align-middle">
  432. <span class="profile-image-md rounded-circle d-block" style="background-image:url('img/demo/avatars/avatar-m.png'); background-size: cover;"></span>
  433. </div>
  434. <div class="d-table-cell w-100 align-middle pl-2 pr-2">
  435. <div class="text-truncate text-truncate-md">
  436. +714651347790
  437. <small class="d-block font-italic fs-xs opacity-50">
  438. Missed Call
  439. </small>
  440. </div>
  441. </div>
  442. </a>
  443. </li>
  444. </ul>
  445. <div class="filter-message js-filter-message"></div>
  446. </div>
  447. </div>
  448. <div>
  449. <a class="fs-xl d-flex align-items-center p-3">
  450. <i class="fal fa-cogs"></i>
  451. </a>
  452. </div>
  453. </div>
  454. <!-- END msgr-list -->
  455. <!-- BEGIN msgr -->
  456. <div class="msgr d-flex h-100 flex-column bg-white">
  457. <!-- BEGIN custom-scroll -->
  458. <div class="custom-scroll flex-1 h-100">
  459. <div id="chat_container" class="w-100 p-4">
  460. <!-- start .chat-segment -->
  461. <div class="chat-segment">
  462. <div class="time-stamp text-center mb-2 fw-400">
  463. Jun 19
  464. </div>
  465. </div>
  466. <!-- end .chat-segment -->
  467. <!-- start .chat-segment -->
  468. <div class="chat-segment chat-segment-sent">
  469. <div class="chat-message">
  470. <p>
  471. Hey Tracey, did you get my files?
  472. </p>
  473. </div>
  474. <div class="text-right fw-300 text-muted mt-1 fs-xs">
  475. 3:00 pm
  476. </div>
  477. </div>
  478. <!-- end .chat-segment -->
  479. <!-- start .chat-segment -->
  480. <div class="chat-segment chat-segment-get">
  481. <div class="chat-message">
  482. <p>
  483. Hi
  484. </p>
  485. <p>
  486. Sorry going through a busy time in office. Yes I analyzed the solution.
  487. </p>
  488. <p>
  489. It will require some resource, which I could not manage.
  490. </p>
  491. </div>
  492. <div class="fw-300 text-muted mt-1 fs-xs">
  493. 3:24 pm
  494. </div>
  495. </div>
  496. <!-- end .chat-segment -->
  497. <!-- start .chat-segment -->
  498. <div class="chat-segment chat-segment-sent chat-start">
  499. <div class="chat-message">
  500. <p>
  501. Okay
  502. </p>
  503. </div>
  504. </div>
  505. <!-- end .chat-segment -->
  506. <!-- start .chat-segment -->
  507. <div class="chat-segment chat-segment-sent chat-end">
  508. <div class="chat-message">
  509. <p>
  510. Sending you some dough today, you can allocate the resources to this project.
  511. </p>
  512. </div>
  513. <div class="text-right fw-300 text-muted mt-1 fs-xs">
  514. 3:26 pm
  515. </div>
  516. </div>
  517. <!-- end .chat-segment -->
  518. <!-- start .chat-segment -->
  519. <div class="chat-segment chat-segment-get chat-start">
  520. <div class="chat-message">
  521. <p>
  522. Perfect. Thanks a lot!
  523. </p>
  524. </div>
  525. </div>
  526. <!-- end .chat-segment -->
  527. <!-- start .chat-segment -->
  528. <div class="chat-segment chat-segment-get">
  529. <div class="chat-message">
  530. <p>
  531. I will have them ready by tonight.
  532. </p>
  533. </div>
  534. </div>
  535. <!-- end .chat-segment -->
  536. <!-- start .chat-segment -->
  537. <div class="chat-segment chat-segment-get chat-end">
  538. <div class="chat-message">
  539. <p>
  540. Cheers
  541. </p>
  542. </div>
  543. </div>
  544. <!-- end .chat-segment -->
  545. <!-- start .chat-segment for timestamp -->
  546. <div class="chat-segment">
  547. <div class="time-stamp text-center mb-2 fw-400">
  548. Jun 20
  549. </div>
  550. </div>
  551. <!-- end .chat-segment for timestamp -->
  552. </div>
  553. </div>
  554. <!-- END custom-scroll -->
  555. <!-- BEGIN msgr__chatinput -->
  556. <div class="d-flex flex-column">
  557. <div class="border-faded border-right-0 border-bottom-0 border-left-0 flex-1 mr-3 ml-3 position-relative shadow-top">
  558. <div class="pt-3 pb-1 pr-0 pl-0 rounded-0" tabindex="-1">
  559. <div id="msgr_input" contenteditable="true" data-placeholder="Type your message here..." class="height-10 form-content-editable"></div>
  560. </div>
  561. </div>
  562. <div class="height-8 px-3 d-flex flex-row align-items-center flex-wrap flex-shrink-0">
  563. <a href="javascript:void(0);" class="btn btn-icon fs-xl width-1 mr-1" data-toggle="tooltip" data-original-title="More options" data-placement="top">
  564. <i class="fal fa-ellipsis-v-alt color-fusion-300"></i>
  565. </a>
  566. <a href="javascript:void(0);" class="btn btn-icon fs-xl mr-1" data-toggle="tooltip" data-original-title="Attach files" data-placement="top">
  567. <i class="fal fa-paperclip color-fusion-300"></i>
  568. </a>
  569. <a href="javascript:void(0);" class="btn btn-icon fs-xl mr-1" data-toggle="tooltip" data-original-title="Insert photo" data-placement="top">
  570. <i class="fal fa-camera color-fusion-300"></i>
  571. </a>
  572. <div class="ml-auto">
  573. <a href="javascript:void(0);" class="btn btn-info">Send</a>
  574. </div>
  575. </div>
  576. </div>
  577. <!-- END msgr__chatinput -->
  578. </div>
  579. <!-- END msgr -->
  580. </div>
  581. </div>
  582. </div>
  583. </div>
  584. <!-- END Messenger -->
  585. <!-- BEGIN Page Settings -->
  586. <div class="modal fade js-modal-settings modal-backdrop-transparent" tabindex="-1" role="dialog" aria-hidden="true">
  587. <div class="modal-dialog modal-dialog-right modal-md">
  588. <div class="modal-content">
  589. <div class="dropdown-header bg-trans-gradient d-flex justify-content-center align-items-center w-100">
  590. <h4 class="m-0 text-center color-white">
  591. Layout Settings
  592. <small class="mb-0 opacity-80">User Interface Settings</small>
  593. </h4>
  594. <button type="button" class="close text-white position-absolute pos-top pos-right p-2 m-1 mr-2" data-dismiss="modal" aria-label="Close">
  595. <span aria-hidden="true"><i class="fal fa-times"></i></span>
  596. </button>
  597. </div>
  598. <div class="modal-body p-0">
  599. <div class="settings-panel">
  600. <div class="mt-4 d-table w-100 px-5">
  601. <div class="d-table-cell align-middle">
  602. <h5 class="p-0">
  603. App Layout
  604. </h5>
  605. </div>
  606. </div>
  607. <div class="list" id="fh">
  608. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="header-function-fixed"></a>
  609. <span class="onoffswitch-title">Fixed Header</span>
  610. <span class="onoffswitch-title-desc">header is in a fixed at all times</span>
  611. </div>
  612. <div class="list" id="nff">
  613. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-fixed"></a>
  614. <span class="onoffswitch-title">Fixed Navigation</span>
  615. <span class="onoffswitch-title-desc">left panel is fixed</span>
  616. </div>
  617. <div class="list" id="nfm">
  618. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-minify"></a>
  619. <span class="onoffswitch-title">Minify Navigation</span>
  620. <span class="onoffswitch-title-desc">Skew nav to maximize space</span>
  621. </div>
  622. <div class="list" id="nfh">
  623. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-hidden"></a>
  624. <span class="onoffswitch-title">Hide Navigation</span>
  625. <span class="onoffswitch-title-desc">roll mouse on edge to reveal</span>
  626. </div>
  627. <div class="list" id="nft">
  628. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-top"></a>
  629. <span class="onoffswitch-title">Top Navigation</span>
  630. <span class="onoffswitch-title-desc">Relocate left pane to top</span>
  631. </div>
  632. <div class="list" id="mmb">
  633. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-main-boxed"></a>
  634. <span class="onoffswitch-title">Boxed Layout</span>
  635. <span class="onoffswitch-title-desc">Encapsulates to a container</span>
  636. </div>
  637. <div class="expanded">
  638. <ul class="">
  639. <li>
  640. <div class="bg-fusion-50" data-action="toggle" data-class="mod-bg-1"></div>
  641. </li>
  642. <li>
  643. <div class="bg-warning-200" data-action="toggle" data-class="mod-bg-2"></div>
  644. </li>
  645. <li>
  646. <div class="bg-primary-200" data-action="toggle" data-class="mod-bg-3"></div>
  647. </li>
  648. <li>
  649. <div class="bg-success-300" data-action="toggle" data-class="mod-bg-4"></div>
  650. </li>
  651. </ul>
  652. <div class="list" id="mbgf">
  653. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-fixed-bg"></a>
  654. <span class="onoffswitch-title">Fixed Background</span>
  655. </div>
  656. </div>
  657. <div class="mt-4 d-table w-100 px-5">
  658. <div class="d-table-cell align-middle">
  659. <h5 class="p-0">
  660. Mobile Menu
  661. </h5>
  662. </div>
  663. </div>
  664. <div class="list" id="nmp">
  665. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-push"></a>
  666. <span class="onoffswitch-title">Push Content</span>
  667. <span class="onoffswitch-title-desc">Content pushed on menu reveal</span>
  668. </div>
  669. <div class="list" id="nmno">
  670. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-no-overlay"></a>
  671. <span class="onoffswitch-title">No Overlay</span>
  672. <span class="onoffswitch-title-desc">Removes mesh on menu reveal</span>
  673. </div>
  674. <div class="list" id="sldo">
  675. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-slide-out"></a>
  676. <span class="onoffswitch-title">Off-Canvas <sup>(beta)</sup></span>
  677. <span class="onoffswitch-title-desc">Content overlaps menu</span>
  678. </div>
  679. <div class="mt-4 d-table w-100 px-5">
  680. <div class="d-table-cell align-middle">
  681. <h5 class="p-0">
  682. Accessibility
  683. </h5>
  684. </div>
  685. </div>
  686. <div class="list" id="mbf">
  687. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-bigger-font"></a>
  688. <span class="onoffswitch-title">Bigger Content Font</span>
  689. <span class="onoffswitch-title-desc">content fonts are bigger for readability</span>
  690. </div>
  691. <div class="list" id="mhc">
  692. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-high-contrast"></a>
  693. <span class="onoffswitch-title">High Contrast Text (WCAG 2 AA)</span>
  694. <span class="onoffswitch-title-desc">4.5:1 text contrast ratio</span>
  695. </div>
  696. <div class="list" id="mcb">
  697. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-color-blind"></a>
  698. <span class="onoffswitch-title">Daltonism <sup>(beta)</sup> </span>
  699. <span class="onoffswitch-title-desc">color vision deficiency</span>
  700. </div>
  701. <div class="list" id="mpc">
  702. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-pace-custom"></a>
  703. <span class="onoffswitch-title">Preloader Inside</span>
  704. <span class="onoffswitch-title-desc">preloader will be inside content</span>
  705. </div>
  706. <div class="mt-4 d-table w-100 px-5">
  707. <div class="d-table-cell align-middle">
  708. <h5 class="p-0">
  709. Global Modifications
  710. </h5>
  711. </div>
  712. </div>
  713. <div class="list" id="mcbg">
  714. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-clean-page-bg"></a>
  715. <span class="onoffswitch-title">Clean Page Background</span>
  716. <span class="onoffswitch-title-desc">adds more whitespace</span>
  717. </div>
  718. <div class="list" id="mhni">
  719. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-hide-nav-icons"></a>
  720. <span class="onoffswitch-title">Hide Navigation Icons</span>
  721. <span class="onoffswitch-title-desc">invisible navigation icons</span>
  722. </div>
  723. <div class="list" id="dan">
  724. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-disable-animation"></a>
  725. <span class="onoffswitch-title">Disable CSS Animation</span>
  726. <span class="onoffswitch-title-desc">Disables CSS based animations</span>
  727. </div>
  728. <div class="list" id="mhic">
  729. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-hide-info-card"></a>
  730. <span class="onoffswitch-title">Hide Info Card</span>
  731. <span class="onoffswitch-title-desc">Hides info card from left panel</span>
  732. </div>
  733. <div class="list" id="mlph">
  734. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-lean-subheader"></a>
  735. <span class="onoffswitch-title">Lean Subheader</span>
  736. <span class="onoffswitch-title-desc">distinguished page header</span>
  737. </div>
  738. <div class="list" id="mnl">
  739. <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-nav-link"></a>
  740. <span class="onoffswitch-title">Hierarchical Navigation</span>
  741. <span class="onoffswitch-title-desc">Clear breakdown of nav links</span>
  742. </div>
  743. <div class="list mt-1">
  744. <span class="onoffswitch-title">Global Font Size <small>(RESETS ON REFRESH)</small> </span>
  745. <div class="btn-group btn-group-sm btn-group-toggle my-2" data-toggle="buttons">
  746. <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-sm" data-target="html">
  747. <input type="radio" name="changeFrontSize"> SM
  748. </label>
  749. <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text" data-target="html">
  750. <input type="radio" name="changeFrontSize" checked=""> MD
  751. </label>
  752. <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-lg" data-target="html">
  753. <input type="radio" name="changeFrontSize"> LG
  754. </label>
  755. <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-xl" data-target="html">
  756. <input type="radio" name="changeFrontSize"> XL
  757. </label>
  758. </div>
  759. <span class="onoffswitch-title-desc d-block mb-0">Change <strong>root</strong> font size to effect rem
  760. values</span>
  761. </div>
  762. <hr class="mb-0 mt-4">
  763. <div class="mt-2 d-table w-100 pl-5 pr-3">
  764. <div class="fs-xs text-muted p-2 alert alert-warning mt-3 mb-2">
  765. <i class="fal fa-exclamation-triangle text-warning mr-2"></i>The settings below uses localStorage to load
  766. the external CSS file as an overlap to the base css. Due to network latency and CPU utilization, you may
  767. experience a brief flickering effect on page load which may show the intial applied theme for a split
  768. second. Setting the prefered style/theme in the header will prevent this from happening.
  769. </div>
  770. </div>
  771. <div class="mt-2 d-table w-100 pl-5 pr-3">
  772. <div class="d-table-cell align-middle">
  773. <h5 class="p-0">
  774. Theme colors
  775. </h5>
  776. </div>
  777. </div>
  778. <div class="expanded theme-colors pl-5 pr-3">
  779. <ul class="m-0">
  780. <li>
  781. <a href="#" id="myapp-0" data-action="theme-update" data-themesave data-theme="" data-toggle="tooltip" data-placement="top" title="Wisteria (base css)" data-original-title="Wisteria (base css)"></a>
  782. </li>
  783. <li>
  784. <a href="#" id="myapp-1" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-1.css" data-toggle="tooltip" data-placement="top" title="Tapestry" data-original-title="Tapestry"></a>
  785. </li>
  786. <li>
  787. <a href="#" id="myapp-2" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-2.css" data-toggle="tooltip" data-placement="top" title="Atlantis" data-original-title="Atlantis"></a>
  788. </li>
  789. <li>
  790. <a href="#" id="myapp-3" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-3.css" data-toggle="tooltip" data-placement="top" title="Indigo" data-original-title="Indigo"></a>
  791. </li>
  792. <li>
  793. <a href="#" id="myapp-4" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-4.css" data-toggle="tooltip" data-placement="top" title="Dodger Blue" data-original-title="Dodger Blue"></a>
  794. </li>
  795. <li>
  796. <a href="#" id="myapp-5" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-5.css" data-toggle="tooltip" data-placement="top" title="Tradewind" data-original-title="Tradewind"></a>
  797. </li>
  798. <li>
  799. <a href="#" id="myapp-6" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-6.css" data-toggle="tooltip" data-placement="top" title="Cranberry" data-original-title="Cranberry"></a>
  800. </li>
  801. <li>
  802. <a href="#" id="myapp-7" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-7.css" data-toggle="tooltip" data-placement="top" title="Oslo Gray" data-original-title="Oslo Gray"></a>
  803. </li>
  804. <li>
  805. <a href="#" id="myapp-8" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-8.css" data-toggle="tooltip" data-placement="top" title="Chetwode Blue" data-original-title="Chetwode Blue"></a>
  806. </li>
  807. <li>
  808. <a href="#" id="myapp-9" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-9.css" data-toggle="tooltip" data-placement="top" title="Apricot" data-original-title="Apricot"></a>
  809. </li>
  810. <li>
  811. <a href="#" id="myapp-10" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-10.css" data-toggle="tooltip" data-placement="top" title="Blue Smoke" data-original-title="Blue Smoke"></a>
  812. </li>
  813. <li>
  814. <a href="#" id="myapp-11" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-11.css" data-toggle="tooltip" data-placement="top" title="Green Smoke" data-original-title="Green Smoke"></a>
  815. </li>
  816. <li>
  817. <a href="#" id="myapp-12" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-12.css" data-toggle="tooltip" data-placement="top" title="Wild Blue Yonder" data-original-title="Wild Blue Yonder"></a>
  818. </li>
  819. <li>
  820. <a href="#" id="myapp-13" data-action="theme-update" data-themesave data-theme="css/themes/cust-theme-13.css" data-toggle="tooltip" data-placement="top" title="Emerald" data-original-title="Emerald"></a>
  821. </li>
  822. </ul>
  823. </div>
  824. <hr class="mb-0 mt-4">
  825. <div class="pl-5 pr-3 py-3 bg-faded">
  826. <div class="row no-gutters">
  827. <div class="col-6 pr-1">
  828. <a href="#" class="btn btn-outline-danger fw-500 btn-block" data-action="app-reset">Reset Settings</a>
  829. </div>
  830. <div class="col-6 pl-1">
  831. <a href="#" class="btn btn-danger fw-500 btn-block" data-action="factory-reset">Factory Reset</a>
  832. </div>
  833. </div>
  834. </div>
  835. </div> <span id="saving"></span>
  836. </div>
  837. </div>
  838. </div>
  839. </div>
  840. <!-- END Page Settings -->
  841. <!-- base vendor bundle:
  842. DOC: if you remove pace.js from core please note on Internet Explorer some CSS animations may execute before a page is fully loaded, resulting 'jump' animations
  843. + pace.js (recommended)
  844. + jquery.js (core)
  845. + jquery-ui-cust.js (core)
  846. + popper.js (core)
  847. + bootstrap.js (core)
  848. + slimscroll.js (extension)
  849. + app.navigation.js (core)
  850. + ba-throttle-debounce.js (core)
  851. + waves.js (extension)
  852. + smartpanels.js (extension)
  853. + src/../jquery-snippets.js (core) -->
  854. <!--<script src="js/../script.js"></script>
  855. <script>
  856. $(document).ready(function () {
  857. });
  858. </script>-->
  859. </body>
  860. </html>