سمة الهواء

||||\n-|-|-|\n:discourse2: | ملخص | Air Theme هو سمة نظيفة وحديثة تتضمن عددًا قليلاً من مكونات السمة لتعزيز منتدىك!\n| :eyeglasses: | معاينة | معاينة على منشئ سمات Discourse\n:hammer_and_wrench: | رابط المستودع | \u003chttps://github.com/discourse/discourse-air\u003e\n:open_book: |جديد في سمات Discourse؟ | دليل المبتدئين لاستخدام سمات Discourse\n\n[wrap=theme-install-button repoUrl="https://github.com/discourse/discourse-air\" repoName="Air Theme"]\nتثبيت هذه السمة\n[/wrap]\n\n### الميزات\n\nالوضع الفاتح (Light Mode)\n

\n\nالوضع الداكن (Dark Mode)\n\n\nصفحة الفئات (Categories Page)\n\n\nتتضمن هذه السمة أيضًا بعض المكونات لتعزيز منتدىك.\n- مواضيع قابلة للنقر (Clickable Topics)\n- مربعات فئات ومجموعات حديثة (Modern Category + Group Boxes)\n\n\u003e :exclamation: يرجى قراءة هذه النصائح عند التثبيت، حيث توجد بعض الإعدادات التي يجب تفعيلها لكي يتم عرض هذه السمة بشكل صحيح.\n\n—\n# نصائح\n### تبديل مخطط الألوان الداكن/الفاتح\n\n\nلكي يعمل هذا بشكل صحيح، يجب تفعيل خيارين على الأقل لاختيار مخطط الألوان في منطقة https://discourse.jordanvidrine.com/admin/customize/colors. يجب تفعيل يمكن للمستخدمين اختيار مخطط الألوان لعدد لا يقل عن لونين.\n\n\n\nبمجرد الانتهاء من ذلك، يجب أن يتمكن المستخدمون من الاختيار بين مخططين للألوان كتفضيلاتهم الفاتحة والداكنة في قائمة واجهة تفضيلات المستخدم الخاصة بهم.\n\n\n\n___\n## لافتة الترحيب (Welcome Banner)\n\nانتقل إلى صفحة المسؤول > لافتة الترحيب (/admin/config/welcome-banner).\n\n- في القائمة المنسدلة مُمكّن على السمات… اختر Air Theme\n- في القائمة المنسدلة الموقع اختر أسفل رأس الموقع (Below site header)\n___\n## مربعات الفئات والمجموعات الحديثة (Modern Category + Group Boxes)\nيتطلب مكون السمة هذا أن تستخدم الفئات الخاصة بك إعداد مربعات الفئات مع الفئات الفرعية (CATEGORY BOXES WITH SUBCATEGORIES) في منطقة /admin/site_settings/category/all_results?filter=categories.\n\n\n\nيسمح مكون السمة هذا أيضًا لمسؤول المنتدى بتنظيم صفحة الفئات الخاصة به بعناوين رئيسية، واختيار الفئات التي تظهر تحت كل عنوان رئيسي. لتبسيط الأمور، سمحت باستخدام 5 عناوين رئيسية كحد أقصى. إذا لم يتم اختيار أي إعدادات للفئات + العناوين، فسيتم عرض جميع الفئات كما هي في الأعلى، وهذا هو خيار العرض الافتراضي.\n\n\u003e:discourse2: هل تتم الاستضافة من قبلنا؟ السمات متاحة للاستخدام على خططنا القياسية (Standard) والأعمال (Business) والمؤسسات (Enterprise)."

139 إعجابًا

That is just amazing Jordan! :heart_eyes: I love it!

17 إعجابًا

It will be helpful if the welcome message can be hide when left locale field empty :+1:

7 إعجابات

Oh wow, this looks really nice! Thank you for the share. :slight_smile:

10 إعجابات

This theme gives discourse the modern look it deserves. Very well done @jordan.vidrine

14 إعجابًا

Theme looks amazing. Awesome work :heart_eyes:

5 إعجابات

This theme looks so amazing. Hope we can get this category page design as a separate component as well. It is looking way better this way. :heart:

8 إعجابات

Thanks it is nice…

First time I install a new theme. I really like this one!!

9 إعجابات

Hi @jordan-vidrine regarding the # of views column, what kind of code shall i add in the component to override that column being hidden ?

3 إعجابات

I believe this should work:

.full-width .contents .topic-list thead th.posts {
width: 10%;
}

.full-width .contents .topic-list thead th.activity {
width: 10%;
order: 4;
}

