Container

Container merupakan sebuah unsur yang digunakan untuk memuat unsur UI lain dalam ukuran optimal sesuai dengan ukuran layar yang digunakan user.

Container System

Background

container

Penggunaan Background pada antar muka:

Gunakan background untuk penempatan pada level paling rendah
Dapat menggunakan warna dari Design Tokens Color
Sudut radius dapat disesuaikan
Dapat digunakan sebagai objek yang di masking

Panel

container

Penggunaan Panel pada antar muka:

Gunakan panel sebagai pemisah antara elemen
Dapat menggunakan warna dari Design Tokens Color
Sudut radius dapat disesuaikan
Dapat digunakan sebagai objek yang di masking

Container

container

Penggunaan Container pada antar muka:

Gunakan container untuk mengelompokan konten dengan level berbeda untuk di atur oleh z-index yang menandakan urutan tumpukan dengan elemen lainnya
Dapat menggunakan warna dari Design Tokens Color
Sudut radius dapat disesuaikan
Elevation dapat disesuaikan dengan Elevation Token level 03 sampai 10
Dapat digunakan sebagai objek yang di masking
Perhatikan bahwa Elevation level 02 dikecualikan untuk digunakan hanya sebagai tombol

Sheets

container

Penggunaan Sheets pada antar muka:

Gunakan Drift Sheet sebagai komponen menu flyout dari sisi kiri atau kanan pada ukuran layar
Gunakan Sink atau Fly Sheet sebagai komponen menu flyout dari sisi atas atau bawah pada ukuran layar
Dapat menggunakan warna dari Design Tokens Color
Sudut radius dapat disesuaikan
Dapat digunakan sebagai objek yang di masking

Table Cell

container

Penggunaan Table Cell pada antar muka:

Gunakan Table Cell sebagai komponen pada kolom table
Dapat menggunakan warna dari Design Tokens Color
Dapat menggunakan warna border dari Design Token Border
Dapat merubah ketebalan Border
Dapat digunakan sebagai objek yang di masking

Components: Chat

Components: Divider