vi-solutions
Software + Internet

Joomla 5 Mitteilung

Wir freuen uns mitteilen zu können, dass seit dem 29. Januar 2024 alle unsere Joomla Erweiterungen mit Joomla 5 kompatible sind.

Für alle die gerade noch von Joomla 3 auf 4 aktualisieren: Anleitungen für die Joomla 4 Migration gibt es hier:

Es gibt nun auch eine eigenständige Dokumentation für Visforms für Joomla 4 und für Visforms auf Joomla 5

Forum

Visforms Subscription Inhaber können in unserem Forum Fragen stellen. Bitte mit dem entsprechenden Benutzer anmelden.
Jeder kann lesend auf das Forum zugreifen.

Bitte stellen Sie nur 1 Frage pro Thema.

Fehler in Bootstrap-Implementierung? row > row

Mehr
3 Wochen 5 Tage her #10290 von ejbm
Fehler in Bootstrap-Implementierung? row > row wurde erstellt von ejbm
Hi,

wenn ich das UI-Kit auf "Bootstrap 5" (Sublayout "individuell") stelle, bekomme ich folgendes HTML als ouput:

<fieldset class="fieldset-1 active row">
    <div class="row">
        <div class="col-12  field20">
            ....

Ein Element mit der row-Klasse folgt direkt auf ein weiteres Element mit row-Klasse. Das zerschießt die Struktur, weil dann die CSS-Regel ".row > *" mehrfach angewendet wird. Fällt besonders auf kleineres Bildschirmen auf.

Mache ich hier etwas falsch, habe ich etwas übersehen? Oder stimmt es einfach so nicht?
 

Mehr
3 Wochen 5 Tage her #10300 von Administrator IV
Administrator IV antwortete auf Fehler in Bootstrap-Implementierung? row > row
Hallo ejbm,

Es gibt in der Bootstrap Dokumentation keine Stelle, an der gesagt wird, dass eine CSS-Klasse 'row' nicht direkt ein Kind mit CSS-Klasse 'row' haben darf.
Andererseits erscheint diese Situation in den Code-Beispielen für Bootstrap 5 auch nicht.

Meines Erachtens hat die CSS-Klasse 'row' vor allem den Sinn, einen Flex-Context zu erzeugen.

Bei Verwendung des Cassiopeia Templates hat das row > row keinen Einfluss.
Hier sieht nichts verschossen auf, auch nicht auf den kleinen Bildschirmen.

Wenn du da etwas komisches siehst, hat es sicher wohl auch damit zu tun, wie das CSS für das 'row>*' bei dir konkret implementiert wurde.
Bislang hat niemand sonst eine vergleichbare negative Auswirkung beschrieben.

Wir könnten nochmal genauer in das Thema rein schauen.
Aber es wäre ziemlich undankbar, schon allein wegen der fehlenden klaren Aussagen in der Bootstrap Dokumentation.

Und wenn wir das jetzt umstellen würden, dann betrifft das alle anderen Installationen von Visforms gleichermaßen.
Und absehbar haben dann auf einmal ganz viele, nämlich alle bei denen es jetzt gut aussieht, in der Folge damit ein Problem.

Liebe Grüße, Ingmar
:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).

Mehr
3 Wochen 5 Tage her #10303 von ejbm
ejbm antwortete auf Fehler in Bootstrap-Implementierung? row > row
Hallo Ingmar!

Danke für die rasche Antwort.

Jetzt war ich neugierig und habe es mal in reinem Bootstrap probiert, um das Template als Fehlerquelle auszuschließen – ergibt das gleiche Problem (Minimalbiespiel unten). Das gleiche in Cassiopeia (siehe Screenshot, auf den Abstand rechts achten).

Soweit ich es verstehe, ist der Grund, dass die row-Klasse mit negativen margins arbeitet.

 

---
<body>
<div class="container">
<div class="row">
<div class="row">
<div class="col-md-12 bg-primary">
<p>Paragraph</p>
</div>
</div>
</div>
</div>
</body>

Mehr
3 Wochen 2 Tage her #10314 von Administrator AV
Administrator AV antwortete auf Fehler in Bootstrap-Implementierung? row > row
Hallo ejbm,

danke für die Illustration.
Ja, das row > row macht den effektiven Platz, den die Label, Controls etc einnehmen können auf der rechten Seite etwas kleiner.
Dieser kleine Unterschied ist offensichtlich noch nie irgend jemand aufgefallen.
Zumindest nicht so, dass es als ein Fehler angesehen und gepostet wurde.

