206 lines
7.7 KiB
HTML
206 lines
7.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
<title>Title</title>
|
|
<link rel="stylesheet" href="plugins/fontawesome-free/css/all.min.css" />
|
|
<link rel="stylesheet" href="dist/css/adminlte.min.css" />
|
|
</head>
|
|
<body>
|
|
<!-- Wraps whole page -->
|
|
<div class="wrapper">
|
|
<!-- Wraps left header -->
|
|
<nav class="main-header navbar navbar-expand navbar-white navbar-light">Header to fix</nav>
|
|
<!-- Wraps left menu -->
|
|
<aside class="main-sidebar sidebar-dark-primary">
|
|
<!-- Brand Logo -->
|
|
<a href="index3.html" class="brand-link">
|
|
<img src="images/favicon.png" alt="AdminLTE Logo" class="brand-image" style="opacity: 0.8" />
|
|
<span class="brand-text font-weight-light">Koozali SME</span>
|
|
</a>
|
|
|
|
<div class="sidebar sidebar-dark-green">
|
|
<!-- Sidebar -->
|
|
<nav class="mt-2">
|
|
<ul class="nav nav-pills nav-sidebar flex-column">
|
|
<li class="nav-header">Important</li>
|
|
<li class="nav-item">
|
|
<a href="../index.html" class="nav-link">
|
|
<i class="nav-icon far fa-image"></i>
|
|
Page 1</a
|
|
>
|
|
</li>
|
|
<li class="nav-header">MISCELLANEOUS</li>
|
|
<li class="nav-item">
|
|
<a href="../index.html" class="nav-link">
|
|
<i class="nav-icon far fa-envelope"></i>
|
|
Page 2</a
|
|
>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="../index.html" class="nav-link">
|
|
<i class="nav-icon far fa-columns"></i>
|
|
Page 3</a
|
|
>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</aside>
|
|
<!-- Wraps content -->
|
|
<div class="content-wrapper">
|
|
<div class="content-header">
|
|
<h1>Main Content header</h1>
|
|
</div>
|
|
<br />
|
|
<!-- /.card-header -->
|
|
<div class="card-body">
|
|
<h3>A few sample plugins/classes to demo</h3>
|
|
<br>
|
|
<p>All the following are put in class="card-body" to get the margins</p>
|
|
<div class="login-box">
|
|
<!-- /.login-logo -->
|
|
<div class="card card-outline card-primary">
|
|
<div class="card-header text-center">
|
|
<a href="../../index2.html" class="h1"><b>Admin</b>LTE</a>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="login-box-msg">Sign in to start your session</p>
|
|
|
|
<form action="../../index3.html" method="post">
|
|
<div class="input-group mb-3">
|
|
<input type="email" class="form-control" placeholder="Email" />
|
|
<div class="input-group-append">
|
|
<div class="input-group-text">
|
|
<span class="fas fa-envelope"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="input-group mb-3">
|
|
<input type="password" class="form-control" placeholder="Password" />
|
|
<div class="input-group-append">
|
|
<div class="input-group-text">
|
|
<span class="fas fa-lock"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-8">
|
|
<div class="icheck-primary">
|
|
<input type="checkbox" id="remember" />
|
|
<label for="remember"> Remember Me </label>
|
|
</div>
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col-4">
|
|
<button type="submit" class="btn btn-primary btn-block">Sign In</button>
|
|
</div>
|
|
<!-- /.col -->
|
|
</div>
|
|
</form>
|
|
|
|
<!-- /.social-auth-links -->
|
|
|
|
<p class="mb-1">
|
|
<a href="forgot-password.html">I forgot my password</a>
|
|
</p>
|
|
<p class="mb-0">
|
|
<a href="register.html" class="text-center">Register a new membership</a>
|
|
</p>
|
|
</div>
|
|
<!-- /.card-body -->
|
|
</div>
|
|
<!-- /.card -->
|
|
</div>
|
|
<br>
|
|
<p>These buttons are meant to be in a table to size them</p>
|
|
<br />
|
|
<button type="button" class="btn btn-block btn-primary btn-lg">Primary</button>
|
|
<button type="button" class="btn btn-block btn-success">Success</button>
|
|
<br />
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-info">Left</button>
|
|
<button type="button" class="btn btn-info">Middle</button>
|
|
<button type="button" class="btn btn-info">Right</button>
|
|
</div>
|
|
|
|
<table class="table table-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 10px">#</th>
|
|
<th>Task</th>
|
|
<th>Progress</th>
|
|
<th style="width: 40px">Label</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>1.</td>
|
|
<td>Update software</td>
|
|
<td>
|
|
<div class="progress progress-xs">
|
|
<div class="progress-bar progress-bar-danger" style="width: 55%"></div>
|
|
</div>
|
|
</td>
|
|
<td><span class="badge bg-danger">55%</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td>2.</td>
|
|
<td>Clean database</td>
|
|
<td>
|
|
<div class="progress progress-xs">
|
|
<div class="progress-bar bg-warning" style="width: 70%"></div>
|
|
</div>
|
|
</td>
|
|
<td><span class="badge bg-warning">70%</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td>3.</td>
|
|
<td>Cron job running</td>
|
|
<td>
|
|
<div class="progress progress-xs progress-striped active">
|
|
<div class="progress-bar bg-primary" style="width: 30%"></div>
|
|
</div>
|
|
</td>
|
|
<td><span class="badge bg-primary">30%</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td>4.</td>
|
|
<td>Fix and squish bugs</td>
|
|
<td>
|
|
<div class="progress progress-xs progress-striped active">
|
|
<div class="progress-bar bg-success" style="width: 90%"></div>
|
|
</div>
|
|
</td>
|
|
<td><span class="badge bg-success">90%</span></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- /.card-body -->
|
|
<div class="card-footer clearfix">
|
|
<ul class="pagination pagination-sm m-0 float-right">
|
|
<li class="page-item"><a class="page-link" href="#">«</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">1</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
|
<li class="page-item"><a class="page-link" href="#">»</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- /.card -->
|
|
</div>
|
|
|
|
<!-- REQUIRED SCRIPTS -->
|
|
|
|
<!-- jQuery -->
|
|
<script src="plugins/jquery/jquery.min.js"></script>
|
|
<!-- Bootstrap 4 -->
|
|
<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
|
|
<!-- AdminLTE App -->
|
|
<script src="dist/js/adminlte.min.js"></script>
|
|
</body>
|
|
</html>
|