X-Git-Url: http://git.shiar.nl/sheet.git/blobdiff_plain/f0e54f5c656399310da44b5d226931f7e150f19d..30bf0fcde3f7e44f1ec7bcfc8253dfce8f81e8e6:/word/editor.css

diff --git a/word/editor.css b/word/editor.css
new file mode 100644
index 0000000..f376935
--- /dev/null
+++ b/word/editor.css
@@ -0,0 +1,93 @@
+dl {
+	display: inline-grid;
+	grid: auto-flow / min-content repeat(10, auto);
+}
+
+form > ul {
+	display: table;
+	border-spacing: 0 2px;
+}
+form > ul > li {
+	display: table-row;
+}
+form > ul > li > * {
+	display: table-cell;
+	padding-right: .5em;
+}
+form > ul > li > label {
+	/* th */
+	text-align: right;
+}
+form > ul > li > label + * {
+	/* td */
+	width: 40em;
+}
+
+.multiinput,
+input, textarea, select {
+	box-sizing: border-box;
+	flex-grow: 1;
+}
+input:not([type=submit]), textarea {
+	padding: .4rem;
+	font-family: monospace;
+}
+input[type=number] {
+	max-width: 7em;
+}
+select {
+	padding: .3rem .2rem; /* TODO: input */
+}
+#convertpreview {
+	width: 300px;
+	align-self: start;
+	flex-shrink: 0;
+}
+
+.popup {
+	display: flex;
+	flex-wrap: wrap;
+	align-items: end;
+	position: fixed;
+	left: 0;
+	top: 0;
+	margin: auto;
+	max-height: 90%;
+	max-width: 90%;
+	overflow: auto;
+	background: rgba(0, 0, 0, .8);
+	border: 1px solid #CCC;
+}
+img.popup {
+	height: 100%; /* max assuming landscape */
+	width: auto; /* keep aspect */
+}
+
+h1 {
+	margin-bottom: 1ex;
+}
+.inline {
+	display: inline-flex;
+	align-items: baseline;
+	margin: 0 -1ex; /* inner gap */
+}
+.inline > * {
+	margin: 0 1ex;
+}
+.inline .inline {
+	display: flex;
+	margin: 0;
+}
+.inline.multiinput {
+	flex-wrap: wrap;
+}
+.multiinput > input {
+	width: 10em;
+}
+
+#nav > ul,
+#nav > ul strong,
+#nav form {
+	margin: 1ex 0;
+	display: inline-block;
+}