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