<?php
// Koneksi ke database
$conn = new mysqli("https://lsp-nusantara.com", "u9088926_lsp", "@LSP1234;", "u9088926_sertifikasi_online");
// Periksa koneksi
if ($conn->connect_error) {
die("Koneksi gagal: " . $conn->connect_error);
}
// Query untuk mengambil data
$sql = "SELECT * FROM asesor";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Profile Cards</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f9f9f9;
margin: 0;
padding: 0;
}
.container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 20px;
padding: 20px;
}
.card {
background-color: #ffffff;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 20px;
text-align: center;
transition: box-shadow 0.3s ease;
}
.card:hover {
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.card .image {
width: 80px;
height: 80px;
border-radius: 50%;
margin: 0 auto 10px;
overflow: hidden;
}
.card .image img {
width: 100%;
height: auto;
}
.card h3 {
font-size: 1.2rem;
margin: 10px 0;
color: #333;
}
.card .role {
font-size: 0.9rem;
color: #666;
margin-bottom: 10px;
}
.card p {
font-size: 0.8rem;
color: #777;
}
.card.teal {
background-color: #008080;
color: #fff;
}
</style>
</head>
<body>
<div class="container">
<?php
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo '<div class="card">';
echo '<div class="image"><img src="#" alt="Profile Image"></div>';
echo '<h3>' . $row['nama_asesor'] . '</h3>';
echo '<div class="role">' . $row['noreg'] . '</div>';
echo '<p></p>';
echo '</div>';
}
} else {
echo "<p>Tidak ada data ditemukan.</p>";
}
?>
</div>
</body>
</html>