2:50 a.m.
Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com>
---
ui/css/theme-default/base.css | 4 ++++
ui/css/theme-default/button.css | 5 ++++
ui/css/theme-default/repository-edit.css | 2 --
ui/pages/guest-add.html.tmpl | 9 +++++---
ui/pages/report-add.html.tmpl | 1 +
ui/pages/report-rename.html.tmpl | 1 +
ui/pages/repository-add.html.tmpl | 15 ++++++++----
ui/pages/storagepool-add-volume.html.tmpl | 8 ++++---
ui/pages/storagepool-add.html.tmpl | 38 +++++++++++++++++++------------
9 files changed, 55 insertions(+), 28 deletions(-)
diff --git a/ui/css/theme-default/base.css b/ui/css/theme-default/base.css
index bbcefbb..1104f55 100644
--- a/ui/css/theme-default/base.css
+++ b/ui/css/theme-default/base.css
@@ -66,3 +66,7 @@ html, body {
.light {
font-weight: lighter;
}
+
+.help-inline {
+ display: inline-block;
+}
\ No newline at end of file
diff --git a/ui/css/theme-default/button.css b/ui/css/theme-default/button.css
index b0589f3..3bd49c0 100644
--- a/ui/css/theme-default/button.css
+++ b/ui/css/theme-default/button.css
@@ -440,6 +440,11 @@
cursor: pointer;
}
+.btn-normal span {
+ font-family: 'Helvetica Neue', Helvetica, Arial;
+ font-weight: lighter;
+}
+
.btn-normal:not([disabled]):hover {
background: #EEEEEE;
}
diff --git a/ui/css/theme-default/repository-edit.css
b/ui/css/theme-default/repository-edit.css
index 31fbe30..b754794 100644
--- a/ui/css/theme-default/repository-edit.css
+++ b/ui/css/theme-default/repository-edit.css
@@ -38,8 +38,6 @@
line-height: 30px;
font-size: 14px;
vertical-align: top;
- font-weight: lighter;
- font-family: 'Helvetica Neue', Helvetica, Arial;
}
.repository-edit-wrapper-label {
diff --git a/ui/pages/guest-add.html.tmpl b/ui/pages/guest-add.html.tmpl
index c24d850..8a0c60a 100644
--- a/ui/pages/guest-add.html.tmpl
+++ b/ui/pages/guest-add.html.tmpl
@@ -33,8 +33,9 @@
<section class="form-section">
<h2>1. $_("Virtual Machine Name")</h2>
<div class="field">
- <input type="text" class="text" style="width:
300px" name="name">
- <p class="text-help">
+ <input type="text" class="text" style="width:
300px" name="name"><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("The name used to identify the virtual machine. If omitted, a
name will be chosen based on the template used.")
</p>
</div>
@@ -44,12 +45,14 @@
<div class="field">
<div class="text-help">
<div id="prompt-create-template"
class="hidden">
- <div class="text-help">$_("Please create a
template first.")</div>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <div class="text-help
help-inline">$_("Please create a template first.")</div>
<a id="btn-create-template"
class="btn-normal" href="templates.html">
<span class="text">$_("Create a
Template")</span>
</a>
</div>
<div id="prompt-choose-template"
class="hidden">
+ <span class="icon-info-circled light-grey
c1"></span>
<span class="text-help">$_("Please choose a
template.")</span>
</div>
</div>
diff --git a/ui/pages/report-add.html.tmpl b/ui/pages/report-add.html.tmpl
index aad11df..6dc31ca 100644
--- a/ui/pages/report-add.html.tmpl
+++ b/ui/pages/report-add.html.tmpl
@@ -34,6 +34,7 @@
</h2>
<div class="field">
<input type="text" class="text"
id="report-name-textbox" name="name" />
+ <span class="icon-info-circled light-grey
c1"></span>
<span class="info-add-debug-report">
$_("The name used to identify the report. If omitted, a name
will be chosen based on current time. Name can contain: letters, digits, underscore
(\"_\") and hyphen (\"-\").")
</span>
diff --git a/ui/pages/report-rename.html.tmpl b/ui/pages/report-rename.html.tmpl
index 03d1f49..d70c279 100644
--- a/ui/pages/report-rename.html.tmpl
+++ b/ui/pages/report-rename.html.tmpl
@@ -34,6 +34,7 @@
</h2>
<div class="field">
<input type="text" class="text"
id="report-name-textbox" name="name" />
+ <span class="icon-info-circled light-grey
c1"></span>
<span class="info-debug-report-rename">
$_("The name used to identify the report. Name can contain:
letters, digits and hyphen (\"-\").")
</span>
diff --git a/ui/pages/repository-add.html.tmpl b/ui/pages/repository-add.html.tmpl
index ca2bcb1..5dae725 100644
--- a/ui/pages/repository-add.html.tmpl
+++ b/ui/pages/repository-add.html.tmpl
@@ -34,7 +34,8 @@
<div class="textbox-wrapper">
<input type="text" class="text"
name="repo_id" />
</div>
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Single word, unique identifier for the
repository.")
</p>
</div>
@@ -45,7 +46,8 @@
<div class="textbox-wrapper">
<input type="text" class="text"
name="config[repo_name]" />
</div>
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Textual name for the repository.")
</p>
</div>
@@ -56,7 +58,8 @@
<div class="textbox-wrapper">
<input type="text" class="text
required" name="baseurl" />
</div>
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("URL to the repository. Supported protocols are http,
ftp, and file.")
</p>
</div>
@@ -73,7 +76,8 @@
<div class="textbox-wrapper">
<input type="text" class="text"
name="config[dist]" />
</div>
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Distribution of the DEB repository.")
</p>
</div>
@@ -84,7 +88,8 @@
<div class="textbox-wrapper">
<input type="text" class="text"
name="config[comps]" />
</div>
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("List of components in DEB repository.")
</p>
</div>
diff --git a/ui/pages/storagepool-add-volume.html.tmpl
b/ui/pages/storagepool-add-volume.html.tmpl
index e7ea1e8..c8c2492 100644
--- a/ui/pages/storagepool-add-volume.html.tmpl
+++ b/ui/pages/storagepool-add-volume.html.tmpl
@@ -38,8 +38,9 @@
<div class="field">
<div class="textbox-wrapper">
<input type="text"
id="volume-remote-url" class="text volume-input download"
name="volumeRemoteURL" />
- </div>
- <p class="text-help">
+ </div><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Enter the remote URL here.")
</p>
</div>
@@ -52,7 +53,8 @@
</label>
</h2>
<div class="field">
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Choose the file you want to upload.")
</p>
<div class="textbox-wrapper">
diff --git a/ui/pages/storagepool-add.html.tmpl b/ui/pages/storagepool-add.html.tmpl
index 0b07f07..d1bdc84 100644
--- a/ui/pages/storagepool-add.html.tmpl
+++ b/ui/pages/storagepool-add.html.tmpl
@@ -32,8 +32,9 @@
<section class="form-section">
<h2>1. $_("Storage Pool Name")</h2>
<div class="field">
- <input id="poolId" required="required"
type="text" class="text storage-base-input-width"
name="name">
- <p class="text-help">
+ <input id="poolId" required="required"
type="text" class="text storage-base-input-width"
name="name"><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("The name used to identify the storage pools, and it
should not be empty.")
</p>
</div>
@@ -55,10 +56,12 @@
<section class="form-section">
<h2>3. $_("Storage Path")</h2>
<div class="field">
- <input id="pathId" type="text"
class="text storage-base-input-width">
- <p class="text-help">
- $_("The path of the Storage Pool. Each Storage Pool
must have a unique path.")</p>
- <p class="text-help">
+ <input id="pathId" type="text"
class="text storage-base-input-width"><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
+ $_("The path of the Storage Pool. Each Storage Pool
must have a unique path.")</p><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Kimchi will try to create the directory when it
does not already exist in your system.")</p>
</div>
<div class="clear"></div>
@@ -74,8 +77,9 @@
<ul id="nfs-server-used">
</ul>
</div>
- </div>
- <p class="text-help">
+ </div><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("NFS server IP or hostname. It can be input or
chosen from history.")</p>
</div>
</section>
@@ -88,8 +92,9 @@
<ul id="nfs-server-target">
</ul>
</div>
- </div>
- <p class="text-help">$_("The NFS
exported path on NFS server.")</p>
+ </div><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">$_("The
NFS exported path on NFS server.")</p>
</div>
</section>
</div>
@@ -97,7 +102,8 @@
<section class="form-section storageType">
<h2>3. $_("Device path")</h2>
<div class="host-partition">
- <p class="text-help">
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("Looking for available partitions ...")
<img src =
"../images/theme-default/loading.gif" />
</p>
@@ -112,8 +118,9 @@
<input id="iscsiserverId"
type="text" placeholder="$_("Server")">
<div class="popover"><ul
class="option select-list"></ul></div>
</span>
- <input id="iscsiportId"
placeholder="$_("Port")" type="text" class="text
storage-port-width" maxlength="4">
- <p class="text-help">
+ <input id="iscsiportId"
placeholder="$_("Port")" type="text" class="text
storage-port-width" maxlength="4"><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">
$_("iSCSI server IP or hostname. It should not be
empty.")</p>
</div>
</section>
@@ -123,8 +130,9 @@
<span class="filter-select popable"
id="iSCSITarget">
<input id="iscsiTargetId"
type="text">
<div class="popover"><ul
class="option select-list"></ul></div>
- </span>
- <p class="text-help">$_("The iSCSI
target on iSCSI server")</p>
+ </span><br>
+ <div class="icon-info-circled light-grey c1
help-inline"></div>
+ <p class="text-help help-inline">$_("The
iSCSI target on iSCSI server")</p>
</div>
</section>
<section class="form-section">
--
2.1.0