diff --git a/index.html b/index.html index be009cf..6c268af 100644 --- a/index.html +++ b/index.html @@ -43,6 +43,11 @@ margin: 0.2rem 0; } + label > span { + display: inline-block; + width: 9em; + } + @media screen and (min-width: 1024px) { div.container { display: grid; diff --git a/src/main.ts b/src/main.ts index 1a63996..c367a55 100644 --- a/src/main.ts +++ b/src/main.ts @@ -114,6 +114,9 @@ const scene = sync({ const input = (label: string, attrs: any) => ["div", {}, ["label", {}, label, ["input", attrs]]] +const select = (label: string, attrs: any, options: string[]) => + ["div", {}, ["label", {}, label, ["select", attrs, ...options.map(u => ["option", {value: u}, u])]]] + $compile( ["div.container", {}, ["main", {}, @@ -133,6 +136,7 @@ $compile( value: height.deref()!, oninput: $inputNum(height), }), + select("Unit", { oninput: $input(unit) }, ["mm", "px"]), input("Grid size: ", { type: "number", min: "5",