design
Catatan teknis seputar web development, DevOps, dan integrasi AI.
3 artikel
- 15.25frontend
Panel Konteks Berhenti Jadi Kartu: Border Jadi Divider
Panel konteks kanan workspace AI dilepas dari bingkai kartu: satu border kiri sebagai divider, mengikuti bahasa desain sidebar.
TL;DR: Panel konteks di kanan chat workspace berubah dari kartu melayang jadi panel yang nempel rata ke tepi viewport. Diff-nya cuma satu baris class, tapi perannya bergeser dari bingkai empat sisi jadi divider vertikal di sisi kiri. Pelajarannya: elemen yang nempel ke tepi layar nggak butuh bingkai, cukup satu garis pemisah ke sisa layout.
#css#tailwind#frontend - 03.11frontend
Navbar Light Mode Saya Pakai bg-white/60, Bukan Token
Mencerahkan token background menggeser seluruh halaman. Navbar butuh rasa putih khas chrome, jadi warna literal plus dark variant.
TL;DR: Navbar transparan terlihat kotor di light mode karena memakai token --background yang dibagi dengan seluruh halaman. Solusinya: warna literal bg-white untuk light mode, sedangkan dark mode tetap pakai token lewat variant dark:. Trade-off-nya navbar tak lagi ikut tema bila token diubah, tapi jalur migrasi ke token khusus tinggal satu baris.
#css#tailwind#design - 03.06frontend
Saklar Mode Chat Saya Pindah ke Puncak Sidebar
Chip pemilih mode di dasar sidebar tidak kelihatan sebelum menggulung. Dipindah ke puncak, atribut type dan aria-pressed tetap terpasang.
TL;DR: Saklar mode pencarian dan mode tentang-saya tadinya tersembunyi di dasar sidebar, jadi pengguna baru menyadarinya setelah menggulung riwayat obrolan. Commit ini memindahkannya ke puncak sidebar dengan logika sederhana: kontrol yang menentukan mode harus terlihat sebelum keputusan diambil. Form input kini menyusut jadi tanggung jawabnya saja, sementara atribut aksesibilitas seperti type dan aria-pressed tetap dipertahankan.
#react#accessibility#tailwind