Loading...
Navigation überspringen
Bitte beachte, dass sich diese Dokumentation auf die neuste Version dieser Erweiterung bezieht. Wenn eine ältere Version eingesetzt wird, kann diese abweichen. Die jeweils passende Dokumentation befindet sich im Dokumentation-Verzeichnis der Erweiterung.

Bootstrap4 Migration

Folge den nächsten Migrations-Schritten um zu Bootstrap 4 zu migrieren.

  1. Label CSS-Klassen

    Alt:

    css {
        class {
            label = control-label
        }
    }

    Neu:

    css {
        class {
            label = col-form-label
        }
    }
  2. Fieldset ohne row-Klasse

    Alt:

    <fieldset class="{fieldset.css.class.fieldset}" style="{fieldset.css.style.fieldset}">
    ...
    </fieldset>
    fieldset.css.class.fieldset = row

    Neu:

    <fieldset class="{fieldset.css.class.fieldset}" style="{fieldset.css.style.fieldset}">
        <div class="{fieldset.css.class.fieldsetInner}" style="{fieldset.css.style.fieldsetInner}">
        ...
        </div>
    </fieldset>
    fieldset.css.class.fieldset =
    fieldset.css.class.fieldsetInner = row
  3. Input groups

    Alt:

    <span class="input-group-addon">
        <i class="{field.css.class.icon.calendar}"></i>
    </span>

    Neu:

    <div class="input-group-append">
        <div class="input-group-text">
            <i class="{field.css.class.icon.calendar}"></i>
        </div>
    </div>
  4. Checkboxen

    Alt:

    <label for="form-{formUid}-{fieldsetKey}-{fieldKey}">
        <f:form.checkbox value="{field.value}"
                         name="form-{formUid}-{fieldsetKey}-{fieldKey}" id="form-{formUid}-{fieldsetKey}-{fieldKey}"
                         class="{field.css.class.field}" style="{field.css.style.field}" />
        <span class="{field.css.class.notice}" style="{field.css.style.notice}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-notice"><f:format.raw>{field.notice}</f:format.raw></span>
        <span class="{field.css.class.message}" style="{field.css.style.message}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-message"></span>
    </label>

    Neu:

    <div class="{field.css.class.fieldWrapper}" style="{field.css.style.fieldWrapper}">
        <f:form.checkbox value="{field.value}"
                         name="form-{formUid}-{fieldsetKey}-{fieldKey}" id="form-{formUid}-{fieldsetKey}-{fieldKey}"
                         class="{field.css.class.field}" style="{field.css.style.field}" />
        <label class="{field.css.class.checkboxLabel}" style="{field.css.style.checkboxLabel}" for="form-{formUid}-{fieldsetKey}-{fieldKey}">
            <f:format.raw>{field.checkboxLabel}</f:format.raw>
        </label>
        <span class="{field.css.class.notice}" style="{field.css.style.notice}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-notice"><f:format.raw>{field.notice}</f:format.raw></span>
        <span class="{field.css.class.message}" style="{field.css.style.message}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-message"></span>
    </div>
  5. Hilfe-Text

    Alt:

    <span class="{field.css.class.notice}" style="{field.css.style.notice}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-notice"><f:format.raw>{field.notice}</f:format.raw></span>
    css.class.notice = help-block

    Neu:

    <small class="{field.css.class.notice}" style="{field.css.style.notice}" id="form-{formUid}-{fieldsetKey}-{fieldKey}-notice"><f:format.raw>{field.notice}</f:format.raw></small>
    css.class.notice = form-text

Kontaktanfrage

Du kannst uns jederzeit kontaktieren

Stop! Playing in the meantime?
Stop! Playing in the meantime?
Stop! Playing in the meantime?

Stop! Playing in the meantime?

Break the highscore

Press Start
Contact request
Screenreader label
Security question
_Z__________9GA______
ME_____Z____3_Y___9KO
_M____AYJ___8TU______
_J_____A____R_T___KPB
ESP_________Q9S______