Initial import of AbelBirdNest Stock
This commit is contained in:
@ -0,0 +1,384 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="id"><head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
"colors": {
|
||||
"surface-variant": "#e1e3e3",
|
||||
"tertiary-container": "#7c4824",
|
||||
"surface-container-high": "#e6e8e9",
|
||||
"on-tertiary-fixed-variant": "#6b3a17",
|
||||
"primary": "#00454c",
|
||||
"secondary-container": "#cfe2f9",
|
||||
"error": "#ba1a1a",
|
||||
"outline": "#6f797a",
|
||||
"secondary-fixed": "#d1e4fb",
|
||||
"tertiary": "#60320f",
|
||||
"inverse-on-surface": "#eff1f1",
|
||||
"surface-bright": "#f8fafa",
|
||||
"on-secondary": "#ffffff",
|
||||
"on-primary-fixed": "#001f23",
|
||||
"on-primary-container": "#92d5df",
|
||||
"on-surface-variant": "#3f484a",
|
||||
"on-surface": "#191c1d",
|
||||
"tertiary-fixed-dim": "#feb78a",
|
||||
"surface-container-highest": "#e1e3e3",
|
||||
"primary-fixed": "#aaeef8",
|
||||
"surface-dim": "#d8dadb",
|
||||
"on-primary-fixed-variant": "#004f57",
|
||||
"on-tertiary-fixed": "#311300",
|
||||
"surface-container": "#eceeee",
|
||||
"primary-fixed-dim": "#8ed1db",
|
||||
"inverse-primary": "#8ed1db",
|
||||
"on-error-container": "#93000a",
|
||||
"secondary": "#4e6073",
|
||||
"on-secondary-fixed": "#091d2e",
|
||||
"error-container": "#ffdad6",
|
||||
"on-secondary-fixed-variant": "#36485b",
|
||||
"outline-variant": "#bfc8ca",
|
||||
"on-background": "#191c1d",
|
||||
"inverse-surface": "#2e3131",
|
||||
"on-error": "#ffffff",
|
||||
"on-tertiary-container": "#ffbb91",
|
||||
"secondary-fixed-dim": "#b5c8df",
|
||||
"primary-container": "#0d5e67",
|
||||
"background": "#f8fafa",
|
||||
"tertiary-fixed": "#ffdbc7",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"on-tertiary": "#ffffff",
|
||||
"on-primary": "#ffffff",
|
||||
"surface-tint": "#1d6871",
|
||||
"surface-container-low": "#f2f4f4",
|
||||
"surface": "#f8fafa",
|
||||
"on-secondary-container": "#526478"
|
||||
},
|
||||
"borderRadius": {
|
||||
"DEFAULT": "0.125rem",
|
||||
"lg": "0.25rem",
|
||||
"xl": "0.5rem",
|
||||
"full": "0.75rem"
|
||||
},
|
||||
"spacing": {
|
||||
"gutter": "16px",
|
||||
"container-margin": "24px",
|
||||
"row-height-sm": "32px",
|
||||
"row-height-md": "48px",
|
||||
"compact-padding": "8px"
|
||||
},
|
||||
"fontFamily": {
|
||||
"display-lot": ["Inter"],
|
||||
"body-base": ["Inter"],
|
||||
"label-caps": ["Inter"],
|
||||
"h2": ["Inter"],
|
||||
"h1": ["Inter"],
|
||||
"body-sm": ["Inter"],
|
||||
"table-data": ["Inter"]
|
||||
},
|
||||
"fontSize": {
|
||||
"display-lot": ["24px", {"lineHeight": "32px", "letterSpacing": "-0.02em", "fontWeight": "700"}],
|
||||
"body-base": ["14px", {"lineHeight": "20px", "fontWeight": "400"}],
|
||||
"label-caps": ["11px", {"lineHeight": "16px", "letterSpacing": "0.05em", "fontWeight": "700"}],
|
||||
"h2": ["16px", {"lineHeight": "24px", "fontWeight": "600"}],
|
||||
"h1": ["20px", {"lineHeight": "28px", "fontWeight": "600"}],
|
||||
"body-sm": ["13px", {"lineHeight": "18px", "fontWeight": "400"}],
|
||||
"table-data": ["13px", {"lineHeight": "16px", "fontWeight": "500"}]
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.material-symbols-outlined {
|
||||
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
||||
}
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
background-color: #f8fafa;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-background text-on-background antialiased">
|
||||
<!-- Top Navigation Bar -->
|
||||
<header class="bg-white dark:bg-slate-900 border-b border-slate-200 dark:border-slate-800 font-['Inter'] antialiased tracking-tight docked full-width top-0 sticky flex justify-between items-center h-14 px-6 w-full z-40">
|
||||
<div class="flex items-center gap-4">
|
||||
<img alt="Logo" class="h-8 w-8 object-contain" data-alt="Professional corporate logo for an inventory management system featuring minimalist bird nest motifs in teal tones" src="https://lh3.googleusercontent.com/aida-public/AB6AXuA4AQFm_dFDl5o3ZjKCU72_sVBsL3QLyV1cVzRRa-iUzg3dnZR2Ze5CgutK7IwYg4MiV-N1F_gmTlHItV0yKYXdIkNfYtZIKW9yLxuCfbRO__bE_5wH02gmR3_vdiX3FG4x0nWKw5FM84CeJE_N4Xm-jMWQ8vsEms83YraTfCx8AK_aPXER_5u6SBaZaCssDRfV8g6ik_6cu_A1w8ItjmJ0TOqk2mzaurKPjwipWsYJxhmnReeOQLnXaYDkq5u1Op3qJ3ijTYgsEw"/>
|
||||
<span class="text-lg font-bold text-teal-800 dark:text-teal-300">Sarang Inventory Pro</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex items-center gap-2 px-3 py-1.5 bg-slate-100 rounded-lg">
|
||||
<span class="material-symbols-outlined text-slate-500 text-sm">search</span>
|
||||
<input class="bg-transparent border-none focus:ring-0 text-sm w-48" placeholder="Cari lot..." type="text"/>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<button class="p-2 hover:bg-slate-50 transition-colors rounded-full">
|
||||
<span class="material-symbols-outlined text-slate-500">notifications</span>
|
||||
</button>
|
||||
<button class="p-2 hover:bg-slate-50 transition-colors rounded-full">
|
||||
<span class="material-symbols-outlined text-slate-500">settings</span>
|
||||
</button>
|
||||
<div class="h-8 w-8 rounded-full bg-primary flex items-center justify-center text-white font-bold text-xs">
|
||||
M
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="flex min-h-[calc(100vh-3.5rem)]">
|
||||
<!-- Side Navigation Bar -->
|
||||
<aside class="bg-slate-50 dark:bg-slate-950 border-r border-slate-200 dark:border-slate-800 w-64 flex flex-col py-4 space-y-1 shrink-0">
|
||||
<div class="px-6 mb-6">
|
||||
<h2 class="text-teal-800 dark:text-teal-100 font-black tracking-tighter text-lg">SarangWMS</h2>
|
||||
<p class="text-slate-500 text-xs font-medium uppercase tracking-widest">Operational Hub</p>
|
||||
</div>
|
||||
<nav class="flex-1 px-3 space-y-1">
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 transition-all rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">dashboard</span> Dashboard
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 transition-all rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">database</span> Master Data
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 transition-all rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">inventory_2</span> Inventory Logs
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 bg-teal-50 text-teal-800 border-r-4 border-teal-600 transition-all font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">edit_note</span> Stock Adjust
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 transition-all rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">swap_horiz</span> Transfers
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 transition-all rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">verified</span> QC Reports
|
||||
</a>
|
||||
</nav>
|
||||
<div class="px-3 pt-4 border-t border-slate-200 space-y-1">
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">support_agent</span> Support
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 hover:bg-slate-100 rounded-lg font-['Inter'] text-sm font-medium" href="#">
|
||||
<span class="material-symbols-outlined">logout</span> Logout
|
||||
</a>
|
||||
</div>
|
||||
</aside>
|
||||
<!-- Main Content -->
|
||||
<main class="flex-1 p-container-margin max-w-5xl mx-auto w-full">
|
||||
<div class="flex items-center justify-between mb-8">
|
||||
<div>
|
||||
<h1 class="font-h1 text-h1 text-on-surface">Penyesuaian Stok (Adjustment)</h1>
|
||||
<p class="font-body-sm text-body-sm text-on-surface-variant mt-1">Lakukan pembaruan kuantitas lot untuk keperluan audit atau koreksi operasional.</p>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 px-3 py-1 bg-surface-container-high rounded text-on-surface-variant">
|
||||
<span class="material-symbols-outlined text-sm">schedule</span>
|
||||
<span class="font-label-caps text-label-caps">TERAKHIR DIUPDATE: 12 OKT 2023 14:20</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||
<!-- Form Section -->
|
||||
<div class="lg:col-span-2 space-y-6">
|
||||
<!-- Step 1: Lot Selection -->
|
||||
<section class="bg-surface-container-lowest border border-outline-variant p-6 rounded-lg shadow-sm">
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<div class="bg-primary text-on-primary w-6 h-6 rounded-full flex items-center justify-center text-[10px] font-bold">1</div>
|
||||
<h2 class="font-h2 text-h2 text-on-surface">Pilih Lot</h2>
|
||||
</div>
|
||||
<div class="relative group">
|
||||
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
||||
<span class="material-symbols-outlined text-outline text-lg">qr_code_scanner</span>
|
||||
</div>
|
||||
<input class="block w-full pl-10 pr-3 py-compact-padding bg-surface-container-low border border-outline rounded-lg focus:ring-2 focus:ring-primary focus:border-primary transition-all font-body-base text-body-base" placeholder="Scan QR Code atau Ketik Nomor Lot (e.g. SN-B102-X)" type="text"/>
|
||||
<button class="absolute inset-y-0 right-0 px-4 text-primary font-bold text-xs uppercase tracking-wider hover:bg-primary-fixed-dim rounded-r-lg transition-colors">Cari</button>
|
||||
</div>
|
||||
<!-- Current Lot Info (Visible after selection) -->
|
||||
<div class="mt-6 p-4 bg-surface-container-low rounded border border-outline-variant grid grid-cols-3 gap-4">
|
||||
<div>
|
||||
<span class="font-label-caps text-label-caps text-on-surface-variant block mb-1">GRADE</span>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="w-2 h-2 rounded-full bg-secondary"></span>
|
||||
<span class="font-table-data text-table-data text-on-surface">AAA Super White</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<span class="font-label-caps text-label-caps text-on-surface-variant block mb-1">QTY SAAT INI</span>
|
||||
<span class="font-display-lot text-h1 text-primary">45.20 <span class="text-xs font-normal text-on-surface-variant">kg</span></span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="font-label-caps text-label-caps text-on-surface-variant block mb-1">LOKASI</span>
|
||||
<div class="flex items-center gap-1 text-on-surface">
|
||||
<span class="material-symbols-outlined text-sm">location_on</span>
|
||||
<span class="font-table-data text-table-data">Rak B-04-A</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Step 2: Adjustment Details -->
|
||||
<section class="bg-surface-container-lowest border border-outline-variant p-6 rounded-lg shadow-sm">
|
||||
<div class="flex items-center gap-2 mb-6">
|
||||
<div class="bg-primary text-on-primary w-6 h-6 rounded-full flex items-center justify-center text-[10px] font-bold">2</div>
|
||||
<h2 class="font-h2 text-h2 text-on-surface">Detail Adjustment</h2>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-6">
|
||||
<div class="col-span-2 sm:col-span-1">
|
||||
<label class="font-label-caps text-label-caps text-on-surface-variant block mb-2">TIPE ADJUSTMENT</label>
|
||||
<div class="grid grid-cols-3 gap-2">
|
||||
<label class="cursor-pointer">
|
||||
<input checked="" class="peer hidden" name="adj_type" type="radio"/>
|
||||
<div class="flex flex-col items-center justify-center p-3 border border-outline-variant rounded-lg peer-checked:bg-primary-container peer-checked:border-primary-container peer-checked:text-on-primary-container transition-all">
|
||||
<span class="material-symbols-outlined mb-1">add_circle</span>
|
||||
<span class="text-[10px] font-bold uppercase">Tambah</span>
|
||||
</div>
|
||||
</label>
|
||||
<label class="cursor-pointer">
|
||||
<input class="peer hidden" name="adj_type" type="radio"/>
|
||||
<div class="flex flex-col items-center justify-center p-3 border border-outline-variant rounded-lg peer-checked:bg-error-container peer-checked:border-error-container peer-checked:text-on-error-container transition-all">
|
||||
<span class="material-symbols-outlined mb-1">do_not_disturb_on</span>
|
||||
<span class="text-[10px] font-bold uppercase">Kurang</span>
|
||||
</div>
|
||||
</label>
|
||||
<label class="cursor-pointer">
|
||||
<input class="peer hidden" name="adj_type" type="radio"/>
|
||||
<div class="flex flex-col items-center justify-center p-3 border border-outline-variant rounded-lg peer-checked:bg-secondary-container peer-checked:border-secondary-container peer-checked:text-on-secondary-container transition-all">
|
||||
<span class="material-symbols-outlined mb-1">trending_down</span>
|
||||
<span class="text-[10px] font-bold uppercase">Susut</span>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-2 sm:col-span-1">
|
||||
<label class="font-label-caps text-label-caps text-on-surface-variant block mb-2">ALASAN ADJUSTMENT</label>
|
||||
<select class="block w-full px-3 py-compact-padding bg-white border border-outline rounded focus:ring-2 focus:ring-primary focus:border-primary font-body-base text-body-base h-[48px]">
|
||||
<option>Pilih Alasan...</option>
|
||||
<option>Koreksi Data Audit</option>
|
||||
<option>Penyusutan Alami (Moisture)</option>
|
||||
<option>Kerusakan Fisik</option>
|
||||
<option>Sampling QC</option>
|
||||
<option>Lainnya</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-span-2 sm:col-span-1">
|
||||
<label class="font-label-caps text-label-caps text-on-surface-variant block mb-2">QTY ADJUSTMENT (KG)</label>
|
||||
<div class="relative">
|
||||
<input class="block w-full px-3 py-3 bg-white border border-outline rounded-lg focus:ring-2 focus:ring-primary focus:border-primary font-display-lot text-h1" placeholder="0.00" step="0.01" type="number"/>
|
||||
<div class="absolute inset-y-0 right-0 pr-4 flex items-center pointer-events-none text-outline">kg</div>
|
||||
</div>
|
||||
<p class="text-[10px] text-on-surface-variant mt-2 italic">Gunakan titik (.) untuk desimal</p>
|
||||
</div>
|
||||
<div class="col-span-2 sm:col-span-1">
|
||||
<label class="font-label-caps text-label-caps text-on-surface-variant block mb-2">PREDIKSI QTY BARU</label>
|
||||
<div class="bg-surface-container p-3 rounded-lg border border-dashed border-outline-variant flex items-center justify-between">
|
||||
<span class="text-on-surface-variant font-body-sm">Total Akhir:</span>
|
||||
<span class="font-display-lot text-h1 text-secondary">45.20 <span class="text-xs font-normal">kg</span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-2">
|
||||
<label class="font-label-caps text-label-caps text-on-surface-variant block mb-2">CATATAN AUDIT / REFERENSI</label>
|
||||
<textarea class="block w-full px-3 py-2 bg-white border border-outline rounded-lg focus:ring-2 focus:ring-primary focus:border-primary font-body-base text-body-base" placeholder="Masukkan detail tambahan atau nomor surat jalan jika ada..." rows="3"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- Summary & Info Sidebar -->
|
||||
<div class="space-y-6">
|
||||
<!-- Progress Card -->
|
||||
<div class="bg-primary text-on-primary p-6 rounded-lg shadow-md relative overflow-hidden">
|
||||
<div class="relative z-10">
|
||||
<h3 class="font-h2 text-h2 mb-4">Ringkasan Lot</h3>
|
||||
<div class="space-y-4">
|
||||
<div class="flex justify-between items-center border-b border-primary-container pb-2">
|
||||
<span class="text-[11px] opacity-70">STATUS LOT</span>
|
||||
<span class="bg-primary-container text-on-primary-container px-2 py-0.5 rounded text-[10px] font-bold uppercase">Ready to Export</span>
|
||||
</div>
|
||||
<div class="flex justify-between items-center border-b border-primary-container pb-2">
|
||||
<span class="text-[11px] opacity-70">TGL MASUK</span>
|
||||
<span class="font-table-data text-table-data text-[13px]">10 Sep 2023</span>
|
||||
</div>
|
||||
<div class="flex justify-between items-center">
|
||||
<span class="text-[11px] opacity-70">ORIGIN</span>
|
||||
<span class="font-table-data text-table-data text-[13px]">Kalimantan Barat</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="material-symbols-outlined absolute -bottom-4 -right-4 text-9xl opacity-10 rotate-12">inventory</span>
|
||||
</div>
|
||||
<!-- Helpful Guidelines -->
|
||||
<div class="bg-surface-container-high p-5 rounded-lg border border-outline-variant">
|
||||
<div class="flex items-center gap-2 mb-3 text-secondary">
|
||||
<span class="material-symbols-outlined text-lg">info</span>
|
||||
<h4 class="font-h2 text-h2 text-sm">Panduan Operasional</h4>
|
||||
</div>
|
||||
<ul class="space-y-3 font-body-sm text-body-sm text-on-surface-variant">
|
||||
<li class="flex gap-2">
|
||||
<span class="text-primary font-bold">•</span>
|
||||
<span>Pastikan timbangan telah dikalibrasi sebelum input qty baru.</span>
|
||||
</li>
|
||||
<li class="flex gap-2">
|
||||
<span class="text-primary font-bold">•</span>
|
||||
<span>Setiap adjustment di atas 5kg memerlukan approval Manager.</span>
|
||||
</li>
|
||||
<li class="flex gap-2">
|
||||
<span class="text-primary font-bold">•</span>
|
||||
<span>Alasan 'Penyusutan' akan otomatis tercatat dalam laporan Waste bulanan.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Action Area -->
|
||||
<div class="bg-white p-4 rounded-lg border border-primary border-opacity-20 shadow-sm flex flex-col gap-3">
|
||||
<button class="w-full bg-primary text-white py-3 rounded-lg font-bold text-sm hover:opacity-90 transition-opacity flex items-center justify-center gap-2">
|
||||
<span class="material-symbols-outlined text-lg">check_circle</span>
|
||||
SIMPAN PENYESUAIAN
|
||||
</button>
|
||||
<button class="w-full bg-transparent border border-outline text-on-surface-variant py-3 rounded-lg font-bold text-sm hover:bg-slate-50 transition-colors">
|
||||
BATALKAN
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Audit History Snippet -->
|
||||
<div class="mt-10">
|
||||
<div class="flex items-center justify-between mb-4 border-b border-outline-variant pb-2">
|
||||
<h3 class="font-h2 text-h2 text-on-surface">Riwayat Adjustment Terakhir</h3>
|
||||
<a class="text-primary font-bold text-[11px] uppercase hover:underline" href="#">Lihat Semua Laporan</a>
|
||||
</div>
|
||||
<div class="overflow-x-auto bg-surface-container-lowest rounded-lg border border-outline-variant">
|
||||
<table class="w-full text-left border-collapse">
|
||||
<thead>
|
||||
<tr class="bg-surface-container text-on-surface-variant uppercase text-[10px] font-bold tracking-wider">
|
||||
<th class="px-6 py-3 border-b border-outline-variant">WAKTU</th>
|
||||
<th class="px-6 py-3 border-b border-outline-variant">ID LOT</th>
|
||||
<th class="px-6 py-3 border-b border-outline-variant">TIPE</th>
|
||||
<th class="px-6 py-3 border-b border-outline-variant text-right">JUMLAH</th>
|
||||
<th class="px-6 py-3 border-b border-outline-variant">OPERATOR</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-outline-variant font-table-data text-table-data text-on-surface">
|
||||
<tr class="hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-3">12 Okt, 10:15</td>
|
||||
<td class="px-6 py-3 font-bold">SN-A902</td>
|
||||
<td class="px-6 py-3">
|
||||
<span class="bg-error-container text-on-error-container px-2 py-0.5 rounded-full text-[10px]">Penyusutan</span>
|
||||
</td>
|
||||
<td class="px-6 py-3 text-right text-error font-bold">-0.45 kg</td>
|
||||
<td class="px-6 py-3">Budi Santoso</td>
|
||||
</tr>
|
||||
<tr class="hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-3">11 Okt, 16:40</td>
|
||||
<td class="px-6 py-3 font-bold">SN-C110</td>
|
||||
<td class="px-6 py-3">
|
||||
<span class="bg-primary-container text-on-primary-container px-2 py-0.5 rounded-full text-[10px]">Penambahan</span>
|
||||
</td>
|
||||
<td class="px-6 py-3 text-right text-primary font-bold">+1.20 kg</td>
|
||||
<td class="px-6 py-3">Riana Putri</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</body></html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 300 KiB |
Reference in New Issue
Block a user