51751ABB-5214-4D7F-AB7F-8A7599AC7751 Created with sketchtool.

Search form

100% 
<form class="o-form o-form--search">
    <div class="grid-x grid-margin-x">
        <div class="cell large-8 medium-8 small-8">
            <div class="o-form__field">
                <div class="o-form__fluid">
                    <input title="" type="text" class="o-form__input o-form__input--text " placeholder="Bitte ausfüllen" aria-describedby="input-01" required>
                </div>
                <span class="o-form__status o-form__status--warning">
          
        </span>
                <span class="o-form__info" id="input-01"></span>
            </div>
        </div>
        <div class="cell large-4 medium-4 small-4">
            <input type="submit" class="o-form__input c-button c-button--full" value="Suchen">
        </div>
    </div>
    <div id="kesearch_filters" class="o-searchfacets">
        <div class="grid-x">
            <div class="cell small-6">
                <fieldset class="o-form__field">
                    <legend class="u-h5">Facette 1</legend>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_author" id="f1_1">
                    <label class="o-form__label o-form__label--checkbox" for="f1_1">
                            Autoren</label>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_nws" id="f1_2">
                    <label class="o-form__label o-form__label--checkbox" for="f1_2">
                            News</label>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_pg" id="f1_3">
                    <label class="o-form__label o-form__label--checkbox" for="f1_3">
                            Seiten</label>
                </fieldset>
            </div>
            <div class="cell small-6">
                <fieldset class="o-form__field">
                    <legend class="u-h5">Facette 2</legend>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_24h" id="f2_1">
                    <label class="o-form__label o-form__label--checkbox" for="f2_1">
                            Letzte 24 Stunden</label>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_7d" id="f2_2">
                    <label class="o-form__label o-form__label--checkbox" for="f2_2">
                            Letzte Woche</label>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_30d" id="f2_3">
                    <label class="o-form__label o-form__label--checkbox" for="f2_3">
                            Letzter Monat</label>
                    <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox" value="idx_old" id="f2_4">
                    <label class="o-form__label o-form__label--checkbox" for="f2_4">
                            Älter</label>
                </fieldset>
            </div>
        </div>
    </div>
</form>
 
<form class="o-form o-form--search">
    <div class="grid-x grid-margin-x">
        <div class="cell large-8 medium-8 small-8">
            {% render '@input' with {
                input: {
                    type: 'search',
                    placeholder: 'Was suchen Sie?',
                    title: 'Suche',
                },
                label: false,
            } %}
        </div>
        <div class="cell large-4 medium-4 small-4">
            {% render '@submit' with {
                label: 'Suchen',
            } %}
        </div>
    </div>
    <div id="kesearch_filters" class="o-searchfacets">
        <div class="grid-x">
            <div class="cell small-6">
                <fieldset class="o-form__field">
                    <legend class="u-h5">Facette 1</legend>
                    {% for item in facet1 %}
                        <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox"
                               value="{{ item.value }}"
                               id="{{ item.id }}"{% if (loop.first and required) %} required{% endif %}>
                        <label class="o-form__label o-form__label--checkbox" for="{{ item.id }}">
                            {{ item.label }}</label>
                    {% endfor %}
                </fieldset>
            </div>
            <div class="cell small-6">
                <fieldset class="o-form__field">
                    <legend class="u-h5">Facette 2</legend>
                    {% for item in facet2 %}
                        <input class="o-form__input o-form__input--checkbox o-form__input--hidden" type="checkbox"
                               value="{{ item.value }}"
                               id="{{ item.id }}"{% if (loop.first and required) %} required{% endif %}>
                        <label class="o-form__label o-form__label--checkbox" for="{{ item.id }}">
                            {{ item.label }}</label>
                    {% endfor %}
                </fieldset>
            </div>
        </div>
    </div>
</form>
 
{
  "facet1": [
    {
      "label": "Autoren",
      "id": "f1_1",
      "value": "idx_author"
    },
    {
      "label": "News",
      "id": "f1_2",
      "value": "idx_nws"
    },
    {
      "label": "Seiten",
      "id": "f1_3",
      "value": "idx_pg"
    }
  ],
  "facet2": [
    {
      "label": "Letzte 24 Stunden",
      "id": "f2_1",
      "value": "idx_24h"
    },
    {
      "label": "Letzte Woche",
      "id": "f2_2",
      "value": "idx_7d"
    },
    {
      "label": "Letzter Monat",
      "id": "f2_3",
      "value": "idx_30d"
    },
    {
      "label": "Älter",
      "id": "f2_4",
      "value": "idx_old"
    }
  ]
}

There are no notes for this item.