aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorAaron LI <aaronly.me@outlook.com>2016-11-23 20:40:53 +0800
committerAaron LI <aaronly.me@outlook.com>2016-11-23 20:40:53 +0800
commita3474a7877c4502d79d2eba65794527966197c72 (patch)
tree52e50ca639cf2ceae40945f8c4d0866d7a7d0cb4
parente61c373c992245c06434230cb489fb127a87f2fd (diff)
downloadfg21sim-a3474a7877c4502d79d2eba65794527966197c72.tar.bz2
webui: configs.html: Improve the form layout and styles
-rw-r--r--fg21sim/webui/static/css/main.css8
-rw-r--r--fg21sim/webui/templates/configs.html74
2 files changed, 49 insertions, 33 deletions
diff --git a/fg21sim/webui/static/css/main.css b/fg21sim/webui/static/css/main.css
index 67f324b..aecb48d 100644
--- a/fg21sim/webui/static/css/main.css
+++ b/fg21sim/webui/static/css/main.css
@@ -221,7 +221,7 @@ label, legend {
.form-inline .form-control {
display: inline-block;
width: auto;
- margin-bottom: 0;
+ margin-bottom: 0.3rem;
vertical-align: middle;
}
.form-inline .checkboxes {
@@ -230,6 +230,12 @@ label, legend {
vertical-align: middle;
}
+input[type="radio"],
+input[type="checkbox"] {
+ margin-left: 0.5rem;
+ margin-right: 0.5rem;
+}
+
/* Checkboxes & Radios */
.checkboxes .legend,
.radios .legend {
diff --git a/fg21sim/webui/templates/configs.html b/fg21sim/webui/templates/configs.html
index 3fee24e..a7a8f43 100644
--- a/fg21sim/webui/templates/configs.html
+++ b/fg21sim/webui/templates/configs.html
@@ -67,13 +67,17 @@
</div>
</div>
<div class="row">
- <div class="column column-50 form-group">
- <label for="conf-common-lmin">Multipole <i>l</i><sub>min</sub>:</label>
- <input class="form-control" type="number" id="conf-common-lmin" name="common/lmin" min="0" required />
- </div>
- <div class="column column-50 form-group">
- <label for="conf-common-lmax">Multipole <i>l</i><sub>max</sub>:</label>
- <input class="form-control" type="number" id="conf-common-lmax" name="common/lmax" min="1" required />
+ <div class="column">
+ <span>Power Spectrum Multiple:</span>
+ <div class="form-group">
+ <label class="sr-only" for="conf-common-lmin">Multipole <i>l</i><sub>min</sub>:</label>
+ <input class="form-control" type="number" id="conf-common-lmin" name="common/lmin" min="0" title="Minimum multipole" required />
+ </div>
+ <span> &mdash; </span>
+ <div class="form-group">
+ <label class="sr-only" for="conf-common-lmax">Multipole <i>l</i><sub>max</sub>:</label>
+ <input class="form-control" type="number" id="conf-common-lmax" name="common/lmax" min="1" title="Maximum multipole" required />
+ </div>
</div>
</div>
<div class="row">
@@ -345,17 +349,19 @@
</h5>
<div class="body">
<div class="row">
- <div class="column column-40 form-group">
- <label for="conf-g-synchrotron-template">Template Map:</label>
- <input class="form-control code" type="text" id="conf-g-synchrotron-template" name="galactic/synchrotron/template" required />
- </div>
- <div class="column column-30 form-group">
- <label for="conf-g-synchrotron-template-freq">Frequency:</label>
- <input class="form-control" type="number" id="conf-g-synchrotron-template-freq" name="galactic/synchrotron/template_freq" placeholder="MHz" step="any" min="0" required />
- </div>
- <div class="column column-30 form-group">
- <label for="conf-g-synchrotron-template-unit">Unit:</label>
- <input class="form-control" type="text" id="conf-g-synchrotron-template-unit" name="galactic/synchrotron/template_unit" required />
+ <div class="column">
+ <div class="form-group">
+ <label for="conf-g-synchrotron-template">Template Map:</label>
+ <input class="form-control code" type="text" id="conf-g-synchrotron-template" name="galactic/synchrotron/template" required />
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="conf-g-synchrotron-template-freq">Frequency:</label>
+ <input class="form-control" type="number" id="conf-g-synchrotron-template-freq" name="galactic/synchrotron/template_freq" placeholder="frequency (MHz)" step="any" min="0" required />
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="conf-g-synchrotron-template-unit">Unit:</label>
+ <input class="form-control" type="text" id="conf-g-synchrotron-template-unit" name="galactic/synchrotron/template_unit" placeholder="unit" required />
+ </div>
</div>
</div>
<div class="row">
@@ -400,23 +406,27 @@
</h5>
<div class="body">
<div class="row">
- <div class="column column-40 form-group">
- <label for="conf-g-freefree-halphamap">Hα Template Map:</label>
- <input class="form-control code" type="text" id="conf-g-freefree-halphapam" name="galactic/freefree/halphamap" required />
- </div>
- <div class="column column-30 form-group">
- <label for="conf-g-freefree-halphamap-unit">Unit:</label>
- <input class="form-control" type="text" id="conf-g-freefree-halphamap-unit" name="galactic/freefree/halphamap_unit" required />
+ <div class="column">
+ <div class="form-group">
+ <label for="conf-g-freefree-halphamap">Hα Template Map:</label>
+ <input class="form-control code" type="text" id="conf-g-freefree-halphapam" name="galactic/freefree/halphamap" required />
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="conf-g-freefree-halphamap-unit">Unit:</label>
+ <input class="form-control" type="text" id="conf-g-freefree-halphamap-unit" name="galactic/freefree/halphamap_unit" placeholder="unit" required />
+ </div>
</div>
</div>
<div class="row">
- <div class="column column-40 form-group">
- <label for="conf-g-freefree-dustmap">Dust Template Map:</label>
- <input class="form-control code" type="text" id="conf-g-freefree-dustmap" name="galactic/freefree/dustmap" required />
- </div>
- <div class="column column-30 form-group">
- <label for="conf-g-freefree-dustmap-unit">Unit:</label>
- <input class="form-control" type="text" id="conf-g-freefree-dustmap-unit" name="galactic/freefree/dustmap_unit" required />
+ <div class="column">
+ <div class="form-group">
+ <label for="conf-g-freefree-dustmap">Dust Template Map:</label>
+ <input class="form-control code" type="text" id="conf-g-freefree-dustmap" name="galactic/freefree/dustmap" required />
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="conf-g-freefree-dustmap-unit">Unit:</label>
+ <input class="form-control" type="text" id="conf-g-freefree-dustmap-unit" name="galactic/freefree/dustmap_unit" placeholder="unit" required />
+ </div>
</div>
</div>
<div class="row">