Foundation - Fungsi Sass

Foundation menyediakan satu set fungsi utilitas SASS, yang dapat digunakan dengan util , color , selector , unit , value , dan banyak lagi.

Anda dapat mengimpor semua file utilitas sekaligus dengan menggunakan baris kode berikut -

@import 'util/util';

Anda juga dapat mengimpor file utilitas individu seperti yang ditunjukkan di bawah ini -

@import 'util/color';
@import 'util/selector';
@import 'util/unit';
@import 'util/value';

Referensi Sass

Anda dapat mengubah gaya komponen dengan menggunakan fungsi SASS berikut.

latar depan

Ini memberikan warna latar depan ke elemen berdasarkan warna latar belakang. Ini menggunakan format berikut untuk menetapkan berbagai jenis parameter -

foreground($color, $yes, $no, $threshold)

Parameter di atas ditentukan dalam tabel berikut -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$color Ini memeriksa kecerahan warna.	Warna	Tidak ada
2	$yes Jika warnanya terang, maka itu mengembalikan warna $ yes .	Warna	$ hitam
3	$no Jika warnanya gelap, maka mengembalikan $ no color.	Warna	$ putih
4	$threshold Ini mewakili ambang batas ringan.	Persentase	60%

skala pintar

Ini memberikan warna yang sesuai untuk elemen sesuai dengan kecerahannya. Ini menggunakan format berikut untuk menentukan warna yang sesuai -

smart-scale($color, $scale, $threshold)

Parameter yang diberikan di atas ditentukan dalam tabel berikut -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$color Ini digunakan untuk mengatur skala warna.	Warna	Tidak ada
2	$scale Ini menentukan persentase untuk naik atau turun.	Persentase	5%
3	$threshold Ini mewakili ambang batas ringan.	Persentase	40%

masukan teks

Ini membuat pemilih saat menggunakan jenis input teks. Ini menggunakan format berikut untuk menentukan jenis input -

text-inputs($types)

Ini menggunakan parameter seperti yang ditentukan dalam tabel berikut -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$types Ini menyediakan sejumlah jenis input teks untuk menghasilkan selektor.	Warna	-

strip-unit

Ini menghapus unit dari nilai dan hanya mengembalikan angkanya. Ini menggunakan format berikut untuk menghapus unit dari nilai -

strip-unit($num)

Ini menggunakan parameter seperti yang ditentukan dalam tabel berikut -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$num Ini menentukan nomor saat Anda menghapus unit dari nilainya.	Warna	Tidak ada

rem-calc

Ini mengubah nilai piksel agar sesuai dengan nilai rem. Ini menggunakan format berikut untuk mengubah nilai piksel menjadi nilai rem -

rem-calc($values, $base)

Ini menggunakan parameter berikut seperti yang ditentukan dalam tabel -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$values Ini mengubah nilai piksel menjadi nilai rem dan memisahkannya menggunakan spasi. Jika Anda mengonversi daftar yang dipisahkan koma, maka bungkus daftar dalam tanda kurung.	Nomor atau Daftar	Tidak ada
2	$base Ini memberikan nilai dasar saat mengubah piksel menjadi nilai rem. Jika ada nilai nol untuk basis, maka fungsi menggunakan variabel $ base-font-size sebagai basis.	Jumlah	batal

memiliki nilai

Ini menentukan nilai jika tidak salah. Nilai palsu termasuk null, none, 0 atau daftar kosong. Ini menggunakan format berikut untuk menentukan nilai -

has-value($val)

Ini menggunakan parameter seperti yang ditentukan dalam tabel berikut -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$val Ini memeriksa nilai yang ditentukan.	Campuran	Tidak ada

get-side

Ini menentukan sisi nilai dan mendefinisikan nilai atas / kanan / bawah / kiri pada padding, margin dll. Ini menggunakan format berikut untuk menentukan sisi nilai -

has-value($val)

Ini menggunakan parameter berikut seperti yang ditentukan dalam tabel -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$val Ini menentukan sisi nilai.	Daftar atau Nomor	Tidak ada
2	$side Ini menentukan di sisi mana nilai (atas / kanan / bawah / kiri) harus dikembalikan.	Kata kunci	Tidak ada

get-border-value

Ini menentukan nilai perbatasan suatu elemen. Ini menggunakan format berikut untuk menentukan nilai perbatasan -

get-border-value($val, $elem)

Ini menggunakan parameter berikut seperti yang ditentukan dalam tabel -

Sr.No.	Parameter & Deskripsi	Tipe	Nilai Default
1	$val Ia menemukan nilai tertentu dari perbatasan.	Daftar	Tidak ada
2	$elem Ini digunakan untuk mengekstrak komponen perbatasan.	Kata kunci	Tidak ada