novy/aplikasi-ketertiban
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix tumpang tindih icon & placeholder di input pencarian

Browse Source 
- Kelas kustom (.input/.btn-primary/.btn-outline/.card) dibungkus
  @layer components — sebelumnya unlayered sehingga menang atas utility
  Tailwind (pl-9 dll), membuat icon search menimpa placeholder
- Sekarang utility (layer utilities) bisa menimpa komponen sesuai urutan
  layer CSS (base < components < utilities)
This commit is contained in:
Novy San87
2026-08-03 18:39:58 +07:00
parent 57d618a1ad
commit 3170d7deb4
1 changed files with 20 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/app.css
+5
View File
@@ -35,6 +35,10 @@ html { scroll-behavior: smooth; }
background-clip: content-box; background-clip: content-box;
} }
/* Komponen kustom — dibungkus @layer components agar utility Tailwind
(mis. pl-9, px-2) tetap bisa menimpa saat dibutuhkan (urutan layer:
base < components < utilities). */
@layer components {
/* Kartu standar premium — dipakai konsisten di semua halaman */ /* Kartu standar premium — dipakai konsisten di semua halaman */
.card { .card {
@apply bg-white rounded-2xl border border-slate-200/80 shadow-sm; @apply bg-white rounded-2xl border border-slate-200/80 shadow-sm;
@@ -54,6 +58,7 @@ html { scroll-behavior: smooth; }
.input { .input {
@apply w-full px-3.5 py-2.5 border border-slate-200 rounded-xl text-sm bg-slate-50/50 focus:bg-white focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition; @apply w-full px-3.5 py-2.5 border border-slate-200 rounded-xl text-sm bg-slate-50/50 focus:bg-white focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition;
} }
}
/* Print styles */ /* Print styles */
@media print { @media print {