Here's the updated code with a pre-filled signature image:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Curriculum Vitae</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<style>
body {
font-family: 'Arial', sans-serif;
margin: 20px;
}
.cv-container {
max-width: 800px;
margin: auto;
}
.profile-img {
width: 150px;
height: 150px;
border-radius: 50%;
overflow: hidden;
margin: 0 auto;
}
.profile-img img {
width: 100%;
height: auto;
}
.director-info {
text-align: center;
margin-top: 20px;
}
.signature {
margin-top: 20px;
text-align: center;
}
.signature-img {
border: 1px solid #ddd;
border-radius: 5px;
padding: 10px;
width: 100%;
min-height: 150px;
}
</style>
</head>
<body>
<div class="cv-container container my-4">
<div class="row">
<div class="col-md-4">
<div class="profile-img">
<img src="link_gambar_direktur.jpg" alt="Foto Direktur">
</div>
</div>
<div class="col-md-8">
<div class="director-info">
<h2>Direktur MISNTV</h2>
<p>Wahyu Hariyanto</p>
<p>Kertosari, Banyuwangi</p>
</div>
<div class="signature">
<p>Mengesahkan Dokumen ini</p>
<p>dan valid</p>
<p>Nomor Telepon/WhatsApp: 082334219114</p>
<label for="digital-signature">Digital Signature:</label>
<div class="signature-img">
<img src="ttd.jpg" alt="Digital Signature">
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Changes:
- Removed the signature pad script and related code.
- Added a
.signature-imgclass for styling the pre-filled signature image. - Added an
imgelement with the source set to "ttd.jpg". - Updated the CSS to style the signature image container.
This code displays a pre-filled signature image instead of a signature pad. You can further customize the styling as needed.
