source: main/kofacustom.skeleton/trunk/layout/theme.html @ 17792

Last change on this file since 17792 was 17005, checked in by Henrik Bettermann, 2 years ago

Add social media meta data.

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