Da der rechte Rand ja ohnehin nicht immer überall fluchtet ist der Effekt ohne Hintergrundfarbe eher schwer zu erkennen.
Aufgrund deiner ursprünglichen Beschreibung hatte ich irgendwie einen sehr viel deutlicher sichtbaren Effekt erwartet :-).
Deshalb die Vermutung, es würde am CSS deines Templates liegen.

Da ich in der Bootstrap Dokumentation keinen Aussage dazu gefunden habe, ob row > row nicht erlaubt ist,
weiß ich auch wirklich nicht, ob das ein Fehler ist.
Hast du hierzu etwas in der Bootstrap Dokumenation gelesen?

Herzliche Grüße,
Aicha
:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).

Mehr
3 Wochen 2 Tage her - 3 Wochen 2 Tage her #10316 von ejbm
ejbm antwortete auf Fehler in Bootstrap-Implementierung? row > row
Hallo Aicha,

danke für die Rückmeldung.

Es gibt in der Bootstrap-Doku den Satz

Content should be placed within columns, and only columns may be immediate children of rows.

Das bezieht sich auf Bootstrap 3.4 – scheint aber noch zu gelten. Quelle: getbootstrap.com/docs/3.4/css/

In der Doku für 5.3 findet sich

Rows are wrappers for columns. Each column has horizontal padding (called a gutter) for controlling the space between them. This padding is then counteracted on the rows with negative margins to ensure the content in your columns is visually aligned down the left side.

Quelle: getbootstrap.com/docs/5.3/layout/grid/

Unten noch ein Beispiel von einer Website, in der das Problem ziemlich deutlich wird. Wäre klasse, wenn ihr das fixen könntet.

 
Letzte Änderung: 3 Wochen 2 Tage her von ejbm.

Mehr
2 Wochen 6 Tage her - 2 Wochen 5 Tage her #10333 von Administrator AV
Administrator AV antwortete auf Fehler in Bootstrap-Implementierung? row > row
Hallo ejbm,

vielen Dank für deinen tolle Input!

Ich habe dazu einen Bugfix-Issue angelegt:
Issue [VF-1079] Forum: Bootstrap 5 Layout: Prevent row > row
Wenn wir den Bug-Fix releasen, wirst du explizit über das Release hier im Thema informiert.

Die Änderung ist bereits implementiert und in allen nächsten Release (4.4.3, 5.0.2 und 5.1.0) enthalten.

Im Prinzip kannst du die Änderungen in deiner Installation manuell einfügen.

Geändert wurden 4 Dateien.

In Visforms 4.4.3 sieht die Änderung gegenüber 4.4.2 so aus.
components/com_visforms/tmpl/visforms/default_bt5.php Zeile 33
Alt:
Code:
echo '<fieldset class="fieldset-' . $f . $active . ' row">';
Neu:
Code:
echo '<fieldset class="fieldset-' . $f . $active . '">';
Entfernt wurde als das 'row' vor dem ">';

Und analog in
components/com_visforms/tmpl/edit/edit_bt5.php
plugins/content/vfformview/tmpl/default_bt5.php Zeile 32
modules/mod_visforms/tmpl/default_bt5.php Zeile 42

In Visforms 5.0.2 sieht sie gegenüber 5.0.1 so aus

components/com_visforms/tmpl/visforms/default_bt5.php Zeile 33

Alt:
Code:
echo '<fieldset class="fieldset-' . $f . $active . $this->visforms->mpforcusclass . ' row">';
Neu:
Code:
echo '<fieldset class="fieldset-' . $f . $active . $this->visforms->mpforcusclass . '">';

Und analog in
components/com_visforms/tmpl/edit/edit_bt5.php Zeile 34
plugins/content/vfformview/tmpl/default_bt5.php Zeile 32

In
modules/mod_visforms/tmpl/default_bt5.php Zeile 42
Alt:
Code:
echo '<fieldset class="fieldset-' . $f . $active . $visforms->mpforcusclass . ' row">';
Neu:
Code:
echo '<fieldset class="fieldset-' . $f . $active . $visforms->mpforcusclass . '">';

Herzliche Grüße,
Aicha
:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).
Letzte Änderung: 2 Wochen 5 Tage her von Administrator IV.

Moderatoren: Administrator AV, Administrator IV
Powered by Kunena Forum

Visforms Subscription

Visforms Erweiterungen

Nützliche Erweiterung, die Visforms ergänzen und mit denen Sie Ihre Formulare nicht nur mit wenig Aufwand perfekt in die Funktionalität Ihrer Webseite integrieren können sondern die Visforms auch ganz neue Anwendungsbereiche erschließen können.

Info