Layout der Beta für J4

[jochene]

Hallo Christine,

vielen Dank für Deine Mühen.

Habe heute fast die ganze Zeit selber versucht das Layout zu ändern.
Mit Deinen Codes hier, schaue ich so ganz langsam hinter das CSS. Ich hatte mich bisher noch nicht damit beschäftigt.

Ich probiere mal mit dem Layout, dann wieder mit einem anderen. Es ändert sich also im Moment noch ständig.

Werde Deine Code-Vorschläge aber auf alle Falle noch ausprobieren.

Vielen vielen Dank

Liebe Grüße
Jochen

[jochene]

Hallo Christine,

habe jetzt hoffentlich meine letzte Version gefunden.

custom.css

Code: Select all

.pg-item-box-title, .pg-category-box-title {
  text-align: center;    
}

.pg-item-box-title a, .pg-category-box-title a {
  text-align: center;
}

.pg-item-box-title.image {
  display: none;    
}

.pg-item-box-icons-box {
  right: 1.06em;
  bottom: -0.55em;
}

.pg-item-box, .pg-category-box {
  background: #FAFAFA;
  border: 1px solid #E6E6E6;
  border-radius: 5px;
  box-shadow: rgba(120, 120, 120, 0.5) 1px 1px 2px 1px, rgba(240, 240, 240, 0.2) 0px 0px 7px 7px inset;
  height: 150px; 
}

.pg-item-box-title, .pg-category-box-title {
  font-size: 90%;
}

Gefällt mir schon sehr gut.

Es bleibt aber dabei, das ich die
- phocagallery.css
- simple.css
- theme_standard.css
- custom.css
aktiviert habe.
So schaut es für mich am besten aus.

Vielen Dank

Liebe Grüße
Jochen

[jochene]

Hallo Christine,

gerade fällt mir noch etwas auf.

Was keine schöne Sache bei dieser Beta ist, ist die Darstellung von "Reihenfolge, Objekte anzeigen u.s.w."
Hier kann man es sehr gut am Ende der Seite sehen:
https://www.ttc-bw-sevelen.de/gallery/1 ... chaft-2022

Bei der Gallery 4.4.3 wird die Zeile mit den Seiten unterhalb von "Reihenfolge, Objekte anzeigen" angezeigt.
Hier der Vergleich:
https://www.mfc-saturn.de/gallery/categ ... ml?start=0

Mit CSS kann ich da wohl leider nicht viel machen. Vielleicht wird dieses in der nächsten Version angepasst.

Vielen Dank

Liebe Grüße
Jochen

[christine]

Hallo Jochen,

Na wunderbar. Hast auch Code wegen "box-shadow" übernommen usw.

Darstellung: Reihenfolge usw: Hat jetzt nichts mit Beta 2 zu tun. Liegt u.a. am Template - Joomla 4 Änderungen, wie z.B. Bootstrap, Grids, Flex usw. Schaue es mir morgen an.

Gute Nacht und liebe Grüße, Christine

[jochene]

Guten Morgen Christine,

ja, habe ich, die aktuelle "custom.css" ist im Post12 zu sehen.

https://www.ttc-bw-sevelen.de/gallery

Vielen Dank

Liebe Grüße
Jochen

[christine]

Hallo Jochen,

Was keine schöne Sache bei dieser Beta ist, ist die Darstellung von "Reihenfolge, Objekte anzeigen u.s.w."
Hier kann man es sehr gut am Ende der Seite sehen:
https://www.ttc-bw-sevelen.de/gallery/1 ... chaft-2022

Bei der Gallery 4.4.3 wird die Zeile mit den Seiten unterhalb von "Reihenfolge, Objekte anzeigen" angezeigt.
Hier der Vergleich:
https://www.mfc-saturn.de/gallery/categ ... ml?start=0

Wie ich schon gestern schrieb, liegt es wohl am Template. Probier(t)e eh schon dies und das ...

