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

Last change on this file since 11431 was 11430, checked in by Henrik Bettermann, 11 years ago

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