هل من الممكن تجاوز متغيرات Discourse؟

الدعم
1

مرحبًا،

أحاول تغيير الطباعة مثل عائلة الخط (font-family)، ووزن الخط (font-weight)، وأحجام الخطوط باستخدام متغيرات Discourse.

$base-font-family: var(--font-family) !default;
$heading-font-family: var(--heading-font-family) !default;

إذن، كيف يمكنني تغيير متغير heading-font-family مثل $heading-font-family: Arial;؟ لقد جربت عدة طرق لكن التغييرات غير ظاهرة.

$heading-font-family: Arial;

:root {
  --heading-font-family: Arial;
}

هل لديك أي فكرة؟

2

ربما يمكنك الاطلاع على https://meta.discourse.org/t/selectable-font-family-component/117493?

3

شكرًا على الرد.

في الواقع، توجد ميزة افتراضية في Discourse لهذا الغرض. لكنني أرغب في تخصيص الطباعة بشكل أكثر تفصيلاً.

image
image1480×436 20.6 KB

لذلك أنا أبحث عن طريقة لتغيير قيم المتغيرات. لذا ظننت أنني يمكنني بسهولة تغيير الطباعة بالكامل.

من ملف variables.scss

// Fonts
// --------------------------------------------------

$base-font-size-smallest: 0.815em !default; // يعادل 13px
$base-font-size-smaller: 0.875em !default; // يعادل 14px
$base-font-size: 0.938em !default; // يعادل 15px
$base-font-size-larger: 1.063em !default; // يعادل 17px
$base-font-size-largest: 1.118em !default; // يعادل 19px
$base-font-family: var(--font-family) !default;
$heading-font-family: var(--heading-font-family) !default;

// تعريفات حجم الخط، المعامل ^ (الخطوة / الفترة)
$font-up-6: 2.296em;
$font-up-5: 2em;
$font-up-4: 1.7511em;
$font-up-3: 1.5157em;
$font-up-2: 1.3195em;
$font-up-1: 1.1487em; // 2^(1/5)
$font-0: 1em;
$font-down-1: 0.8706em; // 2^(-1/5)
$font-down-2: 0.7579em; // أصغر حجم نستخدمه بناءً على الأساس 1em
$font-down-3: 0.6599em;
$font-down-4: 0.5745em;
$font-down-5: 0.5em;
$font-down-6: 0.4355em;

هل تعتقد أنه من الممكن تغيير هذه المتغيرات؟

4

أوه. ظننت أن ذلك يبدو قديماً وأن هناك طريقة أفضل الآن. أعتذر عن ذلك.

5

شكرًا لك على الإجابة @pfaffman. آمل أن يكون هناك طريقة ما لتجاوز هذه المتغيرات. وإلا، سأحتاج إلى تغيير فئات CSS.

6

أعد تشغيل معالج الإعداد، حيث أصبح اختيار الخط الآن خطوة ضمن معالج الإعداد اعتبارًا من إصدار بيتا 2.6.

7

شكرًا لك على الرد @codinghorror. إذن يمكننا اختيار خطوط معينة فقط، أليس كذلك؟ وتعلمت أن هذه المتغيرات لا يمكن تجاوزها. هل هذا صحيح؟

8

@bekircem لقد اختبرت المعالج للتو على 2.7.0.beta1 وتظهر الخطوط المتاحة نفسها من إعدادات الموقع التي شاركتها أعلاه (قد يكون هناك شيء ما فاتني).

ربما تكون قد اكتشفت الأمر بالفعل، ولكن في حال لم تفعل، يمكنك استخدام Google Fonts أو يمكنك استبدال متغيرات CSS تمامًا كما فعلت في منشورك الأصلي - وهو ما كان يجب أن يعمل.

أنا أستخدم هذا CSS في نسختي وهو يعمل (تحميل الخط عبر <link/> أو @include).

:root {
  --heading-font-family: 'Inter', sans-serif;
  --font-family: 'Inter', sans-serif;
}