How do you set alternating colors in the list of topics? It helps usability a lot, but it is all white by default.
example:
You can achieve this with a CSS customization. Here’s an example to get you started:
.topic-list-item:nth-child(even) {
background-color: #EEE;
}
.topic-list-item:nth-child(odd) {
background-color: #FFF;
}
Here’s how this looks on Meta:
And for those who are looking to change the background of topics, here’s the solution:
div.topic-post:nth-child(odd), div.small-action:nth-child(odd) { background-color: #FAFBFF; } div.topic-post:nth-child(even), div.small-action:nth-child(even) { background-color: #F6F6FF; }
And here’s the discussion about why it isn’t the default anymore:
@fefrei Care to extract this into a super simple theme component? 
@Silvanus same for your topic tweak. I was thinking maybe we’d just include it in the “tiger striping component” but commented out by default, but we might as well make it a component of its own as they really are two completely separate pieces of styling.
Sure!
Can you tell me why I cannot use $primary-low in the theme component? It’s used all over the place in core (e.g. as the background color of buttons), and I think it’s a good color for the darkened rows, but it’s undefined:
Error: Undefined variable: "$primary-low".
on line 2 of theme_field.scss
>> background-color: $primary-low;
----------------------^
I’ve run into the same problem. What solved it for me was adding this at the top:
@import "common/foundation/variables";
And then you can use those colors.
That’s the short story, the long story is here:
That did it, thanks 
Here you go:
Why not 
stripes? I guess 
stripes are less… black and white?
كيف يمكنك القيام بذلك في صفحة تفاصيل الموضوع مع الردود المتبادلة؟
هذا الأمر أكثر تعقيدًا بعض الشيء. يمكنك محاولة تطبيق نفس المبدأ على فئة post-stream، لكنها لا تحتوي فقط على الردود، بل أيضًا على “فجوات”، مثل عبارة بعد عامين التي تظهر فوق منشورك، لذا تُحتسب هذه الفجوات أيضًا وقد تتأثر.
ما هي أفضل طريقة لتطبيق هذا بألوان مختلفة اعتمادًا على ما إذا كان المظهر الفاتح أو الداكن قيد الاستخدام؟
قد يرد هذا الموضوع على سؤالك 
:
هناك طريقتان على الأقل تعملان:
- استخدم ألوانًا مختلفة لسمات مختلفة.
- قم بتظليل الصفوف بلون رمادي متوسط شبه شفاف، بحيث يعمل على كل من الخلفيات الفاتحة والداكنة. على سبيل المثال، امنح صفوف
nth-child(odd)لونًا مثلbackground: #80808040;.
إذا كان ذلك يساعد، فقد نشرت تجاوزًا لورقة الأنماط يوضح الطريقة الأولى… تحديد الألوان لكل سمة. للحصول على التفاصيل، ابحث في style.css عن أي أجزاء تحتوي على nth-child.
إليك مثال على كيفية ظهوره في سمة فاتحة:
… ولكل سمة تعريفات ألوانها الخاصة، بحيث تتناسب صفوف الجدول مع كل سمة.