Errors

.container
	.row
		+form('standard')
			+field().has-single-err
				+label('email') E-mail
				+input()(value="bad.email.com")
				+field-error()
					+field-msg
						| There's something wrong with the stuff here

.container
	.row
		+form('standard')
			+field().has-single-err
				+label('country') Country
				+select('country', null, {
					bn: 'Bangladesh',
					lk: 'Sri Lanka',
					gh: 'Ghana'
				}, 'Country')
				+field-error()
					+icon('lg', 'warning')
					+field-msg.off-xs
						| Something is messed up, yo.
					+sprite('web', 'warning-white')
					+field-msg.on-xs
						| Something is messed up, yo.

.container
	.row
		+form('standard')
			+field('inline').has-group-err
				+label() I am a
				+label()
					+radio('being', 'robot', null, 'robot')
					| Robot
				+label()
					+radio('being', 'human', null, 'robot')
					| Human
				+field-error()
					+field-msg
						| You must select an option that is not robot or human. Good luck.

.container
	.row
		+form('standard')
			+field('list').has-group-err
				+label() Fruits
				+label()
					+checkbox('fruits[]', 'banana', null, ['apple', 'pear'])
					| Banana
				+label()
					+checkbox('fruits[]', 'apple', null, ['apple', 'pear'])
					| Apple
				+label()
					+checkbox('fruits[]', 'pear', null, ['apple', 'pear'])
					| Pear
				+field-tooltip()
					| This tooltip should not appear since tooltips can not co-exist with errors!
				+field-error()
					+icon('lg', 'warning')
					+field-msg.off-xs
						| You need to eat more fruits on a daily basis. Let's make this message really long so it wraps. Wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap.
					+sprite('web', 'warning-white')
					+field-msg.on-xs
						| You need to eat more fruits on a daily basis. Let's make this message really long so it wraps. Wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap wrap.

.container
	.row
		+form('standard')
			+field().has-single-err
				+selector('bar', 'Closed Selector')
					+selector-option('bar', 'a')
						| First item
					+selector-option('bar', 'b')
						| Second item
				+field-tooltip()
					| This tooltip should not show!
				+field-error()
					+field-msg
						| You gotta choose something else here, dude

.container
	.row
		+form('standard')
			+field('inline').has-group-err
				+label('price') Price
				+input('price')(placeholder='Price')
				+select('currency', null, [
					{
						key: 'USD',
						label: '$'
					},
					{
						key: 'SEK',
						label: 'kr.'
					}
				])
				+label()
					+checkbox('negotiable[]', 'negotiable', null, [])
					| Negotiable
				+field-tooltip()
					| This tooltip should not appear since tooltips can not co-exist with errors!
				+field-error()
					+icon('lg', 'warning')
					+field-msg.off-xs
						| Some kind of group error message here. This message is kinda long too, to see how this looks when the text wraps. Hopefully this is enough text to make the error message wrap on all platforms.
					+sprite('web', 'warning-white')
					+field-msg.on-xs
						| Some kind of group error message here. This message is kinda long too, to see how this looks when the text wraps. Hopefully this is enough text to make the error message wrap on all platforms.