{{define "widgets"}}
<!DOCTYPE html>
<html lang="en">
	<head>
		{{template "meta_tags" "Free file sharing service"}}
		{{template "user_style" .}}
	</head>
	<body>
		{{template "page_top" .}}
		<img id="header_image" class="header_image" src="/res/img/header_neuropol.png" alt="Header image"/>
		<br/>
		<div class="page_content"><div class="limit_width">
			<h1>Widget showcase</h1>
			<h2>Size 2 header</h2>
			<h3>Size 3 header</h3>
			<h4>Size 4 header</h4>
			<h5>Size 5 header</h5>
			<h6>Size 6 header</h6>

			<div class="highlight_dark">Dark highlight</div>
			<div class="highlight_middle">Middle highlight</div>
			<div class="highlight_light">Light highlight</div>
			<div class="highlight_lighter">Lighter highlight</div>
			<br/>
			Link <a href="#">A link to someplace</a>.
			<hr/>
			Buttons <button>Regular ol' button!</button>
			Width indicator
			<button class="button_highlight">Important button!</button>
			Width indicator
			<button class="button_red">Dangerous button!</button>
			<hr/>
			Textarea <textarea>Hello!</textarea>
			<hr/>
			Checkbox <input type="checkbox"/>
			<hr/>
			Radio
			<input name="radioform" type="radio"/>
			<input name="radioform" type="radio"/>
			<hr/>
			Text field <input type="text"/>
			<hr/>
			Password <input type="password"/>
			<hr/>
			Number <input type="number"/>
			<hr/>
			Select
			<select name="select">
				<option>cherry</option>
				<option>orange</option>
				<option>apple</option>
			</select>
			<hr/>
			Select2 <select name="select2" size="3">
				<option>cherry</option>
				<option>orange</option>
				<option>apple</option>
			</select>
			<hr/>
			File <input type="file" name="file">
			<hr/>
			Color <input type="color" name="favcolor" value="#ff0000">

			<br/><br/>
			<iframe src="https://pixeldrain.com/u/Nygt1on4?embed" style="border: none; width: 640px; max-width: 100%; height: 480px; border-radius: 6px;"></iframe>
		</div></div>
		{{template "page_bottom" .}}
	</body>
</html>
{{end}}
