From c7a4605299cb3115f2cfd458ae2d230a1263072f Mon Sep 17 00:00:00 2001 From: blitzkrieg Date: Wed, 24 Apr 2024 10:02:35 +0700 Subject: [PATCH] i18n(id) Update components.mdx --- .../src/content/docs/id/guides/components.mdx | 215 +++++++++++++++++- 1 file changed, 204 insertions(+), 11 deletions(-) diff --git a/docs/src/content/docs/id/guides/components.mdx b/docs/src/content/docs/id/guides/components.mdx index 5efaa87d47e..508ece3ec1a 100644 --- a/docs/src/content/docs/id/guides/components.mdx +++ b/docs/src/content/docs/id/guides/components.mdx @@ -3,8 +3,8 @@ title: Komponen description: Menggunakan komponen dalam MDX dengan Starlight. --- -Komponen memungkinkan Anda dengan mudah menggunakan kembali bagian UI atau _style_ secara konsisten. -Contohnya mungkin kartu tautan atau _YouTube embed_. +Komponen memudahkan Anda menggunakan kembali bagian UI atau _styling_ secara konsisten. +Contohnya bisa kartu tautan atau penyematan YouTube. Starlight mendukung penggunaan komponen dalam file [MDX](https://mdxjs.com/) dan menyediakan beberapa komponen umum yang dapat Anda gunakan. [Pelajari lebih lanjut tentang membuat komponen di Astro Docs](https://docs.astro.build/en/core-concepts/astro-components/). @@ -12,7 +12,7 @@ Starlight mendukung penggunaan komponen dalam file [MDX](https://mdxjs.com/) dan ## Menggunakan Komponen Anda dapat menggunakan komponen dengan mengimpornya ke dalam file MDX Anda dan kemudian merendernya sebagai tag JSX. -Tag-tag ini mirip dengan tag HTML tetapi dimulai dengan huruf kapital yang sesuai dengan nama dalam pernyataan `import` Anda: +Ini mirip dengan tag HTML tetapi dimulai dengan huruf kapital yang sesuai dengan nama dalam pernyataan `import` Anda: ```mdx --- @@ -35,8 +35,8 @@ Pelajari lebih lanjut tentang menggunakan [komponen dalam MDX](https://docs.astr ### Kompatibilitas dengan style Starlight -Starlight menerapkan _style_ default pada konten Markdown Anda, misalnya menambahkan margin antara elemen-elemen. -Jika _style_ ini tidak sesuai dengan tampilan komponen Anda, atur kelas `not-content` pada komponen untuk menonaktifkannya. +Starlight menerapkan _style_ bawaan pada konten Markdown Anda, misalnya menambahkan margin diantara elemen-elemen. +Jika _style_ ini bertentangan dengan tampilan komponen Anda, atur kelas `not-content` pada komponen untuk menonaktifkannya. ```astro --- @@ -51,14 +51,15 @@ Jika _style_ ini tidak sesuai dengan tampilan komponen Anda, atur kelas `not-con ## Komponen Bawaan Starlight menyediakan beberapa komponen bawaan yang umum digunakan untuk keperluan dokumentasi. -Komponen ini tersedia di _package_ `@astrojs/starlight/components`. +Komponen ini tersedia di paket `@astrojs/starlight/components`. ### Tabs import { Tabs, TabItem } from '@astrojs/starlight/components'; -Anda dapat menampilkan _interface_ berbasis tab menggunakan komponen `` dan ``. +Anda dapat menampilkan antarmuka berbasis tab menggunakan komponen `` dan ``. Setiap `` harus memiliki `label` untuk ditampilkan kepada pengguna. +Gunakan atribut opsional `icon` untuk mengikutsertakan salah satu [ikon bawaan Starlight ](#semua-icon) disamping label. ```mdx import { Tabs, TabItem } from '@astrojs/starlight/components'; @@ -69,7 +70,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'; ``` -Kode di atas akan menampilkan tab seperti berikut pada halaman: +Kode di atas akan menampilkan tab-tab berikut pada halaman: Sirius, Vega, Betelgeuse @@ -81,9 +82,9 @@ Kode di atas akan menampilkan tab seperti berikut pada halaman: import { Card, CardGrid } from '@astrojs/starlight/components'; Anda dapat menampilkan konten di dalam kotak yang sesuai dengan _style_ Starlight menggunakan komponen ``. -Bungkus beberapa _card_ dalam komponen `` untuk menampilkan _card-card_ secara berdampingan ketika ada cukup ruang. +Bungkus beberapa _card_ dalam komponen `` untuk menampilkan _card_ secara berdampingan ketika ada cukup ruang. -`` memerlukan `title` dan secara opsional dapat ditambahkan atribut `icon` yang di-set dengan [nama salah satu icon bawaan Starlight](#semua-icon). +`` memerlukan `title` dan secara opsional dapat menyertakan atribut `icon` yang disesuaikan dengan nama [salah satu ikon bawaan Starlight](#semua-icon). ```mdx import { Card, CardGrid } from '@astrojs/starlight/components'; @@ -114,7 +115,7 @@ Kode di atas akan menampilkan hasil sebagai berikut: :::tip -Gunakan _card_ grid di halaman utama untuk menampilkan fitur-fitur utama proyek Anda. +Gunakan _card_ grid di beranda untuk menampilkan fitur-fitur utama proyek Anda. Tambahkan atribut `stagger` untuk menggeser kolom kedua _card_ secara vertikal dan menambah daya tarik visual: ```astro @@ -163,6 +164,198 @@ import { LinkCard } from '@astrojs/starlight/components'; +### Aside + +_Aside_ (dikenal juga sebagai “_admonition_” or “_callout_”) berguna untuk menampilkan informasi sekunder di samping konten utama halaman. + +`