diff options
author | Volpeon <git@volpeon.ink> | 2022-02-05 19:23:14 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-02-05 19:23:14 +0100 |
commit | 3b7e35551b499a7b8887adb068d3a80e4088b0c2 (patch) | |
tree | e8aa73b422b7d112be2a9deb00c86e3b7cc77749 /tpl/index.pug | |
parent | Added text field (diff) | |
download | iro-design-3b7e35551b499a7b8887adb068d3a80e4088b0c2.tar.gz iro-design-3b7e35551b499a7b8887adb068d3a80e4088b0c2.tar.bz2 iro-design-3b7e35551b499a7b8887adb068d3a80e4088b0c2.zip |
Added field-label
Diffstat (limited to 'tpl/index.pug')
-rw-r--r-- | tpl/index.pug | 78 |
1 files changed, 78 insertions, 0 deletions
diff --git a/tpl/index.pug b/tpl/index.pug index 7dab86f..e3918de 100644 --- a/tpl/index.pug +++ b/tpl/index.pug | |||
@@ -7,6 +7,7 @@ include objects/heading.pug | |||
7 | include objects/rule.pug | 7 | include objects/rule.pug |
8 | include objects/button.pug | 8 | include objects/button.pug |
9 | include objects/text-field.pug | 9 | include objects/text-field.pug |
10 | include objects/field-label.pug | ||
10 | 11 | ||
11 | mixin box | 12 | mixin box |
12 | +container(padX=true padY=true inPage=true theme="raised") | 13 | +container(padX=true padY=true inPage=true theme="raised") |
@@ -121,3 +122,80 @@ html | |||
121 | br | 122 | br |
122 | br | 123 | br |
123 | +text-field(value='Incorrect input' pattern='a+' required=true disabled=true) | 124 | +text-field(value='Incorrect input' pattern='a+' required=true disabled=true) |
125 | |||
126 | //----------------------------------------- | ||
127 | |||
128 | +h1-heading(level='xl')= 'Field label' | ||
129 | +rule(level='medium') | ||
130 | |||
131 | +box | ||
132 | +field-label('First name') | ||
133 | +text-field(placeholder='Placeholder') | ||
134 | br | ||
135 | br | ||
136 | +field-label('Password', 'At least 6 characters required') | ||
137 | +text-field(placeholder='Placeholder' type='password') | ||
138 | br | ||
139 | br | ||
140 | +field-label('Password', 'At least 6 characters required')(invalid=true) | ||
141 | +text-field(placeholder='Placeholder' type='password' invalid=true) | ||
142 | br | ||
143 | br | ||
144 | +field-label('First name')(disabled=true) | ||
145 | +text-field(placeholder='Placeholder' disabled=true) | ||
146 | br | ||
147 | br | ||
148 | +field-label('Password', 'At least 6 characters required')(disabled=true) | ||
149 | +text-field(placeholder='Placeholder' type='password' disabled=true) | ||
150 | br | ||
151 | br | ||
152 | +field-label('Password', 'At least 6 characters required')(invalid=true disabled=true) | ||
153 | +text-field(placeholder='Placeholder' type='password' invalid=true disabled=true) | ||
154 | |||
155 | +box | ||
156 | +field-label('First name')(align='left' labelWidth='100px') | ||
157 | +text-field(placeholder='Placeholder') | ||
158 | br | ||
159 | br | ||
160 | +field-label('Password', 'At least 6 characters required')(align='left' labelWidth='100px') | ||
161 | +text-field(placeholder='Placeholder' type='password') | ||
162 | br | ||
163 | br | ||
164 | +field-label('Password', 'At least 6 characters required')(align='left' labelWidth='100px' invalid=true) | ||
165 | +text-field(placeholder='Placeholder' type='password' invalid=true) | ||
166 | br | ||
167 | br | ||
168 | +field-label('First name')(align='left' labelWidth='100px' disabled=true) | ||
169 | +text-field(placeholder='Placeholder' disabled=true) | ||
170 | br | ||
171 | br | ||
172 | +field-label('Password', 'At least 6 characters required')(align='left' labelWidth='100px' disabled=true) | ||
173 | +text-field(placeholder='Placeholder' type='password' disabled=true) | ||
174 | br | ||
175 | br | ||
176 | +field-label('Password', 'At least 6 characters required')(align='left' labelWidth='100px' invalid=true disabled=true) | ||
177 | +text-field(placeholder='Placeholder' type='password' invalid=true disabled=true) | ||
178 | |||
179 | +box | ||
180 | +field-label('First name')(align='right' labelWidth='100px') | ||
181 | +text-field(placeholder='Placeholder') | ||
182 | br | ||
183 | br | ||
184 | +field-label('Password', 'At least 6 characters required')(align='right' labelWidth='100px') | ||
185 | +text-field(placeholder='Placeholder' type='password') | ||
186 | br | ||
187 | br | ||
188 | +field-label('Password', 'At least 6 characters required')(align='right' labelWidth='100px' invalid=true) | ||
189 | +text-field(placeholder='Placeholder' type='password' invalid=true) | ||
190 | br | ||
191 | br | ||
192 | +field-label('First name')(align='right' labelWidth='100px' disabled=true) | ||
193 | +text-field(placeholder='Placeholder' disabled=true) | ||
194 | br | ||
195 | br | ||
196 | +field-label('Password', 'At least 6 characters required')(align='right' labelWidth='100px' disabled=true) | ||
197 | +text-field(placeholder='Placeholder' type='password' disabled=true) | ||
198 | br | ||
199 | br | ||
200 | +field-label('Password', 'At least 6 characters required')(align='right' labelWidth='100px' invalid=true disabled=true) | ||
201 | +text-field(placeholder='Placeholder' type='password' invalid=true disabled=true) | ||