JSFiddle - React, Tailwind, and code Playground

by Ken Z

HTML

<div class="container">
	<div class="row">
		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
			<div class="table-responsive">
				<h3 class="table-title">DATA ADMIN</h3>
				<form method="post">
					<table class="table">
						<thead>
							<tr class="active">
								<th><input type="checkbox" id="checkall"></th>
								<th>Nama</th>
								<th>Email</th>
								<th>Username</th>
								<th>Terakhir Login</th>
								<th><center>Tindakan</center></th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td><input type="checkbox" name="data[]" class="data"></td>
								<td>Some Name</td>
								<td>Some Email</td>
								<td>Some Username</td>
								<td>Sat, 20 Jan 2013 - 10:30</td>
								<td>
									<center>
										<a href="#"><button type="button" class="btn btn-primary btn-xs">Ubah</button></a> <a href="#"><button type="button" class="btn btn-danger btn-xs">Hapus</button></a>
									</center>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox" name="data[]" class="data"></td>
								<td>Some Name</td>
								<td>Some Email</td>
								<td>Some Username</td>
								<td>Fri, 15 Jan 2013 - 10:30</td>
								<td>
									<center>
										<a href="#"><button type="button" class="btn btn-primary btn-xs">Ubah</button></a> <a href="#"><button type="button" class="btn btn-danger btn-xs">Hapus</button></a>
									</cemter>
								</td>
							</tr>
						</tbody>
					</table>
					<input type="submit" name="submit" class="btn btn-primary btn-sm" value="Tambah Admin">
					<input type="submit" name="hapus" class="btn btn-danger btn-sm" value="Hapus Yang Dicentangi">
				</form>
			</div>
		</div>
	</div>
</div>

CSS

body {
		padding-top: 70px;
		padding-bottom: 70px;
		background: url(../assets/images/admin/background.png);
	}
	input[type="checkbox"] {
		cursor: pointer;
	}
	.table-responsive {
		padding: 0px 15px 15px 15px;
		background-color: #fff;
		border: solid 1px #ddd;
		border-radius: 4px 4px 4px 4px;
		box-shadow: none;
	}
	.table-title {
		color: #bbb;
	}