Style

Dalam boilerplate ini menggunakan Laravel Mix untuk mengelola dan mengompilasi file SCSS (Sass). SCSS memungkinkan Anda untuk menulis CSS yang lebih terstruktur dan mudah dikelola.

{info} Sebelum menambahkan custome style anda dapat mengecek dahulu apakah bentuk yang anda inginkan sudah terdapat dalam Storybook atau belum.

Folder Location

Semua file SCSS harus diletakkan di file custome.scss dalam folder resources/sass_custome. Setelah dikompilasi, file CSS hasilnya akan disalin ke dalam folder public/css.

{warning} Jangan menempatkan file css langsung ke dalam folder public dan jangan memodifikasi script css di public.

Custome style

Karena boilerplate ini sudah menggunakan style bawaan kejar.id, jadi disarankan untuk menuliskan kode kustom Anda di dalam file resources/sass_custome/custome.scss . Anda dapat mengatur style custome Anda di sini tanpa mengubah file default yang terletak di folder resources/sass .

{warning} Jangan meng-edit semua file di folder resources/sass karena dalam folder itu adalah style default kejar.id.

Compiling Process

Anda tidak perlu menambahkan kode baru untuk compiling karena sudah didaftarkan di dalam file webpack.mix.js:

mix.sass(
    "resources/css/app.scss",
    "public/css"
);

jadi anda hanya tinggal jalankan saja compiling-nya

Run Compiling

Setelah memodifikasi script scss di file custome.scss dalam folder resources/sass_custome , jalankan perintah berikut untuk memproses dan mengkompilasi:

yarn watch

Perintah ini akan memantau perubahan pada file Anda dan melakukan kompilasi secara otomatis.
Jika Anda melakukan perubahan dan ingin memastikan semua aset terkompilasi kembali, Anda perlu restart yarn watch dengan menghentikannya dan menjalankannya kembali.