[Kimchi-devel] [PATCH] Assign HTML labels to their corresponding elements

[Crístian Viana]

Somea UI form fields have labels which aren't assigned to those fields,
which makes it more difficult to click and interact with them.

Assign the labels to their corresponding elements, so when the user
clicks on a label, the element also receives the click event. Also, some
indentation levels have been changed.

The elements which have their labels assigned to are:

- The text box where the user types the file path in "New Template" >
"Local image file";
- All form elements in "Templates" > "Actions" > "Edit", tab
"Processor";
- The checkbox used to select a device in "Storage pools" > "Actions" >
"Extend";

Signed-off-by: Crístian Viana <vianac at linux.vnet.ibm.com>
---
 ui/pages/tabs/storage.html.tmpl  |  2 +-
 ui/pages/template-add.html.tmpl  |  4 +++-
 ui/pages/template-edit.html.tmpl | 20 ++++++++++++++++----
 3 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl
index dbbaef9..6af7327 100644
--- a/ui/pages/tabs/storage.html.tmpl
+++ b/ui/pages/tabs/storage.html.tmpl
@@ -128,7 +128,7 @@
 </script>
 <script id="logicalPoolExtendTmpl" type="html/text">
     <div>
-        <input type="checkbox" value="{path}" name="devices">
+        <input type="checkbox" value="{path}" name="devices" id="{name}">
         <label for="{name}">{path}</label>
     </div>
 </script>
diff --git a/ui/pages/template-add.html.tmpl b/ui/pages/template-add.html.tmpl
index eaafaa7..3b82c6c 100644
--- a/ui/pages/template-add.html.tmpl
+++ b/ui/pages/template-add.html.tmpl
@@ -130,7 +130,9 @@
                     <h2 class="step-title">$_("Local Image File")</h2>
                 </header>
                 <div class="body">
-                    <span>File Path:</span><input type="text"><button class="ui-button-primary">$_("Create")</button>
+                    <label for="vm-image-local-text">File Path:</label>
+                    <input type="text" id="vm-image-local-text" />
+                    <button class="ui-button-primary">$_("Create")</button>
                 </div>
             </div>
 
diff --git a/ui/pages/template-edit.html.tmpl b/ui/pages/template-edit.html.tmpl
index 7177bf0..3a84870 100644
--- a/ui/pages/template-edit.html.tmpl
+++ b/ui/pages/template-edit.html.tmpl
@@ -118,11 +118,23 @@
                 <div class="template-tab-body"></div>
             </form>
             <form id="form-template-processor">
-                <div>$_("CPU Number"):<input type="text" value="1" id="cpus"></div>
-                <div class="manual"><input type="checkbox">$_("Manually set CPU topology")</div>
+                <div>
+                    <label for="cpus">$_("CPU Number"):</label>
+                    <input type="text" value="1" id="cpus" />
+                </div>
+                <div class="manual">
+                    <input type="checkbox" id="cpus-check" />
+                    <label for="cpus-check">$_("Manually set CPU topology")</label>
+                </div>
                 <div class="topology hide">
-                    <div>$_("Cores"):<input type="text" value="1"  id="cores"></div>
-                    <div>$_("Threads"):<select id="threads"></select></div>
+                    <div>
+                        <label for="cores">$_("Cores"):</label>
+                        <input type="text" value="1" id="cores" />
+                    </div>
+                    <div>
+                        <label for="threads">$_("Threads"):</label>
+                        <select id="threads"></select>
+                    </div>
                 </div>
             </form>
         </div>
-- 
2.1.0