⌘ Anatomy
Fungsi dan Cara Penggunaannya
*
Komponen ini berfungsi Menampilkan pesan penting atau peringatan kepada pengguna dengan jelas.
**
Muncul saat ada peringatan, seperti "Perubahan berhasil disimpan" atau "Gagal menyimpan data".
Penjelasan Component Variant
1
Merupakan judul dari alert yang berfungsi untuk memberi tahu pengguna tentang jenis atau tujuan utama dari pesan alert ini.
2
Ini adalah bagian teks tambahan yang berfungsi untuk memberikan informasi lebih lengkap dan mendetail tentang alert tersebut.
3
Sebuah ikon yang digunakan untuk menandai jenis alert atau status tertentu, biasanya berfungsi sebagai tanda visual agar pengguna lebih cepat mengenali pesan alert.
4
Sebuah ikon berbentuk "X" yang memungkinkan pengguna untuk menutup atau menghilangkan alert dari tampilan layar.
↔ Spacing
Alert
Width
Fixed
585px
Height
Hug
92px
Direction
Horizontal
Align Children
Center Left
Alert
Width
Fill
581px
Height
Hug
92px
Fill variable
Surface/Surface - Primary
Stroke variable
Border/Border - Primary
Direction
Horizontal
Align Children
Top Left
Padding
Spacing/8PX
Gap
Spacing/8PX
Padding
Border - Radius/None
Border - Radius/6PX
Border - Radius/6PX
Border - Radius/None
Tittle + Body
Width
Fill
505px
Height
Hug
76px
Direction
Vertical
Align Children
Top Left
Gap
Spacing/4PX