مرحباً،
لقد حاولت تجاوز متغيرات border-radius الجديدة باستخدام سمة بعيدة ولكن يبدو أن متغيرات :root الأساسية لها الأولوية دائمًا. يمكنني تجاوز هذه المتغيرات إذا قمت بإنشاء مكون سمة في الإدارة. هل هناك طريقة لتجاوز هذه المتغيرات باستخدام سمة؟ ما الذي أغفله؟ 
هذا التغيير الصغير مفيد جدًا شكرًا جزيلًا! 
حسنًا، لقد عمل كما هو متوقع فقط موقع الاختبار الخاص بي كان يخدعني.
أوه، يبدو أن ذلك لم يكن مزحة 
باستخدام السمة عن بعد، يمكنني تجاوزها فقط إذا استخدمت !important.
إذا استخدمتها هكذا 
$border-radius: 2em !important;
:root {
--d-button-border-radius: #{$border-radius};
--d-input-border-radius: #{$border-radius};
}
وإلا إذا حاولت هكذا
:root {
--d-button-border-radius: 2em;
--d-input-border-radius: 2em;
}
فإن متغيرات :root الأساسية لها الأولوية.
ما الذي أفتقده؟ 
شكراً لك!
إنه يعمل عند اختباره في سمة… يتم تجاوز الجذر الأساسي بواسطة جذر السمة، كما هو متوقع.
هل يمكنك إظهار المزيد من المعلومات؟ أين تحدد الجذر الخاص بك؟ كيف يبدو المفتش الخاص بك؟
مرحباً تشارلي،
شكراً لك على التحقق من هذا
لقد حاولت الإضافة في scss/custom-variables.scss واستيرادها إلى common.scss. وحاولت الإضافة مباشرة إلى common.scss أيضاً.
لقد لاحظت الآن أنها تعمل إذا لم يكن هناك أي مكون آخر (تم إنشاؤه في المسؤول) معين للسمة. إذا قمت بإنشاء مكون في المسؤول مع بعض CSS في القسم المشترك. فلن يتجاوز المتغيرات الجذرية الأساسية بالنسبة لي.
إنها تعمل إذا كانت السمة لا تحتوي على مكون أو إذا كان المكون المشترك / CSS فارغاً.
إذا قمت بإنشاء مكون مع بعض CSS المشترك وتفعيله للسمة.
إذن فهي لا تعمل بالنسبة لي.
d-default-border-radius و d-select-body-border-radius هما مخصصان.
شكراً على المساعدة!
حسناً. مثير للاهتمام جداً. شكراً على الخطوات الواضحة.
سأرى ما سأتوصل إليه. في الوقت الحالي، أنا متشكك في وجود حل مختلف غير !important الذي تستخدمه بالفعل، ولكن سيكون من الجيد معرفة كيف/لماذا يعمل هذا بهذه الطريقة.
نعم، يمكنني إعادة إنتاج هذا… إنه غريب بعض الشيء.
لدي سمة بعيدة وكل ما تحتويه common.scss هو:
:root {
--d-border-radius: 100px;
}
هذا يعمل وأحصل على أزرار مستديرة وعناصر أخرى:
بمجرد إضافة مكون سمة محلية يحتوي على CSS، فإنه يتعطل. لقد أنشأت مكون سمة محلي يحتوي فقط على هذا في common.scss:
body {
background: red;
}
أحصل على الخلفية الحمراء، لكن border-radius مفقود:
نفس المكون يعمل بشكل جيد عن بعد. أحصل على كل من الخلفية الحمراء والحدود المستديرة.
@david/@pmusaraj هل لهذا علاقة بترتيب تجميع السمات البعيدة والمحلية؟
أعتقد أن الأمر يتعلق بحقن variables.scss الخاص بنا في كل ملف CSS للقالب. الآن، لدينا هذا في variables.scss:
:root {
--topic-body-width: #{$topic-body-width};
--topic-body-width-padding: #{$topic-body-width-padding};
--topic-avatar-width: #{$topic-avatar-width};
--d-border-radius: initial;
--d-nav-pill-border-radius: var(--d-border-radius);
--d-button-border-radius: var(--d-border-radius);
--d-input-border-radius: var(--d-border-radius);
}
ولأننا نحقن ملف SCSS هذا في كل ملف SCSS للقالب والإضافات، فإنه يتكرر مرارًا وتكرارًا:
الطريقة الوحيدة لتجاوزها حاليًا هي إضافة التجاوز إلى آخر ورقة أنماط للقالب، عندها فقط يتم إخراجها في النهاية.
أعتقد أننا بحاجة إلى نقل هذا التصريح :root إلى مكان عام خارج variables.scss في النواة.
أها! شكراً جزيلاً لك، لم أعالج حقًا سبب تكرار هذه الأمور وتجاهلتها تمامًا.
لقد نقلت هذه إلى ملف آخر حتى لا تتكرر، وأكدت أن هذا يحل المشكلة.
