Mungkin masalah saya mudah, tetapi saya tidak dapat mencari penyelesaian sehingga kini. Saya menggunakan Vuetify dalam aplikasi Nuxt saya. Saya menggunakan tema gelapnya. Bergantung pada konfigurasi tema tapak web rasmi, kami boleh menukar tema utama, sekunder atau warna lain dengan warna yang kami mahu. Walau bagaimanapun, apabila kami menetapkan kepada tema gelap, teks lalai dan warna latar belakang ditetapkan kepada putih dan hitam. Saya tidak dapat mencari penyelesaian untuk mengubahnya. Saya tahu bahawa kita boleh menetapkan sebagai contoh class="utama"
untuk elemen menukar warna latar belakangnya. Tetapi saya mahu menetapkan warna lalai untuk teks atau latar belakang seperti ini:
body { warna: var(--v-info-base); } /* atau */ #aplikasi { warna: var(--v-info-base); }
Warna tapak web saya ditakrifkan dalam fail nuxt.config.js saya, seperti ini:
vuetify: { Pembolehubah tersuai: ['~/assets/variables.scss'], tema: { gelap: benar, pilihan: { CustomProperties: true }, tema: { gelap: { utama: { asas: "#099b63", gelapkan1: "#04c279" }, loghat: "#250032", menengah: "#97812F", maklumat: { asas: "#1FFFF1", gelapkan1: "#450b5a", gelapkan2: "#1125c0", gelapkan3: "#40bfa4" }, amaran: colors.amber.base, ralat: colors.deepOrange.accent4, kejayaan: colors.green.accent3, sauh: "#1FFFF1" } }, } },
Tetapi itu tidak berkesan untuk saya! ! !
Untuk mencapai ini, anda perlu mengatasi pembolehubah sass vuetify,Terdapat contoh penggunaan dalam dokumentasi
Sebagai contoh, dalam
variables.scss
anda, anda boleh menggunakan kod berikut:Ini akan mengatasi latar belakang lalai dan warna teks dalam mod gelap.