Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com>
---
ui/css/theme-default/network.css | 23 +++++++------------
ui/js/src/kimchi.network.js | 49 ++++++++++++++++++++++++++++++++++++++--
ui/pages/tabs/network.html.tmpl | 6 ++---
3 files changed, 58 insertions(+), 20 deletions(-)
diff --git a/ui/css/theme-default/network.css b/ui/css/theme-default/network.css
index e47845a..e5a8e47 100644
--- a/ui/css/theme-default/network.css
+++ b/ui/css/theme-default/network.css
@@ -132,13 +132,12 @@
}
.network-config .section-header {
- font-weight: bold;
font-size: 14px;
+ font-weight: lighter;
}
.network-config .section-content {
margin-top: 10px;
- margin-left: 20px;
}
.network-config input[type="text"] {
@@ -254,21 +253,15 @@
}
.network-config .input-hint-text {
- vertical-align: top;
-}
-
-.network-label {
- background: none repeat scroll 0 0 #FFFFFF;
- border-left: 1px solid #BBBBBB;
- border-radius: 5px 5px 5px 5px;
- border-top: 1px solid #BBBBBB;
- box-shadow: 2px 2px 2px #EEEEEE inset;
- color: #333333;
- font-size: 13px;
- padding: 10px;
- width: 100%;
+ color: #999999;
+ font-weight: lighter;
+ font-size: 12px;
}
.ui-state-default a {
color: #212121;
}
+
+#networkConfig {
+ padding-left: 30px;
+}
\ No newline at end of file
diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js
index 2e2310f..81d5dd0 100644
--- a/ui/js/src/kimchi.network.js
+++ b/ui/js/src/kimchi.network.js
@@ -231,9 +231,17 @@ kimchi.initNetworkDialog = function() {
buttonsObj= {};
buttonsObj['id'] = "networkFormOk";
buttonsObj['text'] = i18n.KCHAPI6005M;
- buttonsObj['class'] = "ui-button-primary";
+ buttonsObj['class'] = "btn-normal";
buttonsObj['disabled'] = true;
buttonsObj['click'] = function() { };
+ buttonsObjCancel= {};
+ buttonsObjCancel['id'] = "networkFormCancel";
+ buttonsObjCancel['text'] = i18n.KCHAPI6003M;
+ buttonsObjCancel['class'] = "btn-normal";
+ buttonsObjCancel['disabled'] = false;
+ buttonsObjCancel['click'] = function() {
+ $(this).dialog("close");
+ };
$("#networkConfig").dialog({
autoOpen : false,
modal : true,
@@ -244,11 +252,48 @@ kimchi.initNetworkDialog = function() {
dialogClass : "network-ui-dialog remove-when-logged-off",
open : function(){
$(".ui-dialog-titlebar-close",
$("#networkConfig").parent()).removeAttr("title");
+ $(".ui-widget-overlay").css({
+ "background": "#FFFFFF",
+ "opacity": "0.5"
+ });
},
beforeClose : function() {
kimchi.cleanNetworkDialog();
},
- buttons : [buttonsObj]
+ buttons : [buttonsObj, buttonsObjCancel]
+ });
+ $("#networkConfig").parent().css({
+ "background": "#FFFFFF",
+ "border-radius": 0,
+ "border": "2px solid #999999"
+ });
+ $(".ui-dialog-titlebar button",
$("#networkConfig").parent()).remove();
+ $(".ui-dialog-titlebar span",
$("#networkConfig").parent()).css({
+ "font-weight": "lighter",
+ "height": "48px",
+ "line-height": "48px",
+ "margin": "0 30px",
+ "color": "#444444",
+ "font-size": "22px"
+ });
+ $(".ui-dialog-titlebar", $("#networkConfig").parent()).css({
+ "box-shadow": "none",
+ "padding": "0",
+ });
+ $(".ui-dialog-buttonpane", $("#networkConfig").parent()).css({
+ "background": "#008ABF"
+ });
+ $(".ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset").css({
+ "padding": "0 10px",
+ "float": "left"
+ });
+ $(".ui-dialog-buttonpane .ui-dialog-buttonset
button").removeClass("ui-corner-all");
+ $(".ui-dialog-buttonpane .ui-dialog-buttonset button").css({
+ "background": "#FFFFFF",
+ "color": "#444444",
+ "font-size": "13px",
+ "border-radius": "0",
+ "opacity": "1"
});
kimchi.setupNetworkFormEvent();
};
diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl
index 8a6c2cf..e2b1639 100644
--- a/ui/pages/tabs/network.html.tmpl
+++ b/ui/pages/tabs/network.html.tmpl
@@ -47,10 +47,10 @@
<div class="section-container">
<div class="section-header">1. $_("Network
Name")</div>
<div class="section-content">
- <input type="text" id="networkName"
class="network-label"/>
+ <input type="text" id="networkName" />
<div class="input-hint">
- <span class="ui-icon ui-icon-info
input-hint-icon"></span>
- <span class="input-hint-text">$_("Name should
not contain '/' and '\"'.")</span>
+ <span class="icon-info-circled light-grey c1
help-inline"></span>
+ <span class="input-hint-text
help-inline">$_("Name should not contain '/' and
'\"'.")</span>
</div>
</div>
</div>
--
2.1.0