ما فاجأني هو أنه في المرة الأولى التي جربت فيها ذلك بعد تحديد سمة “Fully” على Meta، تم عرض موضوع try.discourse.org بسمة Fully. أفترض أن هذه مشكلة تخزين مؤقت متعلقة بكون المواقع على نفس النطاق.
هل المشكلة التي تشير إليها هي أن شعار Discourse لا يتم استبداله بالشعار الصغير عند النقر على قائمة الهامبرغر على try.discourse.org؟
Hmm – تتضمن لوحة التنقل في موقع try.discourse.org عنصر div إضافي بروابط القائمة (.try-header-nav-wrapper) مما يكسر تخطيط الصفحة (على هذا الموقع فقط) عن طريق دفع الرأس بعيدًا جدًا إلى اليمين عند إخفاء القائمة الجانبية، لذلك أرى الآن أنه ليس خطأ في سمة Fully.
صباح الخير!
أنا أستمتع حقًا باستخدام هذا القالب لمنتدى الخاص بي، ولكني لاحظت أنه، مثل القالب الافتراضي، لا يوجد خيار لتخصيص CSS/HTML. أود إضافة خلفية للجدران إلى القالب. هل هذا ممكن؟
يمكنك القيام بذلك عن طريق استخدام قائمة سمات التخصيص / مكونات السمة لإنشاء مكون سمة جديد وإضافته إلى هذه السمة.
في مكون السمة الخاص بك، يمكنك إضافة الكود المخصص لإضافة الخلفية الخاصة بك.
مرحباً @jordan.vidrine،
شكراً لردك. أعتقد أنني رأيت هذا في مكان ما عندما بحثت عن “تغيير الخلفية”، لكنني افترضت أنه كان ممكناً فقط ضمن تخصيص CSS/HTML الخاص بالقالب.
سأجرب هذا!
أهلاً يا رفاق! أنا أحب هذا القالب! عند معاينته على موقعي، واجهت مشكلة في رأس التنقل في الشريط الجانبي. هل يمكن أن يستخدم رأس التنقل لونًا مختلفًا (لون الرأس العادي للموقع)؟
هذا:
بدلاً من هذا:
كيف يمكنني فعل ذلك؟ عند تغيير CSS، أصبح التنقل بأكمله أخضر.
شكرًا!
تريد تغيير المتغير المحدد لـ —sidebar-color) وسيؤدي ذلك إلى تغيير الشريط الجانبي وما فوق الشريط الجانبي.
Hmmm, هل هناك طريقة لتغيير رأس الشريط الجانبي فقط؟
لدي نفس المشكلة، مع شعار الترويسة الخاص بي يمتد عبر لونين مختلفين مما يبدو غريبًا.
هل تعتقد أن تعديل CSS في السمات أصبح غير مستحسن هذه الأيام؟ تمت إزالة خيار محرر CSS للسمات البعيدة، فكيف سنغير هذا المتغير؟ هذا يفترض أيضًا أننا نريد أن يكون لون الشريط الجانبي هو نفس لون الترويسة.
مرحباً، يمكنك تغيير هذا القسم بشكل منفصل عن الشريط الجانبي باستخدام CSS.
للقيام بذلك، تحتاج إلى إنشاء مكون جديد أو إضافته إلى مكون موجود. 
انتقل إلى /admin/customize/themes/
التخصيص → السمات
انقر فوق علامة التبويب المكونات ثم انقر فوق الزر تثبيت
في نافذة المنبثقة، انقر فوق الزر إنشاء جديد واكتب اسم المكون الجديد.
انقر فوق الزر إنشاء.
تم إنشاء المكون. الآن حدد “تفعيل السمة بالكامل” لتفعيله.
انقر فوق الزر تحرير CSS/HTML.
الصق الكود أدناه في قسم CSS.
لا تنس حفظه باستخدام الزر حفظ في الأسفل.
.desktop-view .has-sidebar-page .d-header-wrap::before {
background: transparent;
border-right: none;
}
إذا كنت ترغب في الاحتفاظ بالحد الأيمن، فقم بإزالة هذا السطر من الكود.
شكراً لك دون. لم أقم بتعديل تنسيق CSS الخاص بـ Discourse من قبل… أين يمكنني إجراء هذا التغيير؟
لقد قمت بتحديث المنشور أعلاه. 
شكرا لك. لقد قمت بذلك للتو وكل شيء يبدو جيدًا مرة أخرى 
بما أن السمة الحالية، هناك مساحة صغيرة جدًا متبقية على الحدود اليمنى للقيام بذلك. أعتقد أنه سيكون من المثير للاهتمام أن يكون هناك المزيد من المساحة هناك واستخدامها للأدوات.
لقد سمحت لمستخدمي بالوصول إلى السمة وسرعان ما اكتشفوا شيئًا غريبًا يحدث 
أستخدم مكون السمة Custom Header Links ومع السمة الأخرى التي أستخدمها (Material Design)، عندما تقلل عرض نافذة المتصفح وتصل إلى النقطة التي تتجاوز فيها الروابط شعار الموقع، يتقلص الشعار، ليصبح صغيرًا جدًا في النهاية، على سبيل المثال:
مع Fully، لا يتقلص الشعار، وفي النهاية تحصل على هذا…
تقوم “روابط الرأس المخصصة” بإزالة الروابط وعرض عنوان الموضوع عند عرض موضوع. يتجاوز عنوان الموضوع أيضًا الشعار في عروض المتصفح الأضيق، على الرغم من أنه في النهاية تتم إزالة الشعار تمامًا، مما يحل المشكلة.
لست متأكدًا مما إذا كانت هذه مشكلة في Fully أو في “روابط الرأس المخصصة”، ولكني أبدأ هنا لأن “روابط الرأس المخصصة” تعمل بشكل جيد في السمة الأخرى.
يبدو أن هناك تعارضًا بسيطًا مع discourse-full-width-component والشعارات الأعرض.
يمكنك إصلاح ذلك بسرعة باستخدام 
الصق هذا في المكون الذي تم إنشاؤه مسبقًا بعد الكود السابق ليكون في مكان واحد.
سيؤدي ذلك إلى تصغير الشعار.
.desktop-view .d-header .title a {
flex: auto;
}
تحديث: هممم أعتقد أنه ربما يصغر كثيرًا مع الشريط الجانبي المخفي… 
لقد ألقيت نظرة سريعة وأعتقد أن الأمر يتعلق بالشبكة. لكن أعتقد أنه من الأفضل انتظار الطريقة الرسمية لذلك لأنني لا أريد كسر تجربة المستخدم للرأس عن طريق التغيير في الشبكة.
@packman يرجى إزالة هذا الكود.
شكراً لك مرة أخرى! أنت تقوم بأعمال رائعة اليوم
مرحباً دون! مشكلة أخرى: تغييرها بهذه الطريقة يجعلها تبدو كما هي في الوضع المظلم. كيف يمكنني تغيير CSS لمخطط ألوان معين فقط؟
تصبح الشعار صغيرة جدًا في نافذة ضيقة ولكن هذا يحدث أيضًا مع روابط الرأس المخصصة عند استخدامها مع سمة التصميم المادي.
كنت ألقي نظرة على CSS في وقت سابق وأعتقد أنه قد لا يساعد أن الشعار مدرج داخل span.header-sidebar-toggle، على الرغم من أنه ربما يكون المكان الوحيد المنطقي للعرض الأوسع؟
مرحباً @Renato_Mendes 
أوه، فهمت، لذا تريد استخدام الخلفية الشفافة في مخطط ألوان واحد فقط. لم أكن أعرف ذلك.
هناك عدة طرق للقيام بذلك
dark-light-choose(): من الممكن القيام بذلك بها ولكنها ليست عملية في هذه الحالة لأنها تنشئ متغيرات. من الأفضل استخدامها للألوان.schemeType: هذا أفضل لحالة الاستخدام هذه إذا كنت تريد استخدامه حسب نوع المخطط.إليك كيفية استخدام schemeType
قم بإزالة الكود السابق من المكون الذي أنشأته وضع الكود الجديد في قسم Color Definitions للمكون كما ترى في الصورة.
سيؤدي هذا إلى تفعيل الكود في المخطط الفاتح فقط.
Common / Color Definitions
@if #{schemeType()} == light {
.desktop-view {
.has-sidebar-page {
.d-header-wrap {
&:before {
background: transparent;
border-right: none;
}
}
}
}
}
يضع هذا المكون مخطط الألوان الفعلي في html حتى تتمكن من استهدافه باستخدام CSS.
إليك كيفية استخدامه:
قم بتثبيت المكون.
تحقق من معرف مخطط الألوان الذي تريد تغيير الأشياء فيه.
يمكنك العثور عليه هنا
أو
/admin/customize/colors
صفحة الألوان. هنا إذا قمت بالنقر فوق مخطط ألوان، فسيتم إضافة المعرف إلى عنوان URL.
الآن يمكنك استخدام هذا في الكود. لا تنس إزالة الكود المضاف سابقًا.
html[color-scheme="your-color-scheme-id"] {
&.desktop-view {
.has-sidebar-page {
.d-header-wrap {
&:before {
background: transparent;
border-right: none;
}
}
}
}
}
مرحباً @packman لقد أرسلت لك رسالة خاصة.