UNPKG

1.88 kBtext/x-handlebars-templateView Raw
1<!--
2 Copyright IBM Corp. 2016, 2018
3
4 This source code is licensed under the Apache-2.0 license found in the
5 LICENSE file in the root directory of this source tree.
6-->
7
8<!-- Basic with calendar -->
9<div class="{{@root.prefix}}--form-item">
10 <div data-date-picker data-date-picker-type="single"
11 class="{{@root.prefix}}--date-picker {{@root.prefix}}--date-picker--single {{@root.prefix}}--date-picker--light">
12 <div class="{{@root.prefix}}--date-picker-container">
13 <label for="date-picker-3" class="{{@root.prefix}}--label">Date Picker label</label>
14 <div class="{{@root.prefix}}--date-picker-input__wrapper">
15 <input type="text" id="date-picker-3" class="{{@root.prefix}}--date-picker__input"
16 pattern="\d{1,2}/\d{1,2}/\d{4}" placeholder="mm/dd/yyyy" data-date-picker-input />
17 {{ carbon-icon 'Calendar16' class=(add @root.prefix '--date-picker__icon') data-date-picker-icon="true" }}
18 </div>
19 </div>
20 </div>
21</div>
22
23<!-- Basic with calendar -->
24<div class="{{@root.prefix}}--form-item">
25 <div data-date-picker data-date-picker-type="single"
26 class="{{@root.prefix}}--date-picker {{@root.prefix}}--date-picker--single {{@root.prefix}}--date-picker--light">
27 <div class="{{@root.prefix}}--date-picker-container">
28 <label for="date-picker-3" class="{{@root.prefix}}--label">Date Picker label</label>
29 <div class="{{@root.prefix}}--date-picker-input__wrapper">
30 <input data-invalid type="text" id="date-picker-3" class="{{@root.prefix}}--date-picker__input"
31 pattern="\d{1,2}/\d{1,2}/\d{4}" placeholder="mm/dd/yyyy" data-date-picker-input />
32 {{ carbon-icon 'Calendar16' class=(add @root.prefix '--date-picker__icon') data-date-picker-icon="true" }}
33 </div>
34 <div class="{{@root.prefix}}--form-requirement">
35 Invalid date format.
36 </div>
37 </div>
38 </div>
39</div>
40
\No newline at end of file