OFRAG Frontend Components Library v0.0.0

Date Picker Range: With Helper Dark 

<div class="date-picker-range--dark">
    <div class="date-picker-range__container">

        <div class="text-field--dark date-picker--dark is-initialized" data-disable-text-field-js data-language="" data-format="" data-min-date="" data-max-date="">
            <div class="text-field__wrapper date-picker__wrapper">
                <input class="text-field__input date-picker__input" id="from" type="text" name="date&#x5B;from&#x5D;" />
                <label class="text-field__label date-picker__label" for="from">From</label>
                <button type="reset" class="date-picker__reset"></button>
            </div>
            <div class="text-field__helper date-picker__helper">
                <div class="text-field__helper--text date-picker__text">Please note that this form field has a helper text</div>
            </div>

        </div>

        <div class="text-field--dark date-picker--dark is-initialized" data-disable-text-field-js data-language="" data-format="" data-min-date="" data-max-date="">
            <div class="text-field__wrapper date-picker__wrapper">
                <input class="text-field__input date-picker__input" id="to" type="text" name="date&#x5B;to&#x5D;" />
                <label class="text-field__label date-picker__label" for="to">To</label>
                <button type="reset" class="date-picker__reset"></button>
            </div>
            <div class="text-field__helper date-picker__helper">
                <div class="text-field__helper--text date-picker__text">Please note that this form field has a helper text</div>
            </div>

        </div>
    </div>
</div>
 
{% include '@SharedComponents/modules/shared/components/form-components/date-picker-range/date-picker-range.twig' %}
 
{
  "from": {
    "minDate": "",
    "maxDate": "",
    "language": "",
    "format": "",
    "id": "from",
    "name": "date[from]",
    "label": "From",
    "value": "",
    "required": false,
    "disabled": false,
    "type": "text",
    "autocomplete": "",
    "error": "",
    "helper": "Please note that this form field has a helper text"
  },
  "to": {
    "minDate": "",
    "maxDate": "",
    "language": "",
    "format": "",
    "id": "to",
    "name": "date[to]",
    "label": "To",
    "value": "",
    "required": false,
    "disabled": false,
    "type": "text",
    "autocomplete": "",
    "error": "",
    "helper": "Please note that this form field has a helper text"
  },
  "variant": "dark"
}
  • Content: 
    @import "~shared/base";
@import "~cando-cx-components-library/components/modules/shared/components/form-components/date-picker-range/date-picker-range";
  • URL: /components/raw/date-picker-range/date-picker-range.scss
  • Filesystem Path: src/components/modules/shared/components/form-components/date-picker-range/date-picker-range.scss
  • Size: 152 Bytes

No notes defined.