الفرق بين المراجعتين ل"Sass/function directives"
(إضافة الصفحة) |
ط (إضافة عنوان الصفحة والتصنيفات) |
||
| سطر 1: | سطر 1: | ||
| + | <noinclude>{{DISPLAYTITLE:موجهات الدوال في Sass}}</noinclude> | ||
من الممكن تعريف دوالّ خاصةٍ بك في Sass واستخدامها في أيِّ سياق أو على أيّ قيمة داخل الملف البرمجي. على سبيل المثال:<syntaxhighlight lang="sass"> | من الممكن تعريف دوالّ خاصةٍ بك في Sass واستخدامها في أيِّ سياق أو على أيّ قيمة داخل الملف البرمجي. على سبيل المثال:<syntaxhighlight lang="sass"> | ||
$grid-width: 40px; | $grid-width: 40px; | ||
| سطر 25: | سطر 26: | ||
== مصادر == | == مصادر == | ||
* [https://sass-lang.com/documentation/file.SASS_REFERENCE.html#function_directives قسم Function Directives من توثيق Sass الرسمي]. | * [https://sass-lang.com/documentation/file.SASS_REFERENCE.html#function_directives قسم Function Directives من توثيق Sass الرسمي]. | ||
| + | [[تصنيف:Sass]] | ||
مراجعة 05:32، 10 أبريل 2018
من الممكن تعريف دوالّ خاصةٍ بك في Sass واستخدامها في أيِّ سياق أو على أيّ قيمة داخل الملف البرمجي. على سبيل المثال:
$grid-width: 40px;
$gutter-width: 10px;
@function grid-width($n) {
@return $n * $grid-width + ($n - 1) * $gutter-width;
}
#sidebar { width: grid-width(5); }
ستُصبح:
#sidebar {
width: 240px; }
لاحظ أنَّه يمكن للدوال الوصول إلى كل المتغيرات العامة وكذلك قبول الوسائط كما تفعل المخاليط (mixins). قد تحتوي الدالة على العديد من العبارات البرمجية، كما أنّه سيكون عليك أن تضع القيمة التي تريد أن تُعيدها الدالة في @return.
كما هو الحال في المخاليط، يمكنك استدعاء الدوالّ المُعرّقة في Sass باستخدام الوسائط المُسمّاة. في المثال أعلاه كان بإمكاننا استدعاء الدالة هكذا:
#sidebar { width: grid-width($n: 5); }
ويُستحسن أن تجعل لاسم الدالة بادئةً لتجنب التداخل في الأسماء ولِيعلّم من يقرأ ملف الأنماط خاصتك أنها ليست جزءًا من Sass أو CSS. على سبيل المثال، إن كنت تعمل في شركة تُسمّى Hsoub، فلعلّك ترغب في إعطاء الدالة أعلاه الاسم -hsoub-grid-width.
تدعم الدوال التي يُعرّفها المستخدمون أيضًا الوسائط المتغيرة كما تفعل المخاليط.
لأسباب تاريخية، يمكن لأسماء الدوال (وجميع معرفات Sass الأخرى) أن تستخدم الشرطات العادية والشرطات السفلية بدون فرقٍ. على سبيل المثال، إن عَرًفت دالةً تُسمى grid-width، فيمكنك استخدامها بالاسم grid_width، والعكس بالعكس.