الدالة ()saturate في Sass

تزيد الدالة ()saturate من تشبُّع اللون إذ يممرَّر إليها لونًا وعددًا بين ‎0% و ‎100% ثمَّ تعيد ذلك اللون بعد زيادة قيمة التشبع له بحسب القيمة الأخيرة.

البنية العامة

#saturate($color, $amount)

المعاملات

‎$color

اللون الذي ستُجرى عليه العمليَّة.

‎$amount

قيمة تمثِّل مقدار زيادة التشبُّع، وتتراوح بين ‎0% و ‎100%.

القيم المعادة

يُعاد اللون ‎$color بعد زيادة قيمة مكوِّن التشبُّع له بمقدار ‎$amount.

الأخطاء والاستثناءات

سيُرمى الخطأ ArgumentError إن كان أحد المعاملات من النوع الخطأ، أو إن كانت قيمة المعامل ‎$amount خارج المجال المسموح.

أمثلة

المثال 1: استخدام الدالة saturate()‎ لضبط قيمة اللون (color) ولون الخلفية (background-color).

.selector {
  color: saturate(hsl(120, 30%, 90%), 20%); // #d9f2d9
  background-color: saturate(#855, 20%); // #9e3f3f
}

سيُصرّف المثال السابق إلى شيفرة CSS الآتية:

.selector {
  color: #d9f2d9;
  background-color: #9e3f3f;
}

انظر أيضًا

• الدالة desaturate()‎: تجعل اللون أقل تشبّعًا.
• الدالة saturation()‎: تعيد الدالة مُكوّن التشبع للون الممرَّر إليها.
• الدالة adjust_color()‎: تغيِّر قيمة أي مكوِّن من مكونات اللون.
• الدالة hsl()‎: تنشئ لونًا انطلاقًا من قيم الصبغة والتشبع والإضاءة.

مصادر

• قسم الدالة saturate في صفحة الدوال في توثيق Sass الرسمي.