adjust REF_M reduction configuration form layout

neutrons · Jan 16, 2025 · cc5792a · cc5792a
1 parent c91f6dd
commit cc5792a
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 11 deletions.
diff --git a/src/webmon_app/reporting/static/tables.css b/src/webmon_app/reporting/static/tables.css
@@ -114,6 +114,7 @@ thead th a:link, thead th a:visited { color: #5B4729; display: block; }
 .property_table input[type!="submit"] { width:300px; }
 .property_table th { width: 100px; vertical-align:middle;}
 .short_label { display: inline-block; text-align:right; min-width:60px; width:60px; }
+.long_label { display: inline-block; text-align:right; min-width:150px; width:150px; }
 .tiny_input input { min-width:80px; width:80px; }
 .short_input input { min-width:80px; width:150px; }
 .icon_input { min-width:10px; width:20px; }

diff --git a/src/webmon_app/reporting/templates/reduction/configuration_ref_m.html b/src/webmon_app/reporting/templates/reduction/configuration_ref_m.html
@@ -123,19 +123,19 @@
     </tr>
 
     <!-- Divider line -->
-    <td colspan="2"><hr></td>
+    <td><hr></td>
 
     <!-- Number of Peaks in the run -->
       <tr class='tiny_input'>
         <td>
-            <span class='short_label' title="Number of peaks in the run"><strong>Peak count</strong></span>
+            <span title="Number of peaks in the run"><strong>Peak count</strong></span>
             {{ options_form.peak_count }}
         </td>
     </tr>
 
 
     <!-- Divider line -->
-    <td colspan="2"><hr></td>
+    <td><hr></td>
     <tr>
         <td style="font-size: 18px; text-decoration: underline;"><strong>Peak # 1</strong></td>
     </tr>
@@ -144,7 +144,7 @@
       <tr class='tiny_input'>
         <td>
             {{ options_form.force_peak }}
-            <span class='short_label' title="You can choose to replace the ROI in the data by your own range.
+            <span title="You can choose to replace the ROI in the data by your own range.
 Check the following box if you want to define your own ROI and
 use it for peak selection."><strong>Force peak ROI</strong></span>
             <label class='short_label' for='peak_min'>Pixel<sub>min</sub></label>
@@ -191,13 +191,13 @@
 if you want to use the region on each side of the peak to estimate your background.">
                 <strong>Use side background</strong>
             </span>
-            <label for='bck_width'>Pixels on each side</label> {{ options_form.bck_width }}
+            <label class='long_label' for='bck_width'>Pixels on each side</label> {{ options_form.bck_width }}
         </td>
     </tr>
 
 
     <!-- Divider line -->
-    <td colspan="2"><hr></td>
+    <td><hr></td>
     <tr>
         <td style="font-size: 18px; text-decoration: underline;" title="Peak 2 options ignored if Peak count is 1">
             <strong>Peak # 2</strong>
@@ -208,7 +208,7 @@
       <tr class='tiny_input'>
         <td>
             {{ options_form.force_peak_s2 }}
-            <span class='short_label' title="You can choose to replace the ROI in the data by your own range.
+            <span title="You can choose to replace the ROI in the data by your own range.
 Check the following box if you want to define your own ROI and
 use it for peak selection."><strong>Force peak ROI</strong></span>
             <label class='short_label' for='peak_min_s2'>Pixel<sub>min</sub></label>
@@ -255,13 +255,13 @@
 if you want to use the region on each side of the peak to estimate your background.">
                 <strong>Use side background</strong>
             </span>
-            <label for='bck_width_s2'>Pixels on each side</label> {{ options_form.bck_width_s2 }}
+            <label class='long_label' for='bck_width_s2'>Pixels on each side</label> {{ options_form.bck_width_s2 }}
         </td>
     </tr>
 
 
     <!-- Divider line -->
-    <td colspan="2"><hr></td>
+    <td><hr></td>
     <tr>
         <td style="font-size: 18px; text-decoration: underline;" title="Peak 3 options ignored if Peak count smaller than 3">
             <strong>Peak # 3</strong>
@@ -273,7 +273,7 @@
       <tr class='tiny_input'>
         <td>
             {{ options_form.force_peak_s3 }}
-            <span class='short_label' title="You can choose to replace the ROI in the data by your own range.
+            <span title="You can choose to replace the ROI in the data by your own range.
 Check the following box if you want to define your own ROI and
 use it for peak selection."><strong>Force peak ROI</strong></span>
             <label class='short_label' for='peak_min_s3'>Pixel<sub>min</sub></label>
@@ -320,7 +320,7 @@
 if you want to use the region on each side of the peak to estimate your background.">
                 <strong>Use side background</strong>
             </span>
-            <label for='bck_width_s3'>Pixels on each side</label> {{ options_form.bck_width_s3 }}
+            <label class='long_label' for='bck_width_s3'>Pixels on each side</label> {{ options_form.bck_width_s3 }}
         </td>
     </tr>