[PATCH ][Ginger] Multi culture UI issues fixed

[rajg...@linux.vnet.ibm.com]

From: Rajat Gupta <rajat....@gmail.com>

1. Added titles and corrected CSS to avoid text overlap.
2. Changed UI message for admin batch delete panel
3. Fixed String "Details" can't be fully displayed in service management panel in locale languages
4. Added message for add partition panel
5. Fixed concatenation of strings in audit rules -> action panels

Signed-off-by: Rajat Gupta <rajat....@gmail.com>
---
ui/css/ginger.css | 21 ++++++++++++++++++---
ui/css/src/modules/_ovsbridges.scss | 15 +++++++++++++++
ui/css/src/modules/_systemservices.scss | 6 +++---
ui/js/host-admin.js | 8 ++++----
ui/pages/host-storage-addpartitions.html.tmpl | 3 +++
ui/pages/i18n.json.tmpl | 10 +++++-----
ui/pages/tabs/host-admin.html.tmpl | 8 ++++----
ui/pages/tabs/host-network.html.tmpl | 4 ++--
ui/pages/tabs/host-storage.html.tmpl | 6 +++---
9 files changed, 57 insertions(+), 24 deletions(-)

diff --git a/ui/css/ginger.css b/ui/css/ginger.css
index 5cf30c0..87d7c4e 100644
--- a/ui/css/ginger.css
+++ b/ui/css/ginger.css
@@ -2469,6 +2469,11 @@ hr {

#ovsbridgeGrid.wok-datagrid > .wok-datagrid-header > span.column-name,
#ovsbridgeGrid.wok-datagrid > .wok-datagrid-body > .wok-datagrid-row > span.column-name {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 210px;
}

@@ -2476,6 +2481,11 @@ hr {
#ovsbridgeGrid.wok-datagrid > .wok-datagrid-header > span.column-interfaces,
#ovsbridgeGrid.wok-datagrid > .wok-datagrid-body > .wok-datagrid-row > span.column-bonds,
#ovsbridgeGrid.wok-datagrid > .wok-datagrid-body > .wok-datagrid-row > span.column-interfaces {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 270px;
}

@@ -2523,6 +2533,11 @@ hr {
}

#ovsbridgeGrid.wok-datagrid span.column-ifname {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 170px;
}

@@ -2708,9 +2723,9 @@ form[name="ovsaddinterface"] {
}

#system-services-content-area span.column-service-details {
- width: 60px;
- min-width: 60px;
- flex-basis: 60px;
+ width: 75px;
+ min-width: 75px;
+ flex-basis: 75px;
text-align: center;
white-space: nowrap;
overflow: hidden;
diff --git a/ui/css/src/modules/_ovsbridges.scss b/ui/css/src/modules/_ovsbridges.scss
index 2c7a037..d29bf07 100644
--- a/ui/css/src/modules/_ovsbridges.scss
+++ b/ui/css/src/modules/_ovsbridges.scss
@@ -97,11 +97,21 @@
#ovsbridgeGrid.wok-datagrid > .wok-datagrid-body > .wok-datagrid-row {

> span.column-name {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 210px;
}

> span.column-bonds,
> span.column-interfaces {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 270px;
}

@@ -148,6 +158,11 @@
}

#ovsbridgeGrid.wok-datagrid span.column-ifname {
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
width: 170px;
}

diff --git a/ui/css/src/modules/_systemservices.scss b/ui/css/src/modules/_systemservices.scss
index 2006feb..4eb2c04 100644
--- a/ui/css/src/modules/_systemservices.scss
+++ b/ui/css/src/modules/_systemservices.scss
@@ -78,9 +78,9 @@
}

span.column-service-details {
- width: 60px;
- min-width: 60px;
- flex-basis: 60px;
+ width: 75px;
+ min-width: 75px;
+ flex-basis: 75px;
text-align: center;
white-space: nowrap;
overflow: hidden;
diff --git a/ui/js/host-admin.js b/ui/js/host-admin.js
index 5c70ecd..931eee7 100644
--- a/ui/js/host-admin.js
+++ b/ui/js/host-admin.js
@@ -1124,7 +1124,7 @@ $('#audit-rule-delete-btn').on('click', function(event) {
selectedRows.push(value[2]);
});
var settings = {
- content: i18n["GINAUDIT0022M"] + selectedRows,
+ content: i18n["GINAUDIT0022M"] + '<br>' + selectedRows,
confirm: i18n["GINNET0015M"]
};
wok.confirm(settings, function() {
@@ -1181,7 +1181,7 @@ $('#Audit-Rule-Load-btn').on('click', function(event) {
selectedRows.push(value[2]);
});
var settings = {
- content: i18n["GINAUDIT0024M"] + selectedRows,
+ content: i18n["GINAUDIT0024M"] + '<br>' + selectedRows,
confirm: i18n["GINNET0015M"]
};
wok.confirm(settings, function() {
@@ -1212,7 +1212,7 @@ $('#Audit-Rule-unload-btn').on('click', function(event) {
selectedRows.push(value[2]);
});
var settings = {
- content: i18n["GINAUDIT0026M"] + selectedRows,
+ content: i18n["GINAUDIT0026M"] + '<br>' + selectedRows,
confirm: i18n["GINNET0015M"]
};
wok.confirm(settings, function() {
@@ -1247,7 +1247,7 @@ $('#Audit-Rule-Persist-btn').on('click', function(event) {
selectedRows.push(value[2]);
});
var settings = {
- content: i18n["GINAUDIT0028M"] + selectedRows,
+ content: i18n["GINAUDIT0028M"] + '<br>' + selectedRows,
confirm: i18n["GINNET0015M"]
};
wok.confirm(settings, function() {
diff --git a/ui/pages/host-storage-addpartitions.html.tmpl b/ui/pages/host-storage-addpartitions.html.tmpl
index 4213088..d02c5f9 100644
--- a/ui/pages/host-storage-addpartitions.html.tmpl
+++ b/ui/pages/host-storage-addpartitions.html.tmpl
@@ -58,6 +58,9 @@
<div style="margin-left:60px; margin-top:9px;" id="slider-id" class="slider col-md-8 col-lg-8 ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<span tabindex="0" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 0%;"></span></div><span style="margin-left:50px" id="min-slider-value">1 MB</span><span style="margin-left:405px" id="max-slider-value">10.240 MB</span></div>
<!-- slider -->
+ <div class="row">
+ <p class="help-block"> <i class="fa fa-info-circle"></i> $_('Available size on the disk can be lesser than the selectable size, due to some overhead or additional partitions available.')</p>
+ </div>
<div class="wok-list-loader-container wok-list-loading" id="partition-add-loading" style="display:none; z-index: 1;">
<div class="wok-list-loading-icon"></div>
<div class="wok-list-loading-text">$_("Creating ...")</div>
diff --git a/ui/pages/i18n.json.tmpl b/ui/pages/i18n.json.tmpl
index 54adfd5..dce9943 100644
--- a/ui/pages/i18n.json.tmpl
+++ b/ui/pages/i18n.json.tmpl
@@ -254,7 +254,7 @@
"GINSEN00010M": "$_("Others")",
"GINSEN00011M": "$_("HDD")",
"GINSWP0001M": "$_("Swap Deletion")",
- "GINSWP0002M": "$_("Are you sure you want to delete the selected file/device")",
+ "GINSWP0002M": "$_("Are you sure you want to delete the selected file/device?")",
"GINSWP0003M": "$_("OK")",
"GINSWP0004M": "$_("Cancel")",
"GINSWP0005M": "$_("successfully deleted")",
@@ -376,13 +376,13 @@
"GINAUDIT0019M": "$_("Reset")",
"GINAUDIT0020M": "$_("Report")",
"GINAUDIT0021M": "$_("No rules selected. Please select one")",
- "GINAUDIT0022M": "$_("Do you want to delete following rules ? :")",
+ "GINAUDIT0022M": "$_("Do you want to delete following rules ?")",
"GINAUDIT0023M": "$_("Successfully deleted")",
- "GINAUDIT0024M": "$_("Do you want to load following rules ? :")",
+ "GINAUDIT0024M": "$_("Do you want to load following rules ?")",
"GINAUDIT0025M": "$_("Successfully loaded")",
- "GINAUDIT0026M": "$_("Do you want to unload following rules ? :")",
+ "GINAUDIT0026M": "$_("Do you want to unload following rules ?")",
"GINAUDIT0027M": "$_("Successfully unloaded")",
- "GINAUDIT0028M": "$_("Do you want to persist following rules ? :")",
+ "GINAUDIT0028M": "$_("Do you want to persist following rules ?")",
"GINAUDIT0029M": "$_("Successfully persisted")",
"GINAUDIT0030M": "$_("Please select one rule to edit")",
"GINAUDIT0031M": "$_("Can't edit the rule, because selected rule is not persisted")",
diff --git a/ui/pages/tabs/host-admin.html.tmpl b/ui/pages/tabs/host-admin.html.tmpl
index 9861cdb..05eb024 100644
--- a/ui/pages/tabs/host-admin.html.tmpl
+++ b/ui/pages/tabs/host-admin.html.tmpl
@@ -419,8 +419,8 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
<div id="radio-buttons">
<label class="radio-inline">
<input type="radio" name="batDelType" class="wok-radio" id="counts-ago-radio" value="counts_ago" checked/>
- <label for="counts-ago-text">$_("Preserve the latest")</label>
- <input type="text" class="form-control" id="counts-ago-text" style="display: inherit;width: auto;"> $_("backups")
+ <label for="counts-ago-text">$_("Preserve the latest number of backups:")</label>
+ <input type="text" class="form-control" id="counts-ago-text" style="display: inherit;width: auto;">
</label>
</div>
</div>
@@ -428,8 +428,8 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
<div id="radio-buttons">
<label class="radio-inline">
<input type="radio" name="batDelType" class="wok-radio" id="days-ago-radio" value="days_ago"/>
- <label for="days-ago-text">$_("Preserve the latest")</label>
- <input type="text" class="form-control" id="days-ago-text" style="display: inherit;width: auto;" disabled> $_("days of backups")
+ <label for="days-ago-text">$_("Preserve the latest number of days of backups:")</label>
+ <input type="text" class="form-control" id="days-ago-text" style="display: inherit;width: auto;" disabled>
</label>
</div>
</div>
diff --git a/ui/pages/tabs/host-network.html.tmpl b/ui/pages/tabs/host-network.html.tmpl
index 6714761..f17d81b 100644
--- a/ui/pages/tabs/host-network.html.tmpl
+++ b/ui/pages/tabs/host-network.html.tmpl
@@ -218,7 +218,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
<script id="ovsbridgeTmpl" type="html/text">
<div id="bridge-{id}" class="bridge" data-name="{name}">
<span class='column-name name-filter' title="{name}">{name}</span><!--
- --><span class='column-bonds' title="{bondPlus}">{bonds}</span><!--
+ --><span class='column-bonds' title="{bonds}">{bonds}</span><!--
--><span class='column-interfaces' title="{interfacePlus}">{interfaces}</span><!--
--><span class='column-statistics'>{statistics}</span><!--
--><span class="column-action">
@@ -255,7 +255,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
<script id="interfaceBodyTmpl" type="html/text">
<div id="interface-{id}" data-name="{name}" role="row">
<span role="gridcell" class="column-state" title="$_("Interface is") {state}"><span class="sr-only">$_("Interface is") {state}</span><i class="fa fa-power-off {stateClass}"></i></span><!--
- --><span role="gridcell" class='column-ifname'>{name}</span><!--
+ --><span role="gridcell" class='column-ifname' title='{name}'>{name}</span><!--
--><span role="gridcell" class='column-stat'>{rxBytes}<span class="sr-only"> $_("Bytes Received")</span></span><!--
--><span role="gridcell" class='column-stat'>{txBytes}<span class="sr-only"> $_("Bytes Transmitted")</span></span><!--
--><span role="gridcell" class='column-stat'>{rxPackets}<span class="sr-only"> $_("Packages Received")</span></span><!--
diff --git a/ui/pages/tabs/host-storage.html.tmpl b/ui/pages/tabs/host-storage.html.tmpl
index c052e4b..210a0f6 100644
--- a/ui/pages/tabs/host-storage.html.tmpl
+++ b/ui/pages/tabs/host-storage.html.tmpl
@@ -336,13 +336,13 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
<a class="pool-activate partition-delete"><i class="fa fa-minus-circle"></i>$_("Delete Partition")</a>
</li>
<li role="presentation">
- <a class="pool-add-volume partition-format"><i class="fa fa fa-pencil-square-o"></i>$_("Format FS")</a>
+ <a class="pool-add-volume partition-format" title="Format File System"><i class="fa fa fa-pencil-square-o"></i>$_("Format FS")</a>
</li>
<li role="presentation">
- <a class="pool-deactivate partition-add-vg"><i class="fa fa-plus-circle"></i>$_("Add to VG")</a>
+ <a class="pool-deactivate partition-add-vg" title="Add to Volume Group"><i class="fa fa-plus-circle"></i>$_("Add to VG")</a>
</li>
<li role="presentation">
- <a class="pool-activate partition-delete-vg"><i class="fa fa-times"></i>$_("Remove from VG")</a>
+ <a class="pool-activate partition-delete-vg" title="Remove from Volume Group"><i class="fa fa-times"></i>$_("Remove from VG")</a>
</li>
</ul>
</div>
--
2.1.0

[Daniel Henrique Barboza]

Applied. Thanks!