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