You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
196 lines
7.5 KiB
HTML
196 lines
7.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<link rel="stylesheet" href="css/argon-theme.css">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<div class="mt-2">
|
|
<button type="button" class="btn btn-default">Default</button>
|
|
<button type="button" class="btn btn-primary">Primary</button>
|
|
<button type="button" class="btn btn-secondary">Secondary</button>
|
|
<button type="button" class="btn btn-info">Info</button>
|
|
<button type="button" class="btn btn-success">Success</button>
|
|
<button type="button" class="btn btn-danger">Danger</button>
|
|
<button type="button" class="btn btn-warning">Warning</button>
|
|
</div>
|
|
|
|
<div class="mt-2 card-deck">
|
|
<div class="card">
|
|
<img class="card-img-top" src="https://picsum.photos/1000/600" alt="Card image cap">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Card title</h5>
|
|
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
|
|
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<img class="card-img-top" src="https://picsum.photos/1000/600" alt="Card image cap">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Card title</h5>
|
|
<p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
|
|
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<img class="card-img-top" src="https://picsum.photos/1000/600" alt="Card image cap">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Card title</h5>
|
|
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p>
|
|
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<nav aria-label="Page navigation example">
|
|
<ul class="pagination">
|
|
<li class="page-item">
|
|
<a class="page-link" href="#" aria-label="Previous">
|
|
<i class="fa fa-angle-left"></i>
|
|
<span class="sr-only">Previous</span>
|
|
</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="#" aria-label="Next">
|
|
<i class="fa fa-angle-right"></i>
|
|
<span class="sr-only">Next</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<form>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<input type="text" placeholder="Regular" class="form-control" disabled />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<div class="input-group mb-4">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text"><i class="ni ni-zoom-split-in"></i></span>
|
|
</div>
|
|
<input class="form-control" placeholder="Search" type="text">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<div class="input-group mb-4">
|
|
<input class="form-control" placeholder="Birthday" type="text">
|
|
<div class="input-group-append">
|
|
<span class="input-group-text"><i class="ni ni-zoom-split-in"></i></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="form-group has-success">
|
|
<input type="text" placeholder="Success" class="form-control is-valid" />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-group has-danger">
|
|
<input type="email" placeholder="Error Input" class="form-control is-invalid" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th class="text-center">#</th>
|
|
<th>Name</th>
|
|
<th>Job Position</th>
|
|
<th>Since</th>
|
|
<th class="text-right">Salary</th>
|
|
<th class="text-right">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-center">1</td>
|
|
<td>Andrew Mike</td>
|
|
<td>Develop</td>
|
|
<td>2013</td>
|
|
<td class="text-right">€ 99,225</td>
|
|
<td class="td-actions text-right">
|
|
<button type="button" rel="tooltip" class="btn btn-info btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-circle-08 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-success btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-settings-gear-65 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-danger btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-fat-remove pt-1"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-center">2</td>
|
|
<td>John Doe</td>
|
|
<td>Design</td>
|
|
<td>2012</td>
|
|
<td class="text-right">€ 89,241</td>
|
|
<td class="td-actions text-right">
|
|
<button type="button" rel="tooltip" class="btn btn-info btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-circle-08 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-success btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-settings-gear-65 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-danger btn-icon btn-sm " data-original-title="" title="">
|
|
<i class="ni ni-fat-remove pt-1"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-center">3</td>
|
|
<td>Alex Mike</td>
|
|
<td>Design</td>
|
|
<td>2010</td>
|
|
<td class="text-right">€ 92,144</td>
|
|
<td class="td-actions text-right">
|
|
<button type="button" rel="tooltip" class="btn btn-info btn-icon btn-sm btn-simple" data-original-title="" title="">
|
|
<i class="ni ni-circle-08 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-success btn-icon btn-sm btn-simple" data-original-title="" title="">
|
|
<i class="ni ni-settings-gear-65 pt-1"></i>
|
|
</button>
|
|
<button type="button" rel="tooltip" class="btn btn-danger btn-icon btn-sm btn-simple" data-original-title="" title="">
|
|
<i class="ni ni-fat-remove pt-1"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
</body>
|
|
<style>
|
|
html{
|
|
font-family: ;
|
|
}
|
|
</style>
|
|
</html> |