17. April 2017

Membuat Variasi Button Menggunakan SASS

Variasi Button Menggunakan SASS
Contoh Variasi Button dalam Bootstrap (source : https://i.stack.imgur.com/TdX9B.jpg)

Membuat Button dengan SASS - Button merupakan salah satu kompoenen web yang sering digunakan karena fungsinya yang menunjukkan sebuah aksi yang bisa dieksekusi setelah di klik. Button diluar sana terdapat banyak sekali variasinya tergantung dari faktor kebutuhan, estetika, maupun kesenangan pengguna maupun pengembang web.

more

08. April 2017

Membuat CSS Grid Sederhana dengan SASS

Membuat CSS Grid Sederhana dengan SASS
Gambaran grid layout pada sebuah halaman web

Membuat CSS Grid - CSS Grid merupakan layout kumpulan class CSS yang digunakan untuk mengatur layout sebuah halaman website. Pada framework-framework CSS populer di luar sana, hampir semuanya mengakomodir kebutuhan CSS Grid dengan pendekatannya masing-masing.

CSS Grid biasanya membagi layout ke dalam konsep row dan column. Dimana row akan berfungsi seperti tr pada table HTML, sedangkan column akan berfungsi layaknya td pada table HTML.

more

06. April 2017

Styling checkbox menggunakan SASS

Styling checkbox menggunakan SASS

Membuat Checkbox dengan SASS - Bila pada tulisan sebelumnya disini kita sudah bahas mengenai sedikit eksperimen kita dalam memberikan Style pada komponen input radio, maka kali ini kita akan coba ber-eksperimen lagi dengan komponen lainnya dan saya memilih komponen input dengan type checbox atau kita sebut saja sebagai checkbox. 

Bosan ? semestinya sih kalau lagi dalam tahap belajar tidak boleh bosan ya, karena learning by doing masih jadi cara yang paling baik buat belajar koding. Jadi ya, sabar ya dan silahkan disimak langkah-langkahnya sebagai berikut :

Pertama, kita akan siapkan seperti biasa HTML dasar yang nantinya akan kita beri style. Sederhana saja cuma definisikan input dengan type=”checkbox”_, kita buat saja 3 varian seperti sebelumnya dengan 1 kita buat sebagai input yang _disable atau tidak dapat dipilih oleh pengguna. Berikut kurang lebih kode HTML yang kita buat :

more