سمة Pyx الحديثة هي خليفة لسمتي القديمة، سمة Modern Theme الخاصة بـ darkpixlz، والتي كانت تفرعًا من سمة Air. كانت حوالي 2500 سطر ولديها العديد من المشكلات، لذلك قمت بإعادة كتابتها!
يدعم تقريبًا كل ميزات النواة الحديثة (خريطة الموضوعات الجديدة، صفحة الترقية الجديدة، الدردشة، …) وبعض الإضافات
صورة خلفية قابلة للتخصيص
يضيف خاصية --user-bg-url لإضافاتك لقراءة صورة خلفية المستخدم على الملفات الشخصية
مقارنة بسمتي القديمة، عدد أسطر أقل بكثير بشكل عام وأسهل للأجهزة في العرض
المشكلات المعروفة
تبدو خريطة الموضوعات غريبة وغير متوازنة
جميع المساهمات على المستودع مرحب بها للغاية وسيتم (على الأرجح) مراجعتها في نفس اليوم. تعليقات أو أفكار؟ اترك ردًا هنا. مشكلات؟ قم بإنشاء مشكلة على GitHub من فضلك.
يرجى ملاحظة أنني أختبر جميع أنماطي لـ Firefox فقط؛ إذا كان Chromium يسبب مشكلة، فلا تتردد في تقديم تقرير.
أتساءل عما إذا كان من الممكن إضافة مقياس تكيفي؟ أود أن يكون لدي مكون شريط جانبي على الجانب الأيمن.
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 الحديثة هي خليفة سمة Modern Theme الخاصة بـ darkpixlz.
|معاينة| Theme Creator |
|مستودع| GitHub - pyxfluff/moderntheme: Modern theme for Discourse. |
|دليل التثبيت|كيفية تثبيت سمة أو مكون سمة|
|جديد في سمات Discourse؟| دليل المبتدئين لاستخدام سمات Discourse
أنا واثق بما فيه الكفاية من أنها ستعمل لمعظم مواقع الجميع وستكون مصممة بشكل جيد. مع هذه المرحلة الجديدة، لم أعد أبحث عن تقارير الأخطاء هنا، يرجى 
، لقد تم إصلاحه الآن. يجب أن يعود كل شيء إلى طبيعته.
