سمة Horizon

[nathank (Nathan Kershaw)]

هل هناك أي أفكار حول جعل Horizon بعرض كامل؟ أجد أنه يبدو مقيدًا بعض الشيء في المنتصف (مثل المشد؟)، وجعله كاملاً سيمنحه راحة لطيفة.

[chapoi]

لا، لا أخطط للقيام بذلك. نحن نحافظ على عرض محدود، والذي يتوافق مع الطول الأمثل للقراءة.

[Helga_Razinkova (Helga)]

مرحباً، لقد حاولت معاينة السمة، ولكن هذا كل ما أراه:

هل أفعل شيئًا خاطئًا؟

[chapoi]

لقد اختبرت للتو (على الهاتف المحمول) ويعمل بشكل جيد بالنسبة لي. هل هناك أي شيء في وحدة التحكم؟ أو هل يمكنك تجربة متصفح مختلف للتحقق؟

[Helga_Razinkova (Helga)]

شكرًا @chapoi! وحدة التحكم الخاصة بي:

[chapoi]

حسنًا، نعم يمكنني بالتأكيد إعادة إنتاج المشكلة. أعتقد أن السبب هو نقل Horizon إلى النواة (core) على الأرجح. سأحتاج إلى معرفة كيفية إصلاح رابط المعاينة، إن كان ذلك ممكنًا على الإطلاق. (سيكون المعاينة على ميتا (Meta) هي الأسهل - تم تحديث الموضوع)

ومع ذلك، يمكنك معاينته هنا على ميتا (Meta) عن طريق التبديل إلى السمة.

[Helga_Razinkova (Helga)]

شكراً جزيلاً، لقد نجح الأمر الآن!

[serkhelesheyi]

حاوية إعلان الهاتف المحمول تفيض بسبب عدم تطابق تخطيط RTL/LTR

مرحباً،

أنا أستخدم سمة Horizon مع إضافة House Ads الرسمية، وقد قمت بإنشاء مكون مخصص لتنسيق الإعلانات باستخدام متغيرات CSS وقواعد التخطيط المتوافقة مع نظام تصميم Discourse.

المشكلة: تجاوز حاوية الإعلان لعرض الرؤية على الهاتف المحمول (لكل من LTR و RTL)

• السمة: Horizon (غير قابلة للاستنساخ في السمة الافتراضية أو السمات الأخرى مثل Material، إلخ.)
• الإضافة: House Ads + مكون مخصص
• الجهاز: الهاتف المحمول
• السلوك:
  • عندما تكون لغة الموقع = الإنجليزية (LTR) ← يتم قص الحافة اليسرى لـ .ad-container (تفيض إلى اليسار).
  • عندما تكون لغة الموقع = الفارسية/العربية (RTL) ← يتم قص الحافة اليمنى (تفيض إلى اليمين).
• المتوقع: يجب أن تكون بطاقة الإعلان محتواة بالكامل داخل عرض الرؤية، ومُتوسطة أو محاذية لعرض محتوى المنشور.

كود CSS الخاص بي:

ملخص

:root {
  /* ألوان أساسية */
  --ad-bg: var(--secondary);
  --ad-border: var(--highlight);
  --ad-text: var(--primary);

  /* التسمية */
  --ad-label-bg: var(--highlight);
  --ad-label-text: var(--danger);
}


.house-creative {
  margin-left: 0 !important;
}


.house-creative a.between-posts-ad {
  display: block;
  text-decoration: none;
  color: inherit;
  background-color: transparent;
  font-family: inherit;
}

/* ===============================
   حاوية البطاقة
   =============================== */

.house-creative .ad-container {
    direction: rtl !important;
    text-align: center !important;
margin-bottom: 20px;
      padding: 10px 5px;
     max-width: calc(#{$topic-avatar-width} + #{$topic-body-width} + (#{$topic-body-width-padding} * 2));  background-color: var(--ad-bg);
  border: 2px solid var(--ad-border);
  border-radius: 10px;

  box-sizing: border-box;
  line-height: 1.7;

  color: var(--ad-text);

  transition:
    background-color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    transform 0.2s ease;
}

.house-creative a.between-posts-ad:hover .ad-container {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}


.house-creative .ad-label {
    display: inline-block;       
    text-align: center;   
    margin-bottom: 6px;
     padding: 4px 12px;

  font-size: 0.85em;
  font-weight: 700;
  text-transform: uppercase;

  background-color: var(--ad-label-bg);
  color: var(--ad-label-text);

  border-radius: 999px;
}

.house-creative .ad-container .ad-text {
  margin: 0;

  font-size: 1rem;
  line-height: 1.9;
  color: var(--ad-text);

  direction: rtl ;
  text-align: center !important ;
  unicode-bidi: isolate;
}


@media (max-width: 480px) {
  .house-creative .ad-container {
direction: rtl !important;
text-align: center !important; 
padding: 16px 12px; 
width: 100%;
max-width: 100%;

  }
}

[chapoi]

Horizon ليس متوافقًا مع جميع المكونات والإضافات (بعد).

@Discourse

متوافق

لقد اختبرنا الميزات التالية مع Horizon وأكدنا أنها تعمل. قد تكون هناك فرصة للتحسين؛ يرجى إخبارنا إذا كانت لديك أفكار حول كيفية تحسين التوافق. أي شيء غير مدرج هنا إما متوافق جزئيًا أو غير متوافق أو لم يتم اختباره بعد.

• Discourse Solved
• Clickable Topic
• DiscoTOC

[ばこん (べーこん(bac0n))]

أثناء المشاركة في مجموعة

عند عدم المشاركة في مجموعة

---

يبدو أن تصميمات الرأس والشريط الجانبي قد تغيرت بسبب تحديث مظهر Foundation.

[stephtara (Stephanie Booth)]

لا أعرف ما إذا كان هذا هو المكان المناسب لنشر هذا، ولكني أحب الطريقة التي يعرض بها Horizon على Meta بضعة أسطر من كل موضوع في عرض الفئة. لا أستطيع أن أستنسخه من جهتي ولست متأكدًا من أين أبدأ البحث. شكرًا!!

[Lilly]

يمكنك القراءة عنها هنا

Horizon: High Context Topic Cards

What’s new in Horizon? We’re happy to announce the next iteration for the Horizon theme: high-context topic cards. These cards surface key signals at a glance, pulling in data from familiar favourites: Solved (1) Topic Voting (2) Assign (3) Good old tags (4) Excerpts We have also rearranged the layout, refined spacing and typography, and expanded the last-reply preview; aiming for a balanced experience. Desktop [CleanShot 2026-01-14 at 19.12.48@2x] Mobile [CleanShot 2026-01-14 at 19.19.0…

[NateDhaliwal]

المواضيع المثبتة عالميًا لها مقتطفها محاذى لليمين (هذا في منتدى المجاني الخاص بي):

[stephtara (Stephanie Booth)]

لست متأكدًا مما إذا كان هذا يتعلق بـ Horizon أو بمكوّن Header Categories Navbar. لقد أشار لي أحدهم إلى أن شريط القائمة في Horizon يبدأ من أقصى اليسار، على عكس الثيمات الأخرى (Foundation للمقارنة)، وهو أمر غريب على الشاشات العريضة.

Horizon:

Foundation:

هل هذا مرغوب فيه؟ أم أنه شيء قد يحتاج إلى إصلاح؟ يجب أن أقول إنه إذا كان عرض المحتوى مقيدًا، فمن المنطقي بالنسبة لي ألا يبدأ شريط القائمة بعيدًا جدًا إلى اليسار.