يعمل الرأس في Horizon بشكل جيد جدًا في معظم الأوقات، سواء على الهواتف المحمولة أو أجهزة سطح المكتب:
ومع ذلك، أملك هاتفًا قابلاً للطيّ ذو نسبة عرض إلى ارتفاع غريبة. للأسف، تختفي شريط البحث والصورة الرمزية، ويصبح كل شيء غير مرتب بعض الشيء:
يبدو أن هذه المشكلة تظهر عند عرض يتراوح بين 640 و767 بكسل - للأسف، هذا هو العرض الذي يقع فيه هاتفي القابل للطيّ!
أستطيع إعادة إنتاج هذه المشكلة أيضًا - يبدو أن المشكلة تكمن في فئة contents داخل الرأس التي تعرض flex عند حجم عرض الهاتف القابل للطي/اللوحي الصغير @media (min-width: 640px) and (max-width: 767px):
يمكن إصلاحها عن طريق تغيير الخاصية إلى contents لهذا النطاق من العرض:
@media (min-width: 640px) and (max-width: 767.98px) {
.d-header>wrap .contents {
display: contents!important;
}
}
أعتقد أن Discourse يستخدم 768px كحد فاصل بين اللوحي وسطح المكتب
أجد أن هذا الإعداد يجعل الأمور أسوأ!! فعند إيقافه، يصبح الترويسة مشوّشة في جميع الأحجام حتى 767 ما لم يُحدَّد الجهاز على أنه محمول.
لكن على الأقل هاتفك القابل للطي سعيد. لكن ليس متصفح سطح المكتب عندما تصبح الأمور صغيرة.