Lompat ke isi
CirccaHIG

Komponen / Navigasi

NavigationBar

Bar atas BizOps versi ponsel: tombol kembali dan aksi berupa lingkaran kaca 44, judul besar di bawah bar untuk halaman akar tab, atau judul kecil di tengah bar untuk layar detail seperti "PO-2026-0142".
React · BetaFigma · siapFigmaSumber

Kapan dipakai

Gunakan

  • Large untuk halaman akar tab (Tugas, Persetujuan); Inline untuk layar detail dan turunan.
  • Tombol kembali menyebut halaman sebelumnya di nama aksesibelnya — "Kembali ke PO Customer".
  • Batasi aksi kanan satu sampai dua; aksi lain masuk ke menu "Aksi lain".
  • Biarkan judul panjang terpotong "…"; nomor dokumen lengkap ada di isi halaman.

Hindari

  • Jangan menaruh tombol kembali di halaman akar tab — tidak ada halaman sebelumnya.
  • Jangan memakai NavigationBar di desktop; di sana pakai Toolbar atau PageHeader.
  • Jangan menulis "Kembali" sebagai judul atau aksi teks; tombol kembali sudah ada di kiri.

Contoh benar & salah

PO-2026-0142

GunakanLayar detail memakai judul kecil di tengah dan tombol kembali.

PO-2026-0142

HindariLayar detail memakai judul besar dan tiga aksi kanan.

Penulisan

  • Judul = nama halaman atau nomor dokumen: "Persetujuan", "PO-2026-0142".
  • Aksi teks berupa kata kerja singkat: "Selesai", "Simpan".

Komponen terkait

Esc
↑↓ pilih↵ buka12 hasil