dirumahrafif · December 6, 2025 10:25 · NyiRoroKidul · Aug 10, 2025 · afifudin23 · Nov 10, 2025
diff --git a/index.blade.php b/index.blade.php
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Data Buku</title>
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome untuk ikon -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        .action-buttons {
            white-space: nowrap;
        }
        .action-buttons a {
            color:#000;
            text-decoration:none;
        }

        .table-responsive {
            margin-top: 20px;
        }
        h1 {
            color: #333;
            margin-bottom: 30px;
        }
    </style>
 </head>
 <body>
    <div class="container mt-5">
        <h1 class="text-center">Daftar Buku</h1>

        <!-- Tabel Data Buku -->
        <div class="table-responsive">
            <table class="table table-striped table-hover">
                <thead class="table-dark">
                    <tr>
                        <th>No</th>
                        <th>Judul Buku</th>
                        <th>Pengarang</th>
                        <th>Tahun Terbit</th>
                        <th>Aksi</th>
                    </tr>
                </thead>
                <tbody>
                    <!-- Data Buku 1 -->
                    <tr>
                        <td>1</td>
                        <td>Pemrograman JavaScript Modern</td>
                        <td>Joko Santoso</td>
                        <td>2022</td>
                        <td class="action-buttons">
                            <button class="btn btn-sm btn-warning">
                                <i class="fas fa-edit"></i> Edit
                            </button>
                            <button class="btn btn-sm btn-danger">
                                <i class="fas fa-trash-alt"></i> Hapus
                            </button>
                        </td>
                    </tr>

                    <!-- Data Buku 2 -->
                    <tr>
                        <td>2</td>
                        <td>Belajar Laravel untuk Pemula</td>
                        <td>Budi Santoso</td>
                        <td>2021</td>
                        <td class="action-buttons">
                            <button class="btn btn-sm btn-warning">
                                <i class="fas fa-edit"></i> Edit
                            </button>
                            <button class="btn btn-sm btn-danger">
                                <i class="fas fa-trash-alt"></i> Hapus
                            </button>
                        </td>
                    </tr>

                </tbody>
            </table>
        </div>

        <!-- Form Tambah Data (opsional) -->
        <div class="mt-4 p-3 bg-light rounded">
            <h3>Tambah Buku Baru</h3>
            <form action="" method="post">
                <div class="mb-3">
                    <label for="judul" class="form-label">Judul Buku</label>
                    <input type="text" class="form-control" id="judul" name="judul" required>
                </div>
                <div class="mb-3">
                    <label for="pengarang" class="form-label">Pengarang</label>
                    <input type="text" class="form-control" id="pengarang" name="pengarang" required>
                </div>
                <div class="mb-3">
                    <label for="tahun_terbit" class="form-label">Tahun Terbit</label>
                    <input type="number" class="form-control" id="tahun_terbit" name="tahun_terbit" min="1900" max="2099" required>
                </div>
                <button type="submit" class="btn btn-primary">Simpan</button>
            </form>
        </div>
    </div>

    <!-- Bootstrap JS Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
 </body>
 </html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Data Buku</title>
	<!-- Bootstrap CSS -->
	<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
	<!-- Font Awesome untuk ikon -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
	<style>
	.action-buttons {
	white-space: nowrap;
	}
	.action-buttons a {
	color:#000;
	text-decoration:none;
	}

	.table-responsive {
	margin-top: 20px;
	}
	h1 {
	color: #333;
	margin-bottom: 30px;
	}
	</style>
	</head>
	<body>
	<div class="container mt-5">
	<h1 class="text-center">Daftar Buku</h1>

	<!-- Tabel Data Buku -->
	<div class="table-responsive">
	<table class="table table-striped table-hover">
	<thead class="table-dark">
	<tr>
	<th>No</th>
	<th>Judul Buku</th>
	<th>Pengarang</th>
	<th>Tahun Terbit</th>
	<th>Aksi</th>
	</tr>
	</thead>
	<tbody>
	<!-- Data Buku 1 -->
	<tr>
	<td>1</td>
	<td>Pemrograman JavaScript Modern</td>
	<td>Joko Santoso</td>
	<td>2022</td>
	<td class="action-buttons">
	<button class="btn btn-sm btn-warning">
	<i class="fas fa-edit"></i> Edit
	</button>
	<button class="btn btn-sm btn-danger">
	<i class="fas fa-trash-alt"></i> Hapus
	</button>
	</td>
	</tr>

	<!-- Data Buku 2 -->
	<tr>
	<td>2</td>
	<td>Belajar Laravel untuk Pemula</td>
	<td>Budi Santoso</td>
	<td>2021</td>
	<td class="action-buttons">
	<button class="btn btn-sm btn-warning">
	<i class="fas fa-edit"></i> Edit
	</button>
	<button class="btn btn-sm btn-danger">
	<i class="fas fa-trash-alt"></i> Hapus
	</button>
	</td>
	</tr>

	</tbody>
	</table>
	</div>

	<!-- Form Tambah Data (opsional) -->
	<div class="mt-4 p-3 bg-light rounded">
	<h3>Tambah Buku Baru</h3>
	<form action="" method="post">
	<div class="mb-3">
	<label for="judul" class="form-label">Judul Buku</label>
	<input type="text" class="form-control" id="judul" name="judul" required>
	</div>
	<div class="mb-3">
	<label for="pengarang" class="form-label">Pengarang</label>
	<input type="text" class="form-control" id="pengarang" name="pengarang" required>
	</div>
	<div class="mb-3">
	<label for="tahun_terbit" class="form-label">Tahun Terbit</label>
	<input type="number" class="form-control" id="tahun_terbit" name="tahun_terbit" min="1900" max="2099" required>
	</div>
	<button type="submit" class="btn btn-primary">Simpan</button>
	</form>
	</div>
	</div>

	<!-- Bootstrap JS Bundle with Popper -->
	<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
	</body>
	</html>
No results found