{% macro header_with_save_button(heading) %}
	<div class="container">
		<div class="cols">
			<div class="col col-9">
				<h1>{{heading}}</h1>
			</div>
			<div class="col col-3 text-right">
				<button type="submit" class="btn btn-primary">
					<i class="icon icon-check"></i>Save
				</button>
			</div>
		</div>
	</div>
{% endmacro input %}

{% macro text(name, label, value) %}
	<div class="form-group cols">
		<div class="col-3 pl-2">
			<label class="form-label" for="{{name}}">{{label}}</label>
		</div>
		<div class="col-9 pr-2">
			<input type="text" class="form-input input-inline" id="{{name}}" name="{{name}}" value="{{value}}" autocomplete="off">
		</div>
	</div>
{% endmacro input %}

{% macro integer(name, label, value) %}
<div class="form-group cols">
	<div class="col-3 pl-2">
		<label class="form-label" for="{{name}}">{{label}}</label>
	</div>
	<div class="col-9 pr-2">
		<input type="number" step="1" class="form-input input-inline" id="{{name}}" name="{{name}}" value="{{value}}" autocomplete="off">
	</div>
</div>
{% endmacro input %}

{% macro checkbox(name, label, checked) %}
	<div class="form-group cols">
		<div class="col-3 pl-2">
			<label class="form-label" for="{{name}}">{{label}}</label>
		</div>
		<div class="col-9 pr-2">
			<label class="form-switch input-inline">
				<input type="checkbox" id="{{name}}" name="{{name}}" value="true" autocomplete="off" {{opt(checked=checked)}}>
				<i class="form-icon"></i>
			</label>
		</div>
	</div>
{% endmacro input %}