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

Last change on this file since 16459 was 16459, checked in by Henrik Bettermann, 3 years ago

Enable managers to remove all flash notices of students in a department.

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