Home Explore Help
Register Sign In
youngqj
/
flatkit-html5-admin
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
flatkit-html...
/
dashboard.4.html

dashboard.4.html 22 KB
Permalink History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497 
  1. <!DOCTYPE html>
    2. 

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

  3. <head>
    4. 

  4.   <meta charset="utf-8" />
    5. 

  5.   <title>Flatkit - HTML Version | Bootstrap 4 Web App Kit with AngularJS</title>
    6. 

  6.   <meta name="description" content="Admin, Dashboard, Bootstrap, Bootstrap 4, Angular, AngularJS" />
    7. 

  7.   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui" />
    8. 

  8.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
    9. 

  9. 

  10.   <!-- for ios 7 style, multi-resolution icon of 152x152 -->
    11. 

  11.   <meta name="apple-mobile-web-app-capable" content="yes">
    12. 

  12.   <meta name="apple-mobile-web-app-status-barstyle" content="black-translucent">
    13. 

  13.   <link rel="apple-touch-icon" href="assets/images/logo.png">
    14. 

  14.   <meta name="apple-mobile-web-app-title" content="Flatkit">
    15. 

  15.   <!-- for Chrome on Android, multi-resolution icon of 196x196 -->
    16. 

  16.   <meta name="mobile-web-app-capable" content="yes">
    17. 

  17.   <link rel="shortcut icon" sizes="196x196" href="assets/images/logo.png">
    18. 

  18.   
    19. 

  19.   <!-- style -->
    20. 

  20.   <link rel="stylesheet" href="assets/animate.css/animate.min.css" type="text/css" />
    21. 

  21.   <link rel="stylesheet" href="assets/glyphicons/glyphicons.css" type="text/css" />
    22. 

  22.   <link rel="stylesheet" href="assets/font-awesome/css/font-awesome.min.css" type="text/css" />
    23. 

  23.   <link rel="stylesheet" href="assets/material-design-icons/material-design-icons.css" type="text/css" />
    24. 

  24. 

  25.   <link rel="stylesheet" href="assets/bootstrap/dist/css/bootstrap.min.css" type="text/css" />
    26. 

  26.   <!-- build:css assets/styles/app.min.css -->
    27. 

  27.   <link rel="stylesheet" href="assets/styles/app.css" type="text/css" />
    28. 

  28.   <!-- endbuild -->
    29. 

  29.   <link rel="stylesheet" href="assets/styles/font.css" type="text/css" />
    30. 

  30. </head>
    31. 

  31. <body>
    32. 

  32.   <div class="app" id="app">
    33. 

  33. 

  34. <!-- ############ LAYOUT START-->
    35. 

  35. 

  36.   <!-- content -->
    37. 

  37.   <div id="content" class="app-content box-shadow-z0" role="main">
    38. 

  38.     <div class="app-header navbar-md white box-shadow">
    39. 

  39.       <div ui-include="'../views/blocks/header.4.html'"></div>
    40. 

  40.     </div>
    41. 

  41.     <div ui-view class="app-body" id="view">
    42. 

  42. 

  43. <!-- ############ PAGE START-->
    44. 

  44. <div class="padding">
    45. 

  45. 	<div class="row">
    46. 

  46. 	    <div class="col-sm-12 push-md-3 col-md-6">
    47. 

  47. 	    	<div class="box">
    48. 

  48. 	    		<div class="box-header b-b">
    49. 

  49. 	    			<h3>What's  New</h3>
    50. 

  50. 	    		</div>
    51. 

  51. 	    		<div class="box-body">
    52. 

  52. 	    			<div class="row row-sm">
    53. 

  53. 	    				<div class="col-xs-4">
    54. 

  54. 	    					<a href>
    55. 

  55. 	    						<img src="assets/images/c6.jpg" class="w-full"></img>
    56. 

  56. 	    					</a>
    57. 

  57. 	    				</div>
    58. 

  58. 	    				<div class="col-xs-4">
    59. 

  59. 	    					<a href>
    60. 

  60. 	    						<img src="assets/images/c4.jpg" class="w-full"></img>
    61. 

  61. 	    					</a>
    62. 

  62. 	    				</div>
    63. 

  63. 	    				<div class="col-xs-4">
    64. 

  64. 	    					<a href>
    65. 

  65. 	    						<img src="assets/images/c5.jpg" class="w-full"></img>
    66. 

  66. 	    					</a>
    67. 

  67. 	    				</div>
    68. 

  68. 	    			</div>
    69. 

  69. 	    		</div>
    70. 

  70. 	    	</div>
    71. 

  71. 	    	<div class="box">
    72. 

  72. 	            <form>
    73. 

  73. 	              <textarea class="form-control no-border" rows="3" placeholder="Type something..."></textarea>
    74. 

  74. 	            </form>
    75. 

  75. 	            <div class="box-footer clearfix">
    76. 

  76. 	              <button class="btn btn-info pull-right btn-sm">Post</button>
    77. 

  77. 	              <ul class="nav nav-pills nav-sm">
    78. 

  78. 	                <li class="nav-item"><a class="nav-link" href><i class="fa fa-camera text-muted"></i></a></li>
    79. 

  79. 	                <li class="nav-item"><a class="nav-link" href><i class="fa fa-video-camera text-muted"></i></a></li>
    80. 

  80. 	              </ul>
    81. 

  81. 	            </div>
    82. 

  82. 	        </div>
    83. 

  83. 			<div class="box">
    84. 

  84. 				<div class="box-header">
    85. 

  85. 					<h3>Feeds <span class="label success">5</span></h3>
    86. 

  86. 				</div>
    87. 

  87. 				<div class="box-body">
    88. 

  88. 				  	<div class="streamline b-l m-l-md">
    89. 

  89. 		              <div class="sl-item">
    90. 

  90. 		                <div class="sl-left">
    91. 

  91. 		                  <img src="assets/images/a0.jpg" class="img-circle">
    92. 

  92. 		                </div>
    93. 

  93. 		                <div class="sl-content">
    94. 

  94. 		                  <div class="sl-date text-muted">2 minutes ago</div>
    95. 

  95. 		                  <div class="sl-author">
    96. 

  96. 		                    <a href>Peter Joo</a>
    97. 

  97. 		                  </div>
    98. 

  98. 		                  <div>
    99. 

  99. 		                    <p>Consectetur adipiscing elit. Morbi id neque quam. Aliquam sollicitudin venenatis ipsum ac feugiat. Vestibulum ullamcorper sodales nisi nec condimentum. Mauris convallis mauris at pellentesque volutpat. Phasellus at ultricies neque, quis malesuada augue. Donec eleifend</p>
    100. 

  100. 		                  </div>
    101. 

  101. 		                  <div class="sl-footer">
    102. 

  102. 		                    <a href data-toggle="collapse" data-target="#reply-1">
    103. 

  103. 		                      <i class="fa fa-fw fa-mail-reply text-muted"></i> Reply
    104. 

  104. 		                    </a>
    105. 

  105. 		                  </div>
    106. 

  106. 		                  <div class="box collapse m-a-0 b-a" id="reply-1">
    107. 

  107. 		                    <form>
    108. 

  108. 		                      <textarea class="form-control no-border" rows="3" placeholder="Type something..."></textarea>
    109. 

  109. 		                    </form>
    110. 

  110. 		                    <div class="box-footer clearfix">
    111. 

  111. 		                      <button class="btn btn-info pull-right btn-sm">Post</button>
    112. 

  112. 		                      <ul class="nav nav-pills nav-sm">
    113. 

  113. 		                        <li class="nav-item"><a class="nav-link" href><i class="fa fa-camera text-muted"></i></a></li>
    114. 

  114. 		                        <li class="nav-item"><a class="nav-link" href><i class="fa fa-video-camera text-muted"></i></a></li>
    115. 

  115. 		                      </ul>
    116. 

  116. 		                    </div>
    117. 

  117. 		                  </div>
    118. 

  118. 		                </div>
    119. 

  119. 		              </div>
    120. 

  120. 		              <div class="sl-item">
    121. 

  121. 		                <div class="sl-left">
    122. 

  122. 		                  <img src="assets/images/a2.jpg" class="img-circle">
    123. 

  123. 		                </div>
    124. 

  124. 		                <div class="sl-content">
    125. 

  125. 		                  <div class="sl-date text-muted">8:30</div>
    126. 

  126. 		                  <div class="sl-author">
    127. 

  127. 		                    <a href>Moke</a>
    128. 

  128. 		                  </div>
    129. 

  129. 		                  <div>
    130. 

  130. 		                    <p>Just followed <a href class="text-info">Jacob</a> and she followed you too.</p>
    131. 

  131. 		                    <p>
    132. 

  132. 		                      <span class="inline p-a-xs b-a dark-white">
    133. 

  133. 		                        <img src="assets/images/b2.jpg" class="img-responsive">
    134. 

  134. 		                      </span>
    135. 

  135. 		                    </p>
    136. 

  136. 		                  </div>
    137. 

  137. 		                </div>
    138. 

  138. 		              </div>
    139. 

  139. 		              <div class="sl-item">
    140. 

  140. 		                <div class="sl-left">
    141. 

  141. 		                  <img src="assets/images/a3.jpg" class="img-circle">
    142. 

  142. 		                </div>
    143. 

  143. 		                <div class="sl-content">
    144. 

  144. 		                  <div class="sl-date text-muted">Sat, 5 Mar</div>
    145. 

  145. 		                  <div class="sl-author">
    146. 

  146. 		                    <a href>Moke</a>
    147. 

  147. 		                  </div>
    148. 

  148. 		                  <blockquote>
    149. 

  149. 		                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante soe aiea ose dos soois.</p>
    150. 

  150. 		                    <small>Someone famous in <cite title="Source Title">Source Title</cite></small>
    151. 

  151. 		                  </blockquote>
    152. 

  152. 

  153. 

  154. 			              <div class="sl-item">
    155. 

  155. 			                <div class="sl-left">
    156. 

  156. 			                  <img src="assets/images/a2.jpg" class="img-circle">
    157. 

  157. 			                </div>
    158. 

  158. 			                <div class="sl-content">
    159. 

  159. 			                  <div class="sl-date text-muted">Sun, 11 Feb</div>
    160. 

  160. 			                  <p><a href class="text-info">Jessi</a> assign you a task <a href class="text-info">Mockup Design</a>.</p>
    161. 

  161. 			                </div>
    162. 

  162. 			              </div>
    163. 

  163. 			              <div class="sl-item">
    164. 

  164. 			                <div class="sl-left">
    165. 

  165. 			                  <img src="assets/images/a5.jpg" class="img-circle">
    166. 

  166. 			                </div>
    167. 

  167. 			                <div class="sl-content">
    168. 

  168. 			                  <div class="sl-date text-muted">Thu, 17 Jan</div>
    169. 

  169. 			                  <p>Follow up to close deal</p>
    170. 

  170. 			                </div>
    171. 

  171. 			              </div>
    172. 

  172. 

  173. 		                </div>
    174. 

  174. 		              </div>
    175. 

  175. 		            </div>
    176. 

  176. 		  		</div>
    177. 

  177. 			</div>
    178. 

  178. 	    </div>
    179. 

  179. 

  180. 		<div class="col-sm-6 pull-md-6 col-md-3">
    181. 

  181. 			<div class="box">
    182. 

  182. 				<div class="box-tool">
    183. 

  183. 			        <ul class="nav">
    184. 

  184. 			          <li class="nav-item inline dropdown">
    185. 

  185. 			            <a class="nav-link text-muted" data-toggle="dropdown">
    186. 

  186. 			              <i class="material-icons md-18">&#xe164;</i>
    187. 

  187. 			            </a>
    188. 

  188. 			            <div class="dropdown-menu dropdown-menu-scale pull-right dark">
    189. 

  189. 			              <a class="dropdown-item" href>Activities</a>
    190. 

  190. 			              <a class="dropdown-item" href>Feed</a>
    191. 

  191. 			              <a class="dropdown-item" href>Photo</a>
    192. 

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

  193. 			              <a class="dropdown-item">Follow</a>
    194. 

  194. 			            </div>
    195. 

  195. 			          </li>
    196. 

  196. 			        </ul>
    197. 

  197. 			    </div>
    198. 

  198. 			    <div class="p-a-md text-center">
    199. 

  199. 			    	<p><img src="assets/images/a1.jpg" class="img-circle w-xs"></p>
    200. 

  200. 			    	<a href class="text-md block">Jason Warren</a>
    201. 

  201. 			    	<p><small>London, UK</small></p>
    202. 

  202. 			    	<div>
    203. 

  203. 			    		<a href="" class="btn btn-icon btn-social rounded white btn-sm">
    204. 

  204. 							<i class="fa fa-facebook"></i>
    205. 

  205. 							<i class="fa fa-facebook indigo"></i>
    206. 

  206. 						</a>
    207. 

  207. 						<a href="" class="btn btn-icon btn-social rounded white btn-sm">
    208. 

  208. 							<i class="fa fa-twitter"></i>
    209. 

  209. 							<i class="fa fa-twitter light-blue"></i>
    210. 

  210. 						</a>
    211. 

  211. 						<a href="" class="btn btn-icon btn-social rounded white btn-sm">
    212. 

  212. 							<i class="fa fa-google-plus"></i>
    213. 

  213. 							<i class="fa fa-google-plus red"></i>
    214. 

  214. 						</a>
    215. 

  215. 			    	</div>
    216. 

  216. 			    	<div class="text-center m-t">
    217. 

  217. 			    		<a href class="btn btn-sm rounded primary w-sm m-y-xs">Follow</a>
    218. 

  218. 			    		<a href class="btn btn-sm rounded btn-outline b-primary w-sm">Invite</a>
    219. 

  219. 			    	</div>
    220. 

  220. 			    </div>
    221. 

  221. 			    <div class="row no-gutter b-t b-b">
    222. 

  222. 				  <div class="col-xs-6 b-r">
    223. 

  223. 				    <a class="p-a block text-center">
    224. 

  224. 				      <span class="block _600">3219</span>
    225. 

  225. 				      <span>Followers</span>
    226. 

  226. 				    </a>
    227. 

  227. 				  </div>
    228. 

  228. 				  <div class="col-xs-6">
    229. 

  229. 				    <a class="p-a block text-center">
    230. 

  230. 				      <span class="block _600">1458</span>
    231. 

  231. 				      <span>Following</span>
    232. 

  232. 				    </a>
    233. 

  233. 				  </div>
    234. 

  234. 				</div>
    235. 

  235. 				<div class="p-a">
    236. 

  236. 					<a href class="text-ellipsis"><i class="fa fa-link text-muted m-r-sm"></i> apack.com/subdomain</a>
    237. 

  237. 					<a href class="text-ellipsis"><i class="fa fa-globe text-muted m-r-sm"></i> yourdomain.com</a>
    238. 

  238. 				</div>
    239. 

  239. 			</div>
    240. 

  240. 			<div class="box light lt">
    241. 

  241. 	            <div class="box-body">
    242. 

  242. 	              <a href class="pull-left m-r">
    243. 

  243. 	                <img src="assets/images/a0.jpg" class="img-circle w-40">
    244. 

  244. 	              </a>
    245. 

  245. 	              <div class="clear p-a-xs">
    246. 

  246. 	                <a href>@Mike Mcalidek</a>
    247. 

  247. 	                <small class="block text-muted">2,415 followers / 225 tweets</small>
    248. 

  248. 	                <a href class="btn btn-sm btn-rounded white m-t-xs"><i class="fa fa-twitter m-t-xs"></i> Follow</a>
    249. 

  249. 	              </div>
    250. 

  250. 	            </div>
    251. 

  251. 	        </div>
    252. 

  252. 	    </div>
    253. 

  253. 

  254. 	    <div class="col-sm-6 col-md-3">
    255. 

  255. 	    	<div class="box">
    256. 

  256. 	    		<div class="box-header">
    257. 

  257. 	    			<h4>Just followed you</h4>
    258. 

  258. 	    		</div>
    259. 

  259. 				<div class="list-group no-radius no-borders">
    260. 

  260. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    261. 

  261. 		            	<span class="w-8 rounded m-r-sm success"></span>
    262. 

  262. 		                <img src="assets/images/a2.jpg" class="w-24 m-r-sm img-circle">
    263. 

  263. 		                <span>Jonathan Morina</span>
    264. 

  264. 		            </a>
    265. 

  265. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    266. 

  266. 		            	<span class="w-8 rounded m-r-sm success"></span>
    267. 

  267. 		                <img src="assets/images/a3.jpg" class="w-24 m-r-sm img-circle">
    268. 

  268. 		                <span>Mason Yarnell</span>
    269. 

  269. 		            </a>
    270. 

  270. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    271. 

  271. 		            	<span class="w-8 rounded m-r-sm warning"></span>
    272. 

  272. 		                <img src="assets/images/a4.jpg" class="w-24 m-r-sm img-circle">
    273. 

  273. 		                <span>Mike Mcalidek</span>
    274. 

  274. 		            </a>
    275. 

  275. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    276. 

  276. 		            	<span class="w-8 rounded m-r-sm danger"></span>
    277. 

  277. 		                <img src="assets/images/a5.jpg" class="w-24 m-r-sm img-circle">
    278. 

  278. 		                <span>Cris Labiso</span>
    279. 

  279. 		            </a>
    280. 

  280. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    281. 

  281. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    282. 

  282. 		                <img src="assets/images/a6.jpg" class="w-24 m-r-sm img-circle">
    283. 

  283. 		                <span>Daniel Sandvid</span>
    284. 

  284. 		            </a>
    285. 

  285. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    286. 

  286. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    287. 

  287. 		                <img src="assets/images/a7.jpg" class="w-24 m-r-sm img-circle">
    288. 

  288. 		                <span>Helder Oliveira</span>
    289. 

  289. 		            </a>
    290. 

  290. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    291. 

  291. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    292. 

  292. 		                <img src="assets/images/a8.jpg" class="w-24 m-r-sm img-circle">
    293. 

  293. 		                <span>Jeff Broderik</span>
    294. 

  294. 		            </a>
    295. 

  295. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    296. 

  296. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    297. 

  297. 		                <img src="assets/images/a9.jpg" class="w-24 m-r-sm img-circle">
    298. 

  298. 		                <span>Daniel Sandvid</span>
    299. 

  299. 		            </a>
    300. 

  300. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    301. 

  301. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    302. 

  302. 		                <img src="assets/images/a0.jpg" class="w-24 m-r-sm img-circle">
    303. 

  303. 		                <span>Helder Oliveira</span>
    304. 

  304. 		            </a>
    305. 

  305. 		            <a data-toggle="modal" data-target="#chat" data-dismiss="modal"  class="list-group-item text-ellipsis">
    306. 

  306. 		            	<span class="w-8 rounded m-r-sm dker"></span>
    307. 

  307. 		                <img src="assets/images/a2.jpg" class="w-24 m-r-sm img-circle">
    308. 

  308. 		                <span>Jeff Broderik</span>
    309. 

  309. 		            </a>
    310. 

  310. 		        </div>
    311. 

  311. 	        </div>
    312. 

  312. 	        <div class="box light lt p-a-lg text-center">
    313. 

  313. 	        	AD
    314. 

  314. 	        </div>
    315. 

  315. 	    </div>
    316. 

  316. 	</div>
    317. 

  317. </div>
    318. 

  318. 

  319. <!-- ############ PAGE END-->
    320. 

  320. 

  321.     </div>
    322. 

  322.     <div class="dark dk pos-rlt">
    323. 

  323.       <div class="p-md">
    324. 

  324.         <div ui-include="'../views/blocks/footer.1.html'"></div>
    325. 

  325.       </div>
    326. 

  326.     </div>
    327. 

  327.   </div>
    328. 

  328.   <!-- / -->
    329. 

  329. 

  330.   <!-- theme switcher -->
    331. 

  331.   <div id="switcher">
    332. 

  332.     <div class="switcher box-color dark-white text-color" id="sw-theme">
    333. 

  333.       <a href ui-toggle-class="active" target="#sw-theme" class="box-color dark-white text-color sw-btn">
    334. 

  334.         <i class="fa fa-gear"></i>
    335. 

  335.       </a>
    336. 

  336.       <div class="box-header">
    337. 

  337.         <a href="https://themeforest.net/item/flatkit-app-ui-kit/13231484?ref=flatfull" class="btn btn-xs rounded danger pull-right">BUY</a>
    338. 

  338.         <h2>Theme Switcher</h2>
    339. 

  339.       </div>
    340. 

  340.       <div class="box-divider"></div>
    341. 

  341.       <div class="box-body">
    342. 

  342.         <p class="hidden-md-down">
    343. 

  343.           <label class="md-check m-y-xs"  data-target="folded">
    344. 

  344.             <input type="checkbox">
    345. 

  345.             <i class="green"></i>
    346. 

  346.             <span class="hidden-folded">Folded Aside</span>
    347. 

  347.           </label>
    348. 

  348.           <label class="md-check m-y-xs" data-target="boxed">
    349. 

  349.             <input type="checkbox">
    350. 

  350.             <i class="green"></i>
    351. 

  351.             <span class="hidden-folded">Boxed Layout</span>
    352. 

  352.           </label>
    353. 

  353.           <label class="m-y-xs pointer" ui-fullscreen>
    354. 

  354.             <span class="fa fa-expand fa-fw m-r-xs"></span>
    355. 

  355.             <span>Fullscreen Mode</span>
    356. 

  356.           </label>
    357. 

  357.         </p>
    358. 

  358.         <p>Colors:</p>
    359. 

  359.         <p data-target="themeID">
    360. 

  360.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'primary', accent:'accent', warn:'warn'}">
    361. 

  361.             <input type="radio" name="color" value="1">
    362. 

  362.             <i class="primary"></i>
    363. 

  363.           </label>
    364. 

  364.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'accent', accent:'cyan', warn:'warn'}">
    365. 

  365.             <input type="radio" name="color" value="2">
    366. 

  366.             <i class="accent"></i>
    367. 

  367.           </label>
    368. 

  368.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'warn', accent:'light-blue', warn:'warning'}">
    369. 

  369.             <input type="radio" name="color" value="3">
    370. 

  370.             <i class="warn"></i>
    371. 

  371.           </label>
    372. 

  372.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'success', accent:'teal', warn:'lime'}">
    373. 

  373.             <input type="radio" name="color" value="4">
    374. 

  374.             <i class="success"></i>
    375. 

  375.           </label>
    376. 

  376.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'info', accent:'light-blue', warn:'success'}">
    377. 

  377.             <input type="radio" name="color" value="5">
    378. 

  378.             <i class="info"></i>
    379. 

  379.           </label>
    380. 

  380.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'blue', accent:'indigo', warn:'primary'}">
    381. 

  381.             <input type="radio" name="color" value="6">
    382. 

  382.             <i class="blue"></i>
    383. 

  383.           </label>
    384. 

  384.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'warning', accent:'grey-100', warn:'success'}">
    385. 

  385.             <input type="radio" name="color" value="7">
    386. 

  386.             <i class="warning"></i>
    387. 

  387.           </label>
    388. 

  388.           <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md" data-value="{primary:'danger', accent:'grey-100', warn:'grey-300'}">
    389. 

  389.             <input type="radio" name="color" value="8">
    390. 

  390.             <i class="danger"></i>
    391. 

  391.           </label>
    392. 

  392.         </p>
    393. 

  393.         <p>Themes:</p>
    394. 

  394.         <div data-target="bg" class="text-u-c text-center _600 clearfix">
    395. 

  395.           <label class="p-a col-xs-6 light pointer m-a-0">
    396. 

  396.             <input type="radio" name="theme" value="" hidden>
    397. 

  397.             Light
    398. 

  398.           </label>
    399. 

  399.           <label class="p-a col-xs-6 grey pointer m-a-0">
    400. 

  400.             <input type="radio" name="theme" value="grey" hidden>
    401. 

  401.             Grey
    402. 

  402.           </label>
    403. 

  403.           <label class="p-a col-xs-6 dark pointer m-a-0">
    404. 

  404.             <input type="radio" name="theme" value="dark" hidden>
    405. 

  405.             Dark
    406. 

  406.           </label>
    407. 

  407.           <label class="p-a col-xs-6 black pointer m-a-0">
    408. 

  408.             <input type="radio" name="theme" value="black" hidden>
    409. 

  409.             Black
    410. 

  410.           </label>
    411. 

  411.         </div>
    412. 

  412.       </div>
    413. 

  413.     </div>
    414. 

  414.     
    415. 

  415.     <div class="switcher box-color black lt" id="sw-demo">
    416. 

  416.       <a href ui-toggle-class="active" target="#sw-demo" class="box-color black lt text-color sw-btn">
    417. 

  417.         <i class="fa fa-list text-white"></i>
    418. 

  418.       </a>
    419. 

  419.       <div class="box-header">
    420. 

  420.         <h2>Demos</h2>
    421. 

  421.       </div>
    422. 

  422.       <div class="box-divider"></div>
    423. 

  423.       <div class="box-body">
    424. 

  424.         <div class="text-u-c text-center _600 clearfix">
    425. 

  425.           <a href="index.html"
    426. 

  426.             class="p-a col-xs-6 primary">
    427. 

  427.             <span class="text-white">Default</span>
    428. 

  428.           </a>
    429. 

  429.           <a href="dashboard.0.html"
    430. 

  430.             class="p-a col-xs-6 success">
    431. 

  431.             <span class="text-white">Zero</span>
    432. 

  432.           </a>
    433. 

  433.           <a href="dashboard.1.html"
    434. 

  434.             class="p-a col-xs-6 blue">
    435. 

  435.             <span class="text-white">One</span>
    436. 

  436.           </a>
    437. 

  437.           <a href="dashboard.2.html"
    438. 

  438.             class="p-a col-xs-6 warn">
    439. 

  439.             <span class="text-white">Two</span>
    440. 

  440.           </a>
    441. 

  441.           <a href="dashboard.3.html"
    442. 

  442.             class="p-a col-xs-6 danger">
    443. 

  443.             <span class="text-white">Three</span>
    444. 

  444.           </a>
    445. 

  445.           <a href="dashboard.4.html"
    446. 

  446.             class="p-a col-xs-6 green">
    447. 

  447.             <span class="text-white">Four</span>
    448. 

  448.           </a>
    449. 

  449.           <a href="dashboard.5.html"
    450. 

  450.             class="p-a col-xs-6 info">
    451. 

  451.             <span class="text-white">Five</span>
    452. 

  452.           </a>
    453. 

  453.           <div 
    454. 

  454.             class="p-a col-xs-6 lter">
    455. 

  455.             <span class="text">...</span>
    456. 

  456.           </div>
    457. 

  457.         </div>
    458. 

  458.       </div>
    459. 

  459.     </div>
    460. 

  460.   </div>
    461. 

  461.   <!-- / -->
    462. 

  462. 

  463. <!-- ############ LAYOUT END-->
    464. 

  464. 

  465.   </div>
    466. 

  466. <!-- build:js scripts/app.html.js -->
    467. 

  467. <!-- jQuery -->
    468. 

  468.   <script src="libs/jquery/jquery/dist/jquery.js"></script>
    469. 

  469. <!-- Bootstrap -->
    470. 

  470.   <script src="libs/jquery/tether/dist/js/tether.min.js"></script>
    471. 

  471.   <script src="libs/jquery/bootstrap/dist/js/bootstrap.js"></script>
    472. 

  472. <!-- core -->
    473. 

  473.   <script src="libs/jquery/underscore/underscore-min.js"></script>
    474. 

  474.   <script src="libs/jquery/jQuery-Storage-API/jquery.storageapi.min.js"></script>
    475. 

  475.   <script src="libs/jquery/PACE/pace.min.js"></script>
    476. 

  476. 

  477.   <script src="scripts/config.lazyload.js"></script>
    478. 

  478. 

  479.   <script src="scripts/palette.js"></script>
    480. 

  480.   <script src="scripts/ui-load.js"></script>
    481. 

  481.   <script src="scripts/ui-jp.js"></script>
    482. 

  482.   <script src="scripts/ui-include.js"></script>
    483. 

  483.   <script src="scripts/ui-device.js"></script>
    484. 

  484.   <script src="scripts/ui-form.js"></script>
    485. 

  485.   <script src="scripts/ui-nav.js"></script>
    486. 

  486.   <script src="scripts/ui-screenfull.js"></script>
    487. 

  487.   <script src="scripts/ui-scroll-to.js"></script>
    488. 

  488.   <script src="scripts/ui-toggle-class.js"></script>
    489. 

  489. 

  490.   <script src="scripts/app.js"></script>
    491. 

  491. 

  492.   <!-- ajax -->
    493. 

  493.   <script src="libs/jquery/jquery-pjax/jquery.pjax.js"></script>
    494. 

  494.   <script src="scripts/ajax.js"></script>
    495. 

  495. <!-- endbuild -->
    496. 

  496. </body>
    497. 

  497. </html>
    498.