262 lines
8.3 KiB
PHP
262 lines
8.3 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="id">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Kartu Anggota {{ $member->nama }}</title>
|
|
<style>
|
|
@page {
|
|
margin: 0cm;
|
|
}
|
|
body {
|
|
font-family: sans-serif;
|
|
margin: 0;
|
|
padding: 20px;
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
/* LABEL KETERANGAN */
|
|
.keterangan-label {
|
|
width: 85.6mm;
|
|
margin: 0 auto 5px auto;
|
|
font-size: 9pt;
|
|
font-weight: bold;
|
|
color: #4b5563;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
border-left: 3px solid #0072b1;
|
|
padding-left: 6px;
|
|
}
|
|
|
|
/* UKURAN CR80 STANDAR */
|
|
.kartu-table {
|
|
width: 85.6mm;
|
|
height: 54.0mm;
|
|
max-width: 85.6mm;
|
|
max-height: 54.0mm;
|
|
table-layout: fixed;
|
|
|
|
border-radius: 3.18mm;
|
|
overflow: hidden; /* Memotong konten agar ikut melengkung */
|
|
|
|
border: 1px solid #cbd5e1;
|
|
margin: 0 auto 15mm auto;
|
|
border-collapse: collapse;
|
|
background-color: #ffffff;
|
|
page-break-inside: avoid;
|
|
}
|
|
|
|
/* TWEAK KHUSUS AGAR SUDUT ATAS DAN BAWAH IKUT BULAT SEMPURNA */
|
|
.header-card {
|
|
background-color: #0072b1;
|
|
height: 13mm;
|
|
padding: 0 4mm;
|
|
color: #ffffff;
|
|
/* Lengkungan sudut atas */
|
|
border-top-left-radius: 3.18mm;
|
|
border-top-right-radius: 3.18mm;
|
|
}
|
|
|
|
.footer-card {
|
|
background-color: #f7931e;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
font-size: 5.5pt;
|
|
height: 5.5mm;
|
|
vertical-align: middle;
|
|
/* KUNCI LENGKUNGAN SUDUT BAWAH DISINI */
|
|
border-bottom-left-radius: 3.18mm;
|
|
border-bottom-right-radius: 3.18mm;
|
|
}
|
|
|
|
/* LOGO HEADER */
|
|
.header-logo {
|
|
width: 9mm;
|
|
height: 9mm;
|
|
vertical-align: middle;
|
|
}
|
|
.header-text {
|
|
vertical-align: middle;
|
|
padding-left: 2mm;
|
|
}
|
|
.header-text h1 {
|
|
font-size: 7.5pt;
|
|
margin: 0;
|
|
font-weight: bold;
|
|
line-height: 1.1;
|
|
}
|
|
.header-text span {
|
|
font-size: 5pt;
|
|
display: block;
|
|
margin-top: 1px;
|
|
color: #f3f4f6;
|
|
}
|
|
|
|
/* CONTENT DEPAN */
|
|
.content-card-depan {
|
|
padding: 2.5mm 0mm 2.5mm 4mm;
|
|
vertical-align: top;
|
|
}
|
|
.info-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-top: 2px;
|
|
}
|
|
.info-table td {
|
|
padding: 0.8px 0;
|
|
font-size: 6.2pt;
|
|
color: #374151;
|
|
vertical-align: top;
|
|
line-height: 1.15;
|
|
}
|
|
.info-table td.label {
|
|
width: 21mm;
|
|
font-weight: bold;
|
|
}
|
|
.info-table td.colon {
|
|
width: 1.5mm;
|
|
text-align: center;
|
|
}
|
|
|
|
/* FOTO KARTU DEPAN */
|
|
.foto-td {
|
|
width: 22mm;
|
|
vertical-align: top;
|
|
text-align: right;
|
|
padding: 3mm 4mm 0 0;
|
|
}
|
|
.foto-box {
|
|
width: 16.5mm;
|
|
height: 21.5mm;
|
|
border: 1px solid #e5e7eb;
|
|
object-fit: cover;
|
|
border-radius: 1mm;
|
|
}
|
|
|
|
/* BAGIAN BELAKANG */
|
|
.content-belakang {
|
|
padding: 4mm 5mm 2mm 5mm;
|
|
vertical-align: top;
|
|
}
|
|
.content-belakang h3 {
|
|
margin: 0 0 2mm 0;
|
|
color: #0072b1;
|
|
font-size: 7.5pt;
|
|
border-bottom: 1px solid #f7931e;
|
|
padding-bottom: 2px;
|
|
text-align: center;
|
|
}
|
|
.catatan-list {
|
|
margin: 0;
|
|
padding-left: 3.5mm;
|
|
}
|
|
.catatan-list li {
|
|
font-size: 5.8pt;
|
|
color: #1f2937;
|
|
margin-bottom: 3.5px;
|
|
line-height: 1.25;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="keterangan-label">Bagian Depan</div>
|
|
<table class="kartu-table">
|
|
<tr>
|
|
<td colspan="2" class="header-card">
|
|
<table width="100%">
|
|
<tr>
|
|
<td width="35">
|
|
<img class="header-logo" src="{{ public_path('images/pustaka.jpeg') }}" alt="Logo">
|
|
</td>
|
|
<td class="header-text">
|
|
<h1>BAKORWIL III MALANG PROV JATIM</h1>
|
|
<span>KARTU TANDA ANGGOTA - PUSTAKA NAWASENA</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="content-card-depan">
|
|
<h2 style="margin: 0 0 2px 0; font-size: 8.5pt; color: #111827; font-weight: bold;">{{ $member->nama }}</h2>
|
|
<table class="info-table">
|
|
<tr>
|
|
<td class="label">ID/UID Anggota</td>
|
|
<td class="colon">:</td>
|
|
<td class="value"><strong>{{ $member->uid ?? '-' }}</strong></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">NIP/NIM</td>
|
|
<td class="colon">:</td>
|
|
<td class="value">{{ $member->nip_nim ?? '-' }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">Email</td>
|
|
<td class="colon">:</td>
|
|
<td class="value">{{ $member->email }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">Alamat</td>
|
|
<td class="colon">:</td>
|
|
<td class="value">{{ Str::limit($member->alamat, 45) }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">No. Telepon</td>
|
|
<td class="colon">:</td>
|
|
<td class="value">{{ $member->no_hp ?? '-' }}</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
|
|
<td class="foto-td">
|
|
@php
|
|
$fotoPath = $member->foto ? storage_path('app/public/foto_anggota/'.$member->foto) : public_path('images/default-user.png');
|
|
if(file_exists($fotoPath)){
|
|
$fotoData = base64_encode(file_get_contents($fotoPath));
|
|
$fotoExt = pathinfo($fotoPath, PATHINFO_EXTENSION);
|
|
$fotoSrc = "data:image/{$fotoExt};base64,{$fotoData}";
|
|
} else {
|
|
$fotoSrc = "";
|
|
}
|
|
@endphp
|
|
@if($fotoSrc)
|
|
<img class="foto-box" src="{{ $fotoSrc }}" alt="Foto">
|
|
@endif
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td colspan="2" class="footer-card">
|
|
Pustaka Nawasena • BAKORWIL III Malang
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<div class="keterangan-label">Bagian Belakang</div>
|
|
<table class="kartu-table">
|
|
<tr>
|
|
<td class="content-belakang">
|
|
<h3>SYARAT & KETENTUAN ANGGOTA</h3>
|
|
<ol class="catatan-list">
|
|
<li>Kartu ini bukti keanggotaan resmi Pustaka Nawasena BAKORWIL III Malang.</li>
|
|
<li>Kartu wajib dibawa setiap melakukan kunjungan, peminjaman, atau pengembalian buku.</li>
|
|
<li>Peminjam bertanggung jawab penuh atas keutuhan buku yang dipinjam.</li>
|
|
<li>Jika kartu hilang/rusak, segera laporkan ke petugas perpustakaan.</li>
|
|
<li>Kartu tidak dapat dipindahtangankan kepada orang lain.</li>
|
|
</ol>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="footer-card" style="height: 7mm; padding: 2px 5px; line-height: 1.1;">
|
|
<strong style="font-size: 6pt;">PUSTAKA NAWASENA • BAKORWIL III MALANG</strong><br>
|
|
<span style="font-size: 4.5pt; opacity: 0.9;">Jl. Simpang Ijen No. 2, Oro-oro Dowo, Kec. Klojen, Kota Malang, Jawa Timur 65119</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
</body>
|
|
</html>
|
|
|