Weiß nicht, woher das da kommt: <nav class="pagination__wrapper" .....
Die .navigation ul li .... scheint OK zu sein.

Müsste man ev. beim Templateersteller Allrounder (Bakual) fragen. Hast Du die aktuellste Version?

Die Seite selbst bzw. Phoca Gallery wurde diese von J 3 auf J 4 migriert oder komplett neu aufgesetzt?

Liebe Grüße
Christine

[christine]

Hallo Jochen,

Es ist noch nicht DIE Lösung, kann Dir in Moment nur das anbieten:

Code: Select all

.pagination.pagination-centered {
display: inline-block; 
width: 50%;  
}

Mobil würde es auch besser passen.

Befürchte, dass wir wahrscheinlich ein Override bräuchten ....

Liebe Grüße
Christine

[jochene]

Hallo Christine,

ich habe die Seite komplett neu aufgesetzt und nicht von J3 nach J4 migriert.
Ich habe auch die aktuelle Allrounder 4.04 auf dem System, auch alles andere im Joomla4 ist aktuell.

Habe mal gesucht und <nav class="pagination__wrapper" im Joomla4 selber gefunden:
- layouts/joomla/pagination/list.php
- layouts/joomla/pagination/links.php
Wenn ich allerdings diese beiden CSS-Dateien entferne, ändert sich an der Ansicht aber nichts.

In der template.css (Allrounder) taucht der Begriff "pagination" mehrfach auf, allerdings nicht als "pagination__wrapper".

Mit Deinem Code schaut es schon besser aus.

Danke

LG
Jochen

[jochene]

Hallo Christine,

der "pagination__wrapper" taucht wohl nur dann auf, wenn mehr als eine Seite an Bilder vorhanden sind.
https://imgur.com/PPwQBMV

Es scheint aber nichts mit dem Allrounder-Template zu tun zu haben.
Wenn ich auf das Cassiopeia-Template umschalte, ändert sich die Darstellung nicht. Die Zeile sieht genau so aus.

Wenn ich dieses einbaue

Code: Select all

.pagination {
  display: ruby;
}

.form-select {
  width: 11.2rem;
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.5;
}

schaut es am PC auch OK aus. Wenn ich das Auswahlfeld "Objekte anzeigen" seperat in der Breite bestimmen könnte wurde die Zeile auch noch schmaler werden. Im Moment nutzen "Reihenfolge" und "Objekte anzeigen" dasselbe .form-select.

Mobil habe ich es mir noch nicht angeschaut.

Liebe Grüße
Jochen

[christine]

Hallo Jochen,

ich habe die Seite komplett neu aufgesetzt und nicht von J3 nach J4 migriert.
Ich habe auch die aktuelle Allrounder 4.04 auf dem System, auch alles andere im Joomla4 ist aktuell.

Ah, OK, wollte das auch wissen.

Habe mal gesucht und <nav class="pagination__wrapper" im Joomla4 selber gefunden:
- layouts/joomla/pagination/list.php
- layouts/joomla/pagination/links.php
Wenn ich allerdings diese beiden CSS-Dateien entferne, ändert sich an der Ansicht aber nichts.

Das hatte ich auch schon probiert, aber nicht mit CSS, sondern den HTML Code.
Wenn, dann hätte ich eher beim Override in der .php Datei an ein Verschieben gedacht (diese .pagination) in andere Zeile.

Gut, dass Du auch mit Standard Template probiert hast. So kann man dies oder das ausschließen.

Diese .form-select hatte ich mir auch x-mal angesehen - dieses "ruby" halt zu wenig.
Etwas Gutes hat es ja dieser "kurze" Thread. Dass Du Dich mit CSS beschäftigst

Muss noch genau schauen plus Deine Posts.

Gerade geschaut: Nö, mobil ist es nicht gut, aber das kommt wohl durch diese: width: 11.2rem; ......

Liebe Grüße
Christine