diff --git a/res/static/style/layout.css b/res/static/style/layout.css index f7e928e..2ed80f6 100644 --- a/res/static/style/layout.css +++ b/res/static/style/layout.css @@ -320,14 +320,36 @@ p { margin: 1em 0; } +/* Forms*/ + .form { + display: flex; + flex-direction: column; margin-left: auto; margin-right: auto; - text-align: left; - max-width: 30em; + text-align: initial; + max-width: 500px; width: 100%; } +.form>* { + display: block; + margin-left: 3px; + margin-right: 3px; +} + +.form>label { + margin-top: 1em; +} + +.form>input[type="submit"], +.form>button[type="submit"] { + align-self: end; + margin-top: 1em; +} + +/* Tables */ + table:not(.form) { border-collapse: collapse; width: 100%; @@ -344,7 +366,7 @@ table:not(.form) { min-width: 100%; } -tr:not(.form) { +tr { border-bottom: 1px var(--separator) solid; } @@ -353,16 +375,6 @@ tr>th { padding: 0.2em 0.5em; } -@media(max-width: 30em) { - - /* Forms will be stacked on small screens */ - tr.form>td { - float: left; - width: 100%; - padding: 0.5em; - } -} - pre { padding: 10px; border-bottom: 1px var(--separator) solid; @@ -416,12 +428,6 @@ details.request_patch { background-color: rgba(128, 0, 255, 0.1); } -/* Form fields */ - -.form_input { - width: 100%; -} - /* BUTTONS */ button, .button, @@ -583,7 +589,7 @@ input[type="date"] { border: none; border-radius: 6px; background: var(--input_background); - box-shadow: inset 1px 1px 2px -1px var(--shadow_color); + /* box-shadow: inset 1px 1px 2px -1px var(--shadow_color); */ padding: 3px 5px; color: var(--input_text); font-size: 1em; diff --git a/res/template/fragments/form.html b/res/template/fragments/form.html index 904bf49..6a694cc 100644 --- a/res/template/fragments/form.html +++ b/res/template/fragments/form.html @@ -21,80 +21,59 @@ {{end}} -
- {field.label}
- - - |
- {:else if field.type !== "description"}
- {field.label} | -
- {#if field.type === "text"}
-
+ {field.label}
+
+ {#if field.type === "text"}
+
+ {:else if field.type === "text_area"}
+
+ {:else if field.type === "number"}
+
+ {:else if field.type === "decimal"}
+
+ {:else if field.type === "username"}
+
+ {:else if field.type === "email"}
+
+ {:else if field.type === "current_password"}
+
+ {:else if field.type === "new_password"}
+
+ {:else if field.type === "captcha"}
+
+
+ {:else if field.type === "radio"}
+
+ {#each field.radio_values as val}
+
- {:else if field.type === "number"}
-
- {:else if field.type === "decimal"}
-
- {:else if field.type === "username"}
-
- {:else if field.type === "email"}
-
- {:else if field.type === "current_password"}
-
- {:else if field.type === "new_password"}
-
- {:else if field.type === "captcha"}
-
-
- {:else if field.type === "radio"}
- {#each field.radio_values as val}
-
- - {/each} - {/if} - |
+ value={val}
+ type="radio"
+ checked={val === field.default_value}/>
+ |
- {@html field.description} - | -|||
- - |
- |||
- {#if config.submit_red} - - {:else} - - {/if} - | -