Context navigation

source: main/waeup.kofa/trunk/layout/theme.html @ 12920

Last change on this file since 12920 was 12901, checked in by Henrik Bettermann, 10 years ago
Add link ‘Kofa Docs for this page’ at the end of the content box which refers to the corresponding section of the Kofa Documentation.
File size: 20.8 KB

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

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

Download in other formats: