PageRenderTime 64ms CodeModel.GetById 32ms RepoModel.GetById 0ms app.codeStats 0ms

/backend/web/assets/f9c271b2/pages/layout/top-nav.html

https://gitlab.com/abigabaw/dptt
HTML | 290 lines | 218 code | 9 blank | 63 comment | 0 complexity | f845c1f9e2369f183ec90341e31b8b85 MD5 | raw file
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <title>AdminLTE 2 | Top Navigation</title>
  7. <!-- Tell the browser to be responsive to screen width -->
  8. <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  9. <!-- Bootstrap 3.3.6 -->
  10. <link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
  11. <!-- Font Awesome -->
  12. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  13. <!-- Ionicons -->
  14. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  15. <!-- Theme style -->
  16. <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">
  17. <!-- AdminLTE Skins. Choose a skin from the css/skins
  18. folder instead of downloading all of them to reduce the load. -->
  19. <link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css">
  20. <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  21. <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  22. <!--[if lt IE 9]>
  23. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  24. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  25. <![endif]-->
  26. </head>
  27. <!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. -->
  28. <body class="hold-transition skin-blue layout-top-nav">
  29. <div class="wrapper">
  30. <header class="main-header">
  31. <nav class="navbar navbar-static-top">
  32. <div class="container">
  33. <div class="navbar-header">
  34. <a href="../../index2.html" class="navbar-brand"><b>Admin</b>LTE</a>
  35. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
  36. <i class="fa fa-bars"></i>
  37. </button>
  38. </div>
  39. <!-- Collect the nav links, forms, and other content for toggling -->
  40. <div class="collapse navbar-collapse pull-left" id="navbar-collapse">
  41. <ul class="nav navbar-nav">
  42. <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
  43. <li><a href="#">Link</a></li>
  44. <li class="dropdown">
  45. <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
  46. <ul class="dropdown-menu" role="menu">
  47. <li><a href="#">Action</a></li>
  48. <li><a href="#">Another action</a></li>
  49. <li><a href="#">Something else here</a></li>
  50. <li class="divider"></li>
  51. <li><a href="#">Separated link</a></li>
  52. <li class="divider"></li>
  53. <li><a href="#">One more separated link</a></li>
  54. </ul>
  55. </li>
  56. </ul>
  57. <form class="navbar-form navbar-left" role="search">
  58. <div class="form-group">
  59. <input type="text" class="form-control" id="navbar-search-input" placeholder="Search">
  60. </div>
  61. </form>
  62. </div>
  63. <!-- /.navbar-collapse -->
  64. <!-- Navbar Right Menu -->
  65. <div class="navbar-custom-menu">
  66. <ul class="nav navbar-nav">
  67. <!-- Messages: style can be found in dropdown.less-->
  68. <li class="dropdown messages-menu">
  69. <!-- Menu toggle button -->
  70. <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  71. <i class="fa fa-envelope-o"></i>
  72. <span class="label label-success">4</span>
  73. </a>
  74. <ul class="dropdown-menu">
  75. <li class="header">You have 4 messages</li>
  76. <li>
  77. <!-- inner menu: contains the messages -->
  78. <ul class="menu">
  79. <li><!-- start message -->
  80. <a href="#">
  81. <div class="pull-left">
  82. <!-- User Image -->
  83. <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
  84. </div>
  85. <!-- Message title and timestamp -->
  86. <h4>
  87. Support Team
  88. <small><i class="fa fa-clock-o"></i> 5 mins</small>
  89. </h4>
  90. <!-- The message -->
  91. <p>Why not buy a new awesome theme?</p>
  92. </a>
  93. </li>
  94. <!-- end message -->
  95. </ul>
  96. <!-- /.menu -->
  97. </li>
  98. <li class="footer"><a href="#">See All Messages</a></li>
  99. </ul>
  100. </li>
  101. <!-- /.messages-menu -->
  102. <!-- Notifications Menu -->
  103. <li class="dropdown notifications-menu">
  104. <!-- Menu toggle button -->
  105. <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  106. <i class="fa fa-bell-o"></i>
  107. <span class="label label-warning">10</span>
  108. </a>
  109. <ul class="dropdown-menu">
  110. <li class="header">You have 10 notifications</li>
  111. <li>
  112. <!-- Inner Menu: contains the notifications -->
  113. <ul class="menu">
  114. <li><!-- start notification -->
  115. <a href="#">
  116. <i class="fa fa-users text-aqua"></i> 5 new members joined today
  117. </a>
  118. </li>
  119. <!-- end notification -->
  120. </ul>
  121. </li>
  122. <li class="footer"><a href="#">View all</a></li>
  123. </ul>
  124. </li>
  125. <!-- Tasks Menu -->
  126. <li class="dropdown tasks-menu">
  127. <!-- Menu Toggle Button -->
  128. <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  129. <i class="fa fa-flag-o"></i>
  130. <span class="label label-danger">9</span>
  131. </a>
  132. <ul class="dropdown-menu">
  133. <li class="header">You have 9 tasks</li>
  134. <li>
  135. <!-- Inner menu: contains the tasks -->
  136. <ul class="menu">
  137. <li><!-- Task item -->
  138. <a href="#">
  139. <!-- Task title and progress text -->
  140. <h3>
  141. Design some buttons
  142. <small class="pull-right">20%</small>
  143. </h3>
  144. <!-- The progress bar -->
  145. <div class="progress xs">
  146. <!-- Change the css width attribute to simulate progress -->
  147. <div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
  148. <span class="sr-only">20% Complete</span>
  149. </div>
  150. </div>
  151. </a>
  152. </li>
  153. <!-- end task item -->
  154. </ul>
  155. </li>
  156. <li class="footer">
  157. <a href="#">View all tasks</a>
  158. </li>
  159. </ul>
  160. </li>
  161. <!-- User Account Menu -->
  162. <li class="dropdown user user-menu">
  163. <!-- Menu Toggle Button -->
  164. <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  165. <!-- The user image in the navbar-->
  166. <img src="../../dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
  167. <!-- hidden-xs hides the username on small devices so only the image appears. -->
  168. <span class="hidden-xs">Alexander Pierce</span>
  169. </a>
  170. <ul class="dropdown-menu">
  171. <!-- The user image in the menu -->
  172. <li class="user-header">
  173. <img src="../../dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
  174. <p>
  175. Alexander Pierce - Web Developer
  176. <small>Member since Nov. 2012</small>
  177. </p>
  178. </li>
  179. <!-- Menu Body -->
  180. <li class="user-body">
  181. <div class="row">
  182. <div class="col-xs-4 text-center">
  183. <a href="#">Followers</a>
  184. </div>
  185. <div class="col-xs-4 text-center">
  186. <a href="#">Sales</a>
  187. </div>
  188. <div class="col-xs-4 text-center">
  189. <a href="#">Friends</a>
  190. </div>
  191. </div>
  192. <!-- /.row -->
  193. </li>
  194. <!-- Menu Footer-->
  195. <li class="user-footer">
  196. <div class="pull-left">
  197. <a href="#" class="btn btn-default btn-flat">Profile</a>
  198. </div>
  199. <div class="pull-right">
  200. <a href="#" class="btn btn-default btn-flat">Sign out</a>
  201. </div>
  202. </li>
  203. </ul>
  204. </li>
  205. </ul>
  206. </div>
  207. <!-- /.navbar-custom-menu -->
  208. </div>
  209. <!-- /.container-fluid -->
  210. </nav>
  211. </header>
  212. <!-- Full Width Column -->
  213. <div class="content-wrapper">
  214. <div class="container">
  215. <!-- Content Header (Page header) -->
  216. <section class="content-header">
  217. <h1>
  218. Top Navigation
  219. <small>Example 2.0</small>
  220. </h1>
  221. <ol class="breadcrumb">
  222. <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
  223. <li><a href="#">Layout</a></li>
  224. <li class="active">Top Navigation</li>
  225. </ol>
  226. </section>
  227. <!-- Main content -->
  228. <section class="content">
  229. <div class="callout callout-info">
  230. <h4>Tip!</h4>
  231. <p>Add the layout-top-nav class to the body tag to get this layout. This feature can also be used with a
  232. sidebar! So use this class if you want to remove the custom dropdown menus from the navbar and use regular
  233. links instead.</p>
  234. </div>
  235. <div class="callout callout-danger">
  236. <h4>Warning!</h4>
  237. <p>The construction of this layout differs from the normal one. In other words, the HTML markup of the navbar
  238. and the content will slightly differ than that of the normal layout.</p>
  239. </div>
  240. <div class="box box-default">
  241. <div class="box-header with-border">
  242. <h3 class="box-title">Blank Box</h3>
  243. </div>
  244. <div class="box-body">
  245. The great content goes here
  246. </div>
  247. <!-- /.box-body -->
  248. </div>
  249. <!-- /.box -->
  250. </section>
  251. <!-- /.content -->
  252. </div>
  253. <!-- /.container -->
  254. </div>
  255. <!-- /.content-wrapper -->
  256. <footer class="main-footer">
  257. <div class="container">
  258. <div class="pull-right hidden-xs">
  259. <b>Version</b> 2.3.5
  260. </div>
  261. <strong>Copyright &copy; 2014-2016 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights
  262. reserved.
  263. </div>
  264. <!-- /.container -->
  265. </footer>
  266. </div>
  267. <!-- ./wrapper -->
  268. <!-- jQuery 2.2.3 -->
  269. <script src="../../plugins/jQuery/jquery-2.2.3.min.js"></script>
  270. <!-- Bootstrap 3.3.6 -->
  271. <script src="../../bootstrap/js/bootstrap.min.js"></script>
  272. <!-- SlimScroll -->
  273. <script src="../../plugins/slimScroll/jquery.slimscroll.min.js"></script>
  274. <!-- FastClick -->
  275. <script src="../../plugins/fastclick/fastclick.js"></script>
  276. <!-- AdminLTE App -->
  277. <script src="../../dist/js/app.min.js"></script>
  278. <!-- AdminLTE for demo purposes -->
  279. <script src="../../dist/js/demo.js"></script>
  280. </body>
  281. </html>