Tema
Kamu dapat mengubah tampilan dan nuansa dari klien Misskey dengan menerapkan tema.
Pengaturan Tema
Pengaturan > Tema
Membuat Tema
Kode objek tema ditulis menggunakan JSON5. Tema memiliki tibe objek seperti yang ditunjukkan di bawah.
{
id: '17587283-dd92-4a2c-a22c-be0637c9e22a',
name: 'Danboard',
author: 'syuilo',
base: 'light',
props: {
accent: 'rgb(218, 141, 49)',
bg: 'rgb(218, 212, 190)',
fg: 'rgb(115, 108, 92)',
panel: 'rgb(236, 232, 220)',
renote: 'rgb(100, 152, 106)',
link: 'rgb(100, 152, 106)',
mention: '@accent',
hashtag: 'rgb(100, 152, 106)',
header: 'rgba(239, 227, 213, 0.75)',
navBg: 'rgb(216, 206, 182)',
inputBorder: 'rgba(0, 0, 0, 0.1)',
},
}
id
... ID unik tema. UUID lebih direkomendasikan.name
... Nama temaauthor
... Pembuat temadesc
... Deskripsi tema (Objek)base
... tema gelap atau terang- Gunakan
light
untuk tema terang dandark
untuk tema gelap. - Tema mewarisi tema dasar yang diatur di sini.
- Gunakan
props
... Definisi gaya tema. Dijelaskan dalam seksi berikut.
Definisi Gaya Tema
Definisikan gaya tema di dalam props
. Kunci merupakan nama dari variabel, dan nilai menentukan konten. Selanjutnya, objek props
ini mewariskan dari tema dasar. Tema dasarnya adalah _light.json5 jika base
dari tema ini adalah light
dan _dark.json5 jika dark
. Artinya, jika tidak ada kunci props
yang bernama panel
dalam tema ini, maka nilai panel
akan diatur menggunakan nilai dari tema dasar.
Sintaks Nilai
- Warna diekspresikan dengan heksadesimal
- contoh:
#00ff00
- contoh:
- Warna diekspresikan dengan format
rgb(r, g, b)
- contoh:
rgb(0, 255, 0)
- contoh:
- Warna yang memiliki nilai alfa/transparansi diekspresikan dengan format
rgb(r, g, b, a)
- contoh:
rgba(0, 255, 0, 0.5)
- contoh:
- Referensi nilai kunci lain
@{key name}
merupakan referensi ke nilai dari kuncil lain. Ganti{key name}
dengan nama dari kunci yang ingin kamu referensikan.- contoh:
@panel
- Referensi konstan (didiskusikan di bawah)
${constant name}
merupakan referensi ke konstan.is a reference to a constant. Ganti{constant name}
dengan nama dari konstan yang ingin kamu referensikan.- contoh:
$main
- Fungso (didiskusikan di bawah)
:{関数名}<{引数}<{色}
Konstan
Konstan berguna ketika kamu memiliki nilai yang tidak ingin kamu keluarkan sebagai variabel CSS namun ingin kamu gunakan sebagai nilai untuk variabel CSS yang lain. "Aku tidak ingin mengeluarkannya sebagai variabel CSS, tapi aku ingin menggunakannya sebagai nilai untuk variabel CSS".
Fungsi
WIP