CSS - Höhe der Vorschau-Bilder der Fotoalben fest definieren

[kanu]

Je nach Seitenformat der Vorschaubilder wird das Layout der Fotoalben aktuell ja auseinander gerissen, wenn zufällig ein Hochformat gewählt wird. Mit 160px ist die Größe der Bilder auch relativ klein. Könnte man die Höhe nicht einfach fix auf 300px setzen und dann das Bild je nach Bedarf responsiv zuschneiden?

Ich schlage folgende CSS Ergänzung vor: (Es betrifft ja Bootstrap, in Github habe ich es nicht geschafft..)

Code: Alles auswählen

.card-img, .card-img-top {
        height: 300px !important;
        object-fit: cover !important;

Die Vorschaubilder der Fotos selber sind dann ja nochmal etwas anders aufgebaut. Hier besteht das Problem ebenfalls, sobald man die Größe etwas erhöht, kapituliert das Layout.
Hier habe ich folgenden Workaround gewählt:

Code: Alles auswählen

.rounded {
    height: 300px !important;
    width: 100% !important;
    object-fit: cover !important;
}

Das ist etwas gepfuscht, mit dem passenden Selektor könnte man das sicherlich schöner hinbekommen.

[fasse]

Hallo Kanu,

vielen Dank für deinen Vorschlag. Ich habe es mal auf GitHub aufgenommen:
https://github.com/Admidio/admidio/issues/1660

Gruß
Fasse

[kanu]

Herzlichen Dank!

[fasse]

Hallo Kanu,

ich habe mir das jetzt mal genauer angeschaut und kann kein zerschossenes Layout feststellen, wenn Hochformat und Querformat zusammen dargestellt werden.

Kannst du einmal Screenshots hochladen um das zu zeigen?

Gruß
Fasse

[kanu]

Hallo fasse,
ich habe es im Demo-Bereich mal nachgestellt. Das Problem entsteht, wenn man die Skalierung des Vorschaubildes erhöht. Bei 160 Pixel sind die Bilder ja recht verpixelt, mit großen Abständen. Erhöht man die Werte, so entstehen relativ schnell Probleme im Layout.

https://www.admidio.org/demo/adm_progra ... photos.php

Ich habe mal ein paar Screenshots zum vergleich gemacht.

Aktuelle Version:

-


Mit Änderungen:

-


Bei meiner Installation habe ich die Größe der Vorschaubilder auf 800 Pixel gesetzt, dann habe ich gleichmäßige Ränder und hochauflösende Vorschaubilder.

[fasse]

Ah, verstehe. Du zeigst dann beim Hochkant nur einen Auschnitt an.

Bei der Albenübersicht finde ich das gut. Bei der Fotovorschau finde ich es nicht so gut, da man dort schon das komplette Bild sehen möchte.