\n\nسمة Pyx الحديثة هي خليفة لسمتي القديمة، السمة الحديثة لـ darkpixlz، والتي كانت تفرعًا من سمة Air. كانت تتكون من حوالي 2500 سطر وتحتوي على العديد من المشكلات، لذلك قمت بإعادة كتابتها!\n\n\n## لقطات الشاشة\n\n[grid]\n
\n\n\n[/grid]\n\n## الميزات\n- يدعم واجهة المسؤول الكاملة ولوحة المراجعة\n- يدعم جميع الميزات الأساسية الحديثة تقريبًا (خريطة الموضوعات الجديدة، صفحة الترقية الجديدة، الدردشة، …) وبعض المكونات الإضافية\n- صورة خلفية قابلة للتخصيص\n- يضيف خاصية --user-bg-url للمكونات الإضافية الخاصة بك لقراءة صورة الخلفية للمستخدمين في الملفات الشخصية\n- مقارنةً بالسمة القديمة، عدد أسطر أقل بكثير وأسهل في العرض على الأجهزة \n\n### المشكلات المعروفة\n\nلا شيء في الوقت الحالي!\n\nجميع المساهمات على المستودع مرحب بها للغاية وسيتم (على الأرجح) مراجعتها في نفس اليوم. تعليقات أو أفكار؟ اترك ردًا هنا. مشاكل؟ يرجى إنشاء مشكلة على GitHub. \n\n\u003csmall\u003e\n\u003ci\u003eيرجى ملاحظة أنني أختبر جميع أنماطي لمتصفح Firefox و Firefox فقط؛ إذا كان متصفح Chromium يواجه مشكلة، فلا تتردد في تقديم تقرير. أنا لا أختبر أو أتحقق من العرض على الهاتف المحمول في الوقت الحالي، ولكن الدعم مخطط له.\u003c/i\u003e\n\u003c/small\u003e\n\nهذا كل شيء في الوقت الحالي - استمتع بالسمة!"
أتساءل عما إذا كان من الممكن إضافة مقياس تكيفي؟ أود أن يكون لدي مكون شريط جانبي على الجانب الأيمن.
CSS
/* الحصول على عرض صورة المستخدم وتعيين الحد الأقصى لعرض حاوية الإعلان */
/* أنماط حاوية الإعلان */
#list-area {
display: flex; /* ترتيب الإعلانات باستخدام flexbox */
flex-direction: column; /* عرض الإعلانات عموديًا */
gap: 0; /* إزالة المسافات بين صور الإعلانات */
padding: 0; /* إزالة حشو الحاوية */
margin: 0; /* التأكد من عدم وجود هامش إضافي حول حاوية الإعلان */
max-width: 812px; /* تحديد الحد الأقصى لعرض حاوية الإعلان بـ 812 بكسل (عرض الصورة الرمزية: 48 بكسل) */
}
/* أنماط رابط الإعلان */
.banner-ad {
display: block; /* جعل حاوية الإعلان عنصر كتلة */
width: 100%; /* التأكد من أن حاوية الإعلان تشغل 100% من العرض */
max-width: 100%; /* منع تجاوز الحد الأقصى للعرض */
margin: 0; /* إزالة المسافات بين حاويات الإعلانات */
}
/* أنماط صور الإعلانات المتجاوبة */
.ad-image {
width: 100%; /* التأكد من أن الصورة تشغل العرض الكامل للعنصر الأب */
height: auto; /* الحفاظ على نسبة العرض إلى الارتفاع الأصلية للصورة */
max-width: 100%; /* منع الصورة من تجاوز الحد الأقصى لعرض حاويتها */
display: block; /* إصلاح مشكلة المساحة الفارغة أسفل الصور */
margin: 0; /* إزالة أي مساحة إضافية حول الصورة */
}
/* التصميم المتجاوب: ضبط عرض الإعلانات للشاشات الكبيرة والصغيرة */
/* ضبط عرض الإعلانات على الأجهزة التي يقل عرضها عن 768 بكسل */
@media (max-width: 768px) {
#list-area {
padding: 0; /* التأكد من عدم وجود حشو إضافي على الأجهزة المحمولة */
}
.banner-ad {
width: 100%; /* التأكد من أن الإعلان يشغل العرض الكامل على الشاشات الصغيرة */
}
.ad-image {
width: 100%; /* التأكد من أن الصورة تتكيف مع عرض الحاوية */
height: auto; /* الحفاظ على نسبة عرض الصورة إلى ارتفاعها */
}
}
/* ضبط إضافي لصور الإعلانات على الأجهزة الصغيرة جدًا (مثل الهواتف في الوضع الرأسي) */
@media (max-width: 480px) {
.ad-image {
width: 100%; /* التأكد من أن الصور تتكيف مع عرض شاشة الهاتف */
max-width: 100%; /* تعيين الحد الأقصى للعرض إلى 100% لتجنب التكبير الزائد */
height: auto; /* الحفاظ على نسبة عرض الصورة إلى ارتفاعها */
}
}
عذرًا، لقد كنت مريضًا كثيرًا هذا الأسبوع، وكان لدي أيضًا أشياء أخرى لأقوم بها. لقد قمت للتو بتلميع تدفق النشر، وأصلحت العديد من الأخطاء، وجعلت المنشئ يطفو!
وأيضًا، لاحظت أن صفحة السمة عادت إلى الإصدار القديم مما تسبب في الكثير من المشاكل. لن أبذل جهدًا لإصلاح أي شيء هناك لأنني أشعر أنه سيتم إضافته مرة أخرى وسيبدو كما هو مقصود.
للأسف، هذا خارج نطاق هذا القالب لأنه مصمم بشكل موحد عن قصد، لذلك لن أعتمد تخطيطًا حيث تكون الشريط الجانبي منفصلاً. إذا كنت تبحث عن تصميم كهذا، فأنا أوصي بهذين القالبين الرائعين:
ومع ذلك، إذا كان شريط الرأس هو شيء ترغب في رؤيته مدعومًا، فلا تتردد في تزويدي بعنوان موقع إلكتروني وسأتحقق من إمكانية دعمه.
باختصار: السمة خرجت الآن من مرحلة “المعاينة”! أنا واثق بما فيه الكفاية من أنها ستعمل لمعظم مواقع الجميع وستكون مصممة بشكل جيد. مع هذه المرحلة الجديدة، لم أعد أبحث عن تقارير الأخطاء هنا، يرجى تقديم مشاكل GitHub للمضي قدمًا.
يرجى الاستمرار في تقديم الملاحظات - أي شيء وكل شيء مرحب به. شكراً لدعمكم المستمر حتى لو كنت بطيئًا :3
أخبار سارة أخرى! لقد انتهيت للتو من إعادة كتابة السمة مرة أخرى بحيث لم تعد ملف common.scss ضخمًا واحدًا. لا ينبغي أن تبدو مختلفة بخلاف بعض الإصلاحات الطفيفة التي أجريتها. استمتع :3
لقد أعجبتني السمة حقًا، ولكن هناك بعض “العيوب” التي تمنعني من استخدامها للأسف
تحتوي صفحة “الملف الشخصي” على زر صغير خلف الرأس يقول “تخطي إلى المحتوى”
عندما أحاول تحديد لوحة ألوان مختلفة (كمستخدم، في ملفي الشخصي) يظهر مربع الاختيار المنسدل بالقرب من زر “تخطي إلى المحتوى” الذي ذكرته أعلاه (هذه هي الطريقة التي أدركت بها وجوده)
| ملخص | سمة Pyx الحديثة هي خليفة السمة الحديثة لـ darkpixlz. \n| 
|معاينة| Theme Creator |\n| 
|المستودع| GitHub - pyxfluff/moderntheme: Modern theme for Discourse. |\n| 
|دليل التثبيت|كيفية تثبيت سمة أو مكون سمة|\n| 
|جديد في سمات Discourse؟| دليل المبتدئين لاستخدام سمات Discourse\n\n\nتثبيت هذه السمة\n\n\n
أنا واثق بما فيه الكفاية من أنها ستعمل لمعظم مواقع الجميع وستكون مصممة بشكل جيد. مع هذه المرحلة الجديدة، لم أعد أبحث عن تقارير الأخطاء هنا، يرجى 
، لقد تم إصلاحه الآن. يجب أن يعود كل شيء إلى طبيعته.
