Skip to content

Instantly share code, notes, and snippets.

@dirumahrafif

dirumahrafif/data-personil.html

Last active October 5, 2023 04:03
Show Gist options
  • Save dirumahrafif/1f466ca36d90d822410bd112948db703 to your computer and use it in GitHub Desktop.
Save dirumahrafif/1f466ca36d90d822410bd112948db703 to your computer and use it in GitHub Desktop.
Download ZIP
Form Data Personil
Raw
data-personil.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Data Pegawai</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
</head>
<body class="bg-secondary">
<div class="container">
<!-- START FORM -->
<div class="my-3 p-3 bg-body rounded shadow-sm">
<form>
<div class="mb-3 row">
<label for="nama" class="col-sm-2 col-form-label">Nama</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
</div>
<div class="mb-3 row">
<label for="email" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control">
</div>
</div>
<div class="mb-3 row">
<label for="alamat" class="col-sm-2 col-form-label">Alamat</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
</div>
<div class="mb-3 row">
<label class="col-sm-2 col-form-label"></label>
<div class="col-sm-10"><button type="button" class="btn btn-primary" name="submit">SIMPAN</button>
</div>
</div>
</form>
</div>
<!-- AKHIR FORM -->
<!-- START DATA -->
<h1>Data Pegawai</h1>
<div class="my-3 p-3 bg-body rounded shadow-sm">
<table class="table table-striped">
<thead>
<tr>
<th class="col-md-1">No</th>
<th class="col-md-4">Nama</th>
<th class="col-md-3">Email</th>
<th class="col-md-2">Alamat</th>
<th class="col-md-2">Aksi</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Muhammad</td>
<td>muhammad@gmail.com</td>
<td>Yogyakarta</td>
<td>
<a href="" class="btn btn-warning btn-sm">Edit</a>
<a href="" class="btn btn-danger btn-sm">Del</a>
</td>
</tr>
</tbody>
</table>
</div>
<!-- AKHIR DATA -->
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous">
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment