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
SYC_________D________
O______J____T_Q___L2Z
XBM___FFC___Q5Z______
3_4____S______9___CK8
Q61___________Q______