صداع متغيرات خاصية اللون في SCSS

مطور
1

هل يمكن لبعض خبراء الأكواد المطلعين شرح سبب ظهور خطأ دائمًا (بغض النظر عن محتويات ملف settings.yaml):

.d-header {
    background: rgba($header_color, $transparency);
}

بينما هذا لا يفعل؟

.d-header {
    background: rgba(darkslategrey, 0.5);
}

حتى لو قمت بتبديل الكود لاستخدام $header_color بتنسيق rgb(47, 79, 79)، فإنه يعطيني دائمًا خطأ يتعلق بعنصر $color. :thinking:

إعجابَين (2)
2

هل هذا يعمل معي؟

$header_color: rgb(0,0,0);
$transparency: 0.5;

.d-header {
    background: rgba($header_color, $transparency);
}
إعجاب واحد (1)
3

نعم، ولكن بمجرد أن أضع المتغيرات في ملف settings.yml بهذا الشكل، فإنها لا تعمل معي. أحصل على خطأ يقول $color is not a color على الرغم من أنني لا أستخدم متغير $color هنا. لذا أفترض أنه قد يكون مرتبطًا بشيء استيفاء لا أفهمه.

header_color:
  type: string
  default: ""
  description:
    en: "..."

transparency:
  type: string
  default: ""
  description:
    en: "..."

في ذهني، يبدو أن هذا يتعلق بكيفية تجميع CSS. تعمل المتغيرات عند الإعلان عنها في وقت تشغيل CSS، ولكن ليس ديناميكيًا عبر ملف settings.yml منفصل. :thinking:

هذا لا يعمل أيضًا:

.d-header {
    background: rgba(#{$header_color}, #{$transparency});
}
إعجاب واحد (1)
4

مرحباً ليلي!
لقد واجهت نفس المشكلة منذ وقت ليس ببعيد. :smile:
إجابة مختصرة: تعتبر السمات ومتغيرات CSS سلاسل نصية، وبينما يمكنك استخدامها في سمات مثل color و background و border وما إلى ذلك، لا يمكنك استخدامها في دوال ألوان SCSS.
المشكلة لا تتعلق بـ Discourse:

هناك طريقة معقدة للغاية للتحايل على هذا لم أجربها: Unquote not working on colour string · Issue #3006 · sass/sass · GitHub

4 إعجابات
5

مرحباً ليلي :wave:
عليك إنشاء متغيرات منها لجعلها قابلة للعمل في الإعدادات. :slightly_smiling_face:
إليك مثال سريع:

5 إعجابات
6

هذا رائع، شكراً لك @Don :slight_smile:

3 إعجابات
7

ليس الأمر المرة الأولى التي أقول فيها “هذا مستحيل” وتأتي أنت وتقول “نعم إنه كذلك”، يا دون :smile:

ربما لن تكون المرة الأخيرة أيضاً :see_no_evil:

8 إعجابات
8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.