css modules classname

example.js

import styles from './styles.less';
const render = (state) => h('form', {props: {className: [styles.form, styles.formHorizontal].join(' ')}}, [
	h('fieldset', [
		// show alerts if there's any
		state.alerts.length ? h('div.alerts',
			state.alerts.map(alert => h(`div.alert.${alert.className}`, alert.text))
		) : '',
		h(`legend.${styles.legend}`, 'Login'),
		h(`div.${styles.field}`, [
			h(`label`, 'Email'),
			h(`div`, [
				h('input#email', {props: {type: 'email', name: 'email', className: styles.control}})
			])
		]),
		h(`div.${styles.field}`, [
			h(`label`, 'Password'),
			h(`div`, [
				h('input#password', {props: {type: 'password', name: 'password', className: styles.control}})
			])
		]),
		h(`div`, [
			h(`button.${styles.submit}.${styles.block}`, {props: {type: 'button', disabled: state.submitting}}, [
				state.submitting
					? h(`i`, {props: {className: [
						styles.fa,
						styles.faSpinner,
						styles.faSpin
					].join(' ')}})
					: h(`i`, {props: {className: [
						styles.fa,
						styles.faSignIn
					].join(' ')}}),
				state.submitting ? ' Logging in...' : ' Login'
			])
		])
	])
]);
const LoginForm = (state) => {DOM: render(state)};
exports default LoginForm;