yard-calc.imba

global css html
	ff:sans

let width = 0
let length = 0
let depth = 3

tag yard-calc

	css .yard-calc
		w: 100%
		label 
			d: block
			mb: 5px
		input
			d: block
			w: 100%

	def yards width, length, depth
		y = width/3 * length/3 * depth/36
		y.toFixed(2)

	<self>
		<header>
			<div.yard-calc>
				<p>
					<label> "Width" 
					<input type="text" bind=width>
				<p>
					<label> "Length"
					<input type="text" bind=length>
				<p>
					<label> "Depth"
					<input type="text" bind=depth>
				<p style="text-align: center;">
					<label> "{yards width, length, depth} Yards"

imba.mount <yard-calc>