Context navigation

theme.html @ 17397

Last change on this file since 17397 was 14564, checked in by Henrik Bettermann, 8 years ago
Update layout.
File size: 23.1 KB

Line
1	<!DOCTYPE html>
2	<html lang="en">
3	<head>
4	<meta charset="utf-8">
5	<title>Base · Twitter Bootstrap</title>
6	<meta name="viewport" content="width=device-width, initial-scale=1.0">
7	<meta name="description" content="">
8	<meta name="author" content="">
9
10	<!-- stylesheets -->
11	<link href="static/bootstrap/css/bootstrap.min.css"
12	rel="stylesheet">
13	<link href="static/bootstrap/css/bootstrap-theme.min.css"
14	rel="stylesheet">
15	<link href="static/css/jquery.dataTables.css"
16	rel="stylesheet">
17	<link href="static/css/jquery-ui.css"
18	rel="stylesheet">
19	<link href="static/css/base.css" rel="stylesheet">
20	<link href="static/css/custom.css" rel="stylesheet">
21	<link href="static/css/file-upload.css" rel="stylesheet">
22
23	<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
24	<!--[if lt IE 9]>
25	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
26	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
27	<link href="static/css/IE8.css" rel="stylesheet">
28	<![endif]-->
29
30	<script src="static/js/kofa-functions.js"></script>
31
32	<!-- icons -->
33	<link rel="shortcut icon" href="static/ico/favicon.ico">
34
35
36	</head>
37
38	<body id="kofa-body">
39
40	<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
41	<div class="navbar-header">
42	<button type="button" class="navbar-toggle" data-toggle="collapse"
43	data-target="#kofa-primary-nav">
44	<span class="icon-bar"></span>
45	<span class="icon-bar"></span>
46	<span class="icon-bar"></span>
47	</button>
48	<a class="navbar-brand active kofa-brand-link" href="/">WAeUP.Kofa</a>
49	</div>
50	<div class="navbar-collapse collapse"
51	id="kofa-primary-nav">
52	<ul class="nav navbar-nav kofa-navbar-left">
53	<li class="active"><a href="#">Academics</a></li>
54	<li><a href="#about">Applicants</a></li>
55	<li><a href="#contact">Students</a></li>
56	<li><a href="#contact">Hostels</a></li>
57	<li class="dropdown">
58	<a href="#" class="dropdown-toggle"
59	data-toggle="dropdown">My Data
60	<b class="caret"></b>
61	<ul class="dropdown-menu">
62	<li><a href="#">Base Data</a></li>
63	<li><a href="#">Clearance Data</a></li>
64	<li><a href="#">Personal Data</a></li>
65	<li><a href="#">History</a></li>
66	</ul>
67	</li>
68	</ul>
69
70	<ul class="nav navbar-nav navbar-right kofa-navbar-right">
71	<li class="dropdown kofa-langselect">
72	<a href="#" class="dropdown-toggle"
73	data-toggle="dropdown">
74	<img src="static/img/earth.png" />
75	<ul class="dropdown-menu">
76	<li class="kofa-language"><a href="#">English</a></li>
77	<li class="kofa-language"><a href="#">Français</a></li>
78	<li class="kofa-language"><a href="#">Deutsch</a></li>
79	<li class="kofa-language"><a href="#">Hausa</a></li>
80	<li class="kofa-language"><a href="#">Yoruba</a></li>
81	<li class="kofa-language"><a href="#">Igbo</a></li>
82	</ul>
83	</li>
84	<li><a href="#">Contact</a></li>
85	<li><a href="#">Logout</a></li>
86	</ul>
87	</div><!--/.nav-collapse -->
88	</div><!-- /.navbar -->
89
90	<div class="container">
91
92	<div class="row">
93	<div class="col-md-12 container kofa-maintenance">
94	<div class="well">
95	<div class="maintenance-warning">
96	M A I N T E N A N C E     M O D E
97	</div> <!-- /maintenance-warning -->
98	</div> <!-- /well -->
99	</div> <!-- /kofa-maintenance -->
100	</div>
101
102	<div class="row">
103	<div class="col-md-12 container kofa-breadcrumbs-box-long">
104	<div class="well">
105	<ol class="breadcrumb kofa-breadcrumbs">
106	<li>
107	<a href="#">
108	Home
109	</a>
110	</li>
111	<li>
112	<a href="#">
113	Subtopic 1
114	</a>
115	</li>
116	<li>
117	<a href="#">
118	Subtopic 2
119	</a>
120	</li>
121	<li>
122	<a href="#">
123	Subtopic 3
124	</a>
125	</li>
126	</ol><!-- /kofa-breadcrumbs -->
127	</div> <!-- /well -->
128	</div> <!-- /kofa-breadcrumbs-box-long -->
129	</div>
130
131	<div class="row">
132	<div class="col-md-8 container kofa-breadcrumbs-box-short">
133	<div class="well">
134	<ol class="breadcrumb kofa-breadcrumbs">
135	<li>
136	<a href="#">
137	Home
138	</a>
139	</li>
140	<li>
141	<a href="#">
142	Subtopic 1
143	</a>
144	</li>
145	<li>
146	<a href="#">
147	Subtopic 2
148	</a>
149	</li>
150	<li>
151	<a href="#">
152	Subtopic 3
153	</a>
154	</li>
155	</ol><!-- /kofa-breadcrumbs -->
156	</div> <!-- /well -->
157	</div> <!-- /kofa-breadcrumbs-box-short -->
158
159	<div class="col-md-4 container kofa-student-status-box">
160	<div class="well">
161	<div class="wfstatus">
162	K1000000 • quite long student status
163	</div> <!-- /wfstatus -->
164	</div> <!-- /well -->
165	</div> <!-- /kofa-student-status-box -->
166
167	</div> <!-- /row -->
168
169	<div class="row">
170	<div class="col-md-2 kofa-sidebar">
171	<div class="sidebar-nav well">
172	<div>
173	<div class="kofa-sidebar-title">Student Name</div>
174	<ul class="nav">
175	<li><a href="#">Base Data</a></li>
176	<li><a href="#">Clearance Data</a></li>
177	<li><a href="#">Personal Data</a></li>
178	<li><a href="#">Study Course</a></li>
179	<li><a href="#">Payments</a></li>
180	<li><a href="#">Accommodation</a></li>
181	<li><a href="#">History</a></li>
182	</ul>
183	</div>
184	<div>
185	<div class="kofa-sidebar-title">Manager Name</div>
186	<ul class="nav">
187	<li><a href="#">Portal Configuration</a></li>
188	<li><a href="#">Portal Users</a></li>
189	<li><a href="#">Data Center</a></li>
190	<li><a href="#">Reports</a></li>
191	<li><a href="#">Access Codes</a></li>
192	<li><a href="#">My Preferences</a></li>
193	<li><a href="#">My Roles</a></li>
194	</ul>
195	</div>
196	</div> <!-- /well -->
197	</div> <!-- /kofa-sidebar -->
198
199	<div class="col-md-10 content kofa-content-narrow">
200	<div class="well">
201	<div class="kofa-content">
202	<div class="actionbar">
203	<a class="btn btn-default" href="">
204	<img src="static/img/actionicon_modify.png"
205	alt="Manage" />
206	Manage
207	</a>
208	<a class="btn btn-default" href="">
209	<img src="static/img/actionicon_trigtrans.png"
210	alt="Trigger transition" />
211	Trigger transition
212	</a>
213	</div>
214	<div class="alert alert-danger">
215	There were errors ...
216	</div>
217	<div class="alert alert-warning">
218	Be careful ...
219	</div>
220	<div class="alert alert-success">
221	You have successfully ...
222	</div>
223	<h1>WAeUP.Kofa Theme</h1>
224
225	<p class="kofa-content-desc">
226	A sample Diazo theme for WAeUP.Kofa
227	<br />
228	Fusce dapibus, tellus ac cursus commodo.
229	</p>
230	<p>
231	Donec id elit non mi porta gravida at eget metus. Fusce
232	dapibus, tellus ac cursus commodo, tortor mauris
233	condimentum nibh, ut fermentum massa justo sit amet
234	risus. Etiam porta sem malesuada magna mollis
235	euismod. Donec sed odio dui.
236	</p>
237	<img src="static/img/bg.png" />
238
239	<!-- Tabs... -->
240	<br /><br />
241	<h3>Sample Tabs</h3>
242	<ul id="tabs" class="tabs nav nav-tabs" data-tabs="tabs">
243	<li class="active">
244	<a href="#tab-1" data-toggle="tab">Tab 1</a>
245	</li>
246	<li class="">
247	<a href="#tab-2" data-toggle="tab">Tab 2</a>
248	</li>
249	<li class="">
250	<a href="#tab-3" data-toggle="tab">Tab 3</a>
251	</li>
252	</ul>
253	<div class="tab-content">
254	<div id="tab-1" class="tab-pane active">
255	<br />
256	<p>
257	Tab 1 content...<br /> Donec id elit non mi porta
258	gravida at eget metus. Fusce dapibus, tellus ac
259	cursus commodo.
260	</p>
261	</div>
262	<div id="tab-2" class="tab-pane">
263	<br />
264	<p>
265	Tab 2 content...<br /> Tortor mauris condimentum
266	nibh, ut fermentum massa justo sit amet
267	risus. Etiam porta sem malesuada.
268	</p>
269	</div>
270	<div id="tab-3" class="tab-pane">
271	<br />
272	<p>
273	Tab 3 content...<br /> Magna mollis euismod. Donec
274	sed odio dui.
275	</p>
276	</div>
277
278	<br>
279
280	<h3>Sample Tooltip</h3>
281	<br>Move the mouse over the button:
282	<div class="btn btn-default" data-toggle="tooltip"
283	title="This is a tooltip">Sample Tooltip
284	</div>
285
286	<br><br>
287
288	<h3>File Upload</h3>
289	<br>
290	<a href="#">Birth Certificate Scan</a>
291	<input type="submit"
292	value="Delete file"
293	class="btn btn-danger" />
294	<div class="btn btn-default btn-file">
295	Select new file…
296	<input type="file"/>
297	</div>
298	<input type="submit"
299	value="Upload selected file"
300	class="btn btn-primary" />
301	(10 kB max.)
302	<br><br>
303
304	<div class="input-group">
305	<div class="input-group-btn">
306	<div class="btn btn-default btn-file">
307	Select new file…
308	<input type="file">
309	</div>
310	</div>
311	<input type="text" class="form-control" readonly>
312	<div class="input-group-btn">
313	<input type="submit"
314	value="Upload selected file"
315	class="btn btn-primary" />
316	(10 kB max.)
317	</div>
318	</div>
319
320	<br><br>
321
322	<h3>Filtered Select Box</h3>
323	<br>
324	<input id="filterbox" class="kofa-filterbox form-control half"
325	placeholder="Enter search text, then select item below."
326	type="text" />
327	<br />
328	<select id="filteredselect" class="form-control half" size=2>
329	<option value="1">1</option>
330	<option value="1234567890">1234567890</option>
331	<option value="better">better</option>
332	<option value="world">world</option>
333	</select>
334
335	</div><!-- /tab-content -->
336	</div> <!-- /kofa-content -->
337	</div> <!-- /well -->
338	</div> <!-- /kofa-content-narrow -->
339	</div> <!-- /row -->
340
341	<div class="row">
342	<div class="col-md-12 content kofa-content-wide">
343	<div class="well kofa-content">
344	<div class="actionbar">
345	<a class="btn btn-default" href="">
346	<img src="static/img/actionicon_modify.png"
347	alt="Manage" />
348	Manage
349	</a>
350	<a class="btn btn-default" href="">
351	<img src="static/img/actionicon_trigtrans.png"
352	alt="Trigger transition" />
353	Trigger transition
354	</a>
355	</div>
356	<div class="hero-unit">
357	<h1>Hello there!</h1>
358	<p>this is...</p>
359	</div>
360	<div>...content that spans the whole page.</div>
361
362	<br><br>
363	<h3>Accordions</h3>
364	<div class="panel-group" id="accordion" role="tablist"
365	aria-multiselectable="true">
366	<div class="panel panel-default">
367	<div class="panel-heading" role="tab" id="headingTwo">
368	<h4 class="panel-title">
369	<a class="collapsed" data-toggle="collapse"
370	data-parent="#accordion" href="#collapseTwo"
371	aria-expanded="false" aria-controls="collapseTwo">
372	Collapsible Group
373	</a>
374	</h4>
375	</div>
376	<div id="collapseTwo" class="panel-collapse collapse"
377	role="tabpanel" aria-labelledby="headingTwo">
378	<div class="panel-body">
379	Anim pariatur cliche reprehenderit, enim eiusmod high life
380	terry richardson ad squid. 3 wolf moon officia aute, non
381	skateboard dolor brunch. Food truck quinoa laborum eiusmod.
382	</div>
383	</div>
384	</div>
385	</div>
386
387	<br><br>
388	<h3>A Sample Data Table</h3>
389	<div class="table-responsive">
390	<table id="#datatable" class="table table-striped dataTable">
391	<thead>
392	<tr>
393	<th>Id</th>
394	<th>Name</th>
395	<th>Portal Roles</th>
396	<th>Local Roles</th>
397	<th></th>
398	</tr>
399	</thead><tbody><tr><td>admin</td>
400	<td>John</td>
401	<td nowrap="nowrap">Portal Manager <br />
402	Academics Officer (view only)
403	</td>
404	<td>Owner</td>
405	<td class="text-right">
406	<form method="post">
407	<input type="hidden" name="userid" value="admin" />
408	<input class="btn btn-primary btn-sm" type="submit"
409	name="manage" value="Manage" />
410	<input class="btn btn-default btn-sm" type="submit"
411	name="delete" value="Remove" />
412	</form>
413	</td>
414	</tr>
415	<tr>
416	<td>tester</td>
417	<td>Vitali</td>
418	<td nowrap="nowrap">Academics Officer (view only)</td>
419	<td>Owner</td>
420	<td class="text-right">
421	<form method="post">
422	<input type="hidden" name="userid" value="your_id" />
423	<input class="btn btn-sm btn-primary" type="submit"
424	name="manage" value="Manage" />
425	<input class="btn btn-sm btn-default" type="submit"
426	name="delete" value="Remove" />
427	</form>
428	</td>
429	</tr>
430	</tbody>
431	</table>
432	</div>
433
434	<br><br>
435	<h3>A Sample Inline Form</h3>
436	<form method="POST" class="form-inline">
437	<br />
438	<div class="form-group">
439	<input class="btn btn-primary" type="submit" name="search"
440	value="Find student(s)" />
441	</div>
442	<div class="form-group">
443	<select name="searchtype" class="form-control">
444	<option value="student_id">with id</option>
445	<option value="fullname">with name</option>
446	<option value="reg_number">with registration number</option>
447	<option value="matric_number">with matric number</option>
448	<option value="current_session">in session</option>
449	<option value="depcode">in department</option>
450	<option value="current_mode">in study mode</option>
451	<option value="suspended">
452	with deactivated account (search term omitted)
453	</option>
454	<option value="transcript">
455	who requested transcript (search term omitted)
456	</option>
457	</select>
458	</div>
459	<div class="form-group">
460	<input type="text" class="form-control" name="searchterm" />
461	</div>
462	</form>
463
464	<br><br>
465	<h3>A Sample Display Form Table</h3>
466	<table class="form-table">
467	<tbody>
468	<tr>
469	<td class="fieldname">Code:</td>
470	<td>app2012</td>
471	</tr>
472	<tr>
473	<td class="fieldname">Application Target:</td>
474	<td>General Studies</td>
475	</tr>
476	<tr>
477	<td class="fieldname">
478	Application Mode (Donec id elit non mi porta gravida.):
479	</td>
480	<td>Create Application Records</td>
481	</tr>
482	</tbody>
483	</table>
484
485	<br><br>
486	<h3>A Sample Edit/Manage Form Table</h3>
487	<table class="form-table">
488	<tbody>
489	<tr>
490	<td class="fieldname">Code:</td>
491	<td>app2012</td>
492	</tr>
493	<tr>
494	<td class="fieldname">* Title:</td>
495	<td>
496	<input class="textType" id="form.title" name="form.title"
497	size="20" type="text"
498	value="General Studies 2012/2013" />
499	</td>
500	</tr>
501	<tr>
502	<td class="fieldname">Any phone number:</td>
503	<td>
504	<select id="form.phone.country" name="form.phone.country"
505	size="1" class="phone-input">
506	<option value="+234">Nigeria (+234)</option>
507	<option value="+49">Germany (+49)</option>
508	<option value="+1">U.S. (+1)</option>
509	</select>-
510	<input class=" phone-input textType" id="form.phone.area"
511	name="form.phone.area" size="20" type="text"
512	value="" />-
513	<input class=" phone-input textType" id="form.phone.ext"
514	name="form.phone.ext" size="20" type="text" value="" />
515	</td>
516	</tr>
517	<tr>
518	<td class="fieldname">Any text field:</td>
519	<td>
520	<textarea id="any_id"
521	name="any_name" rows="5">Placeholder text</textarea>
522	</td>
523	</tr>
524	<tr>
525	<td class="fieldname">*
526	Application Mode
527	(A select field coming from zope.formlib):
528	</td>
529	<td>
530	<div class="value">
531	<select id="form.mode" name="form.mode" size="1">
532	<option selected="selected" value="create">
533	Create Application Records
534	</option>
535	<option value="update">Update Application Records
536	</option>
537	</select>
538	</div>
539	<input name="form.mode-empty-marker"
540	type="hidden" value="1" />
541	</td>
542	</tr>
543	<tr>
544	<td class="fieldname">A datepicker field:</td>
545	<td>
546	<input class="datepicker-le-year textType"
547	id="form.any_date" name="form.any_date"
548	size="20" type="text" value="" />
549	</td>
550	</tr>
551
552	<tr>
553	<td class="fieldname">
554	A select field in Kofa pagetemplates:
555	</td>
556	<td>
557	<select id="any_id" name="any_name" size="1"
558	class="form-control half">
559	<option selected="selected" value="create">
560	Create Application Records
561	</option>
562	<option value="update">
563	Update Application Records
564	</option>
565	</select>
566	</td>
567	</tr>
568	</tbody>
569	</table>
570	<br>
571	<div class="documentation">
572	<a href="#" target="_blank">
573	Kofa Docs for this page
574	</a>
575	</div>
576	</div> <!-- /well kofa-content-->
577	</div> <!-- /kofa-content-wide -->
578	</div> <!-- /row -->
579	<div id="bottom" class="footer">
580	<p class="credit muted text-right">
581	Kofa - Student Management System<br />
582	Copyright © WAeUP Group
583	<script type="text/javascript">
584	renderCurrentYear();
585	</script>
586	</p>
587	</div>
588	</div> <!-- /container -->
589
590	<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
591	<script src="static/bootstrap/js/bootstrap.min.js"></script>
592	<script src="static/js/kofa-scroll.js"></script>
593	<script src="static/js/kofa-activate-tab.js"></script>
594	<script src="static/js/kofa-scrollto.js"></script>
595	<script src="static/js/file-upload.js"></script>
596	<script class="kofa-script-tooltip"
597	src="static/js/kofa-tooltip.js">
598	</script>
599	<script class="kofa-script-datatable"
600	src="static/js/jquery.dataTables.min.js">
601	</script>
602	<script class="kofa-script-datatable"
603	src="static/js/kofa-datatables.js">
604	</script>
605	<script class="jquery-ui"
606	src="static/js/jquery-ui.min.js">
607	</script>
608	<script class="kofa-script-datepicker"
609	src="static/js/kofa-datepicker.js">
610	</script>
611	<script class="kofa-filterByText"
612	src="static/js/kofa-filterByText.js">
613	</script>
614	</body>
615	</html>

Note: See TracBrowser for help on using the repository browser.

Context navigation

source: main/kofacustom.sampleuni/trunk/layout/theme.html @ 17397

Download in other formats: