AzumLex / Website

0 stars 0 forks source link

RWD #4

Open AzumLex opened 8 months ago

AzumLex commented 8 months ago

Hallo! Frohes Neues Jahr! Ich hoffe, es ist nicht zu spät für einen Issue - Wenn schon, ist es gar kein Problem.

Ich hab mich auf die API und das Java Script fokussiert. Das RWD für die Wetter-API-Darstellung fehlt mir noch. Auch bei den restlichen Subpages möchte ich noch etwas Content einfügen, sowie die Escape Room Seite so wie die Reiseguide Seite gestalten und das Impressum sowie Kontakt noch schöner gestalten. Aber das sollte fix erledigt sein.

Was ich mich noch gefragt habe: Bei der Bildergalerie ist ja "nur" das Bilderkarusell. Darüber die Nav-Bar und darunter auch. Wenn ich es am Laptop Bildschirm anschaue, dann sieht es gut aus, aber auf einem größeren Monitor ist das Problem, dass unterhalb der unteren Nav-Bar (Footer) noch mehr Platz ist. Das ist nicht so schön. Ich hab es zuerst damit probiert, den Container größer zu machen (als leeres), aber es müsste ja adaptiv sein - wenn der Bildschirm größer ist, müsste der leere Container größer sein, wenn der Bildschirm kleiner ist, darf der Container aber nur so groß sein, dass die untere Nav-Bar genau am unteren Bildschirmrand ist. Ich dachte, man könnte es mit einem Media Query lösen (also wenn der Bildschirm größer als xx px ist), aber ich bin nicht sicher, wie man das am besten anstellt mit der Größenberechnung. Vielleicht gibt es irgendeinen einfachen Weg, um die untere Nav-Bar immer an den unteren Bildschirmrand zu bekommen. Entschuldigung für die Störung in den Weihnachtsferien.

oliver-jung commented 8 months ago

Ebenso ein frohes neues Jahr - es ist nicht zu spät für einen Issue!

Ein schöner Fortschritt und eine kreative Lösung bei der Bildergallerie. Wenn die Bilder alle im Portrait-Modus sind, lässt sich etwas "leere Fläche" schlecht vermeiden - das ist also kein Problem.

Ich würde schlicht und ergreifend den Footer immer an den unteren Rand schieben. Das lässt sich mit einem Flex-Design relativ unkompliziert umsetzen. Die "restPlatz"-div kannst du dir entsprechend sparen.

body { min-height: 100vh; display: flex; flex-direction: column; }

footer { margin-top: auto; }

AzumLex commented 8 months ago

Danke für die Lösung! Das funktioniert perfekt.

Am Fr., 5. Jan. 2024 um 14:02 Uhr schrieb Oliver Jung < @.***>:

Ebenso ein frohes neues Jahr - es ist nicht zu spät für einen Issue!

Ein schöner Fortschritt und eine kreative Lösung bei der Bildergallerie. Wenn die Bilder alle im Portrait-Modus sind, lässt sich etwas "leere Fläche" schlecht vermeiden - das ist also kein Problem.

Ich würde schlicht und ergreifend den Footer immer an den unteren Rand schieben. Das lässt sich mit einem Flex-Design relativ unkompliziert umsetzen. Die "restPlatz"-div kannst du dir entsprechend sparen.

body { min-height: 100vh; display: flex; flex-direction: column; }

footer { margin-top: auto; }

— Reply to this email directly, view it on GitHub https://github.com/AzumLex/Website/issues/4#issuecomment-1878629574, or unsubscribe https://github.com/notifications/unsubscribe-auth/BCRQSC6VRLEPISZHUKHRH7TYM72XZAVCNFSM6AAAAABBM3LEOGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZYGYZDSNJXGQ . You are receiving this because you authored the thread.Message ID: @.***>