th.num.views {
width: 10%;
order: 3;
display: block;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.posts {
width: 10%;
order: 2;
}

.topic-list .views {
width: 10%;
order: 3;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}
6 إعجابات

Refreshingly beautiful. Great work @jordan.vidrine!

4 إعجابات

هل هناك أي إمكانية لتغيير نص العنوان “مرحباً بك في المنتدى”

4 إعجابات

نعم، يمكن تعديل هذا في مكون Discourse Search Banner :+1:

3 إعجابات

منذ فترة، طرحت مشكلة تتعلق بعدم رؤية الفئات في عرض الهاتف المحمول (Air Theme - #172). لقد راسلت @jordan.vidrine قليلاً، لكننا لم نتمكن من الوصول إلى جذر المشكلة. نأمل أن يكون لدى شخص آخر بعض الأفكار.

للتفاصيل
باستخدام تثبيت نظيف لـ Discourse 2.7.11 على kubernetes بمساعدة مخطط helm من Bitnami، وأحدث إصدار من السمة مثبت ومكون كما هو مذكور في المنشور الافتتاحي، لا نرى أي فئات في عرض الهاتف المحمول والتصميم غير صحيح في أحدث صفحة.

ما جربناه
إلى جانب استخدام تثبيت نظيف، حاولنا استخدام بعض الإصدارات الأقدم من السمة أيضًا. ومع ذلك، ظلت المشكلة قائمة، لكننا لم نجرب جميع الإصدارات بشكل شامل.
قارنا أيضًا ملف html على مثيلنا مع ملف discourse.jordanvidrine.com ، ولاحظنا أنه مختلف بشكل كبير.

الشعور الحدسي
نظرًا لأنه لا يمكننا استخدام إصدار “تجريبي”، فإن شعوري الحدسي يخبرني أن هذه مشكلة توافق بين السمة أو أحد ملحقاتها مع Discourse 2.7. أود أن أعرف ما إذا كان شخص ما قد نجح في تشغيل هذه السمة على 2.7، وإذا كان الأمر كذلك، مع أي إصدارات من السمة والملحقات ذات الصلة.

سؤال
هل نجح شخص ما في تشغيل هذه السمة مع 2.7 و/أو هل هناك أي أدلة حول ما يمكننا فعله لجعل هذا يعمل؟

إعجابَين (2)

مرحباً. أولاً، شكراً لك على هذا القالب الرائع :smile:

أريد تغيير الخط، كيف يمكنني فعل ذلك؟

لقد جربت هذا :point_down:

  • تنزيل هذا القالب Google Fonts ، وتغيير إعدادات الخط في إعدادات الموقع – لم ينجح

  • إضافة كود @import{web font link ~~~ } في Desktop.css، mobile.css – لم ينجح

ما هو الملف الذي يجب علي تعديله لتغيير الخط؟؟ :sob:

3 إعجابات

أعتقد أنه يجب أن تكون قادرًا على تعيين خط مخصص دون مكون هنا: admin/site_settings/category/all_results?filter=font

إذا كنت تريد المزيد من التخصيص، أعتقد أن مكون سمة خطوط جوجل الذي ربطته سيعمل. على الرغم من أن السمة تستخدم theme-settings وليس إعداد موقع، على ما أعتقد.

هل أثرت هذه المشكلة في الموضوع الخاص بمكون الخط هذا؟

4 إعجابات

مرحباً بالجميع، هل يمكن لأحد مساعدتي في تغيير حجم و"الطبيعة الثابتة" للون الخلفية على الهاتف المحمول؟

CSS للهاتف المحمول شفاف من جهتي. وأنا بحاجة فقط إلى بعض الإرشادات حول تغيير الخلفية الثابتة لألوان الخلفية.

إذا لم أكن مخطئًا، فهناك خلفية للرأس وخلفية للصفحة، صحيح؟

3 إعجابات

هذا لأن السمة والمكونات المضمنة فيها انتقائية للغاية بشأن كيفية إعداد الموقع.

في المنشور الأصلي شاركت ما يلي:

6 إعجابات

هل هناك أي طريقة لجعل الخلفية صورة؟ أفضل أن تكون صورة بدلاً من الألوان. استخدام

body {
    background-image: url("image url here");
    background-color: #cccccc;
}

يجعل الجزء العلوي من اللون صورة، ولكن ليس الجزء السفلي.

4 إعجابات

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

html .background-container {
clip-path: unset;
}
5 إعجابات