[Kimchi-devel] [PATCH 2/5] UI: Exchange guests dialog style to new kimchi UI

Tue Feb 10 08:35:13 UTC 2015

Signed-off-by: Wen Wang <wenwang at linux.vnet.ibm.com>
---
 ui/css/theme-default/guest-edit.css | 20 +++++++++-----------
 ui/pages/guest-add.html.tmpl        | 12 +++++++-----
 ui/pages/guest-edit.html.tmpl       |  6 ++++--
 3 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/ui/css/theme-default/guest-edit.css b/ui/css/theme-default/guest-edit.css
index 6815ecf..d8226dd 100644
--- a/ui/css/theme-default/guest-edit.css
+++ b/ui/css/theme-default/guest-edit.css
@@ -47,11 +47,13 @@
 }
 
 .guest-edit-wrapper-label {
-    height: 38px;
-    line-height: 38px;
-    margin-top: 5px;
+    height: 30px;
+    line-height: 30px;
+    margin-top: 10px;
     vertical-align: top;
     min-width: 100px;
+    font-weight: lighter;
+    font-family: 'Helvetica Neue', Helvetica, Arial;
 }
 
 #form-guest-edit-storage .guest-edit-wrapper-label {
@@ -60,6 +62,7 @@
 
 .guest-edit-wrapper-controls {
     width: 470px;
+    margin-top: 5px;ß
 }
 
 #form-guest-edit-storage .guest-edit-wrapper-controls {
@@ -68,21 +71,16 @@
 
 .guest-edit-wrapper-controls input[type="text"] {
     font-size: 16px;
-    height: 38px;
-    background: #fff;
-    -webkit-border-radius: 5px;
-    border-radius: 5px;
-    box-shadow: 2px 2px 2px #eee inset;
-    border-top: 1px solid #bbb;
-    border-left: 1px solid #bbb;
-    padding-left: 10px;
+    height: 30px;
     width: 450px;
+    border: 1px solid #CCCCCC;
 }
 
 .guest-edit-wrapper-controls input[type="text"][disabled] {
     color: #bbb;
     background-color: #fafafa;
     cursor: not-allowed;
+    border: 1px solid #CCCCCC;
 }
 
 .guest-edit-cdrom-row-container {
diff --git a/ui/pages/guest-add.html.tmpl b/ui/pages/guest-add.html.tmpl
index ab26c1e..c24d850 100644
--- a/ui/pages/guest-add.html.tmpl
+++ b/ui/pages/guest-add.html.tmpl
@@ -26,18 +26,17 @@
 <body>
 <div class="window" style="width: 900px;height: 580px;">
     <header>
-        <h1 class="title">$_("Create a New Virtual Machine")</h1>
-        <div class="close">X</div>
+        <h1 class="title h1 grey">$_("Create a New Virtual Machine")</h1>
     </header>
     <div class="content">
         <form id="form-vm-add">
         <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">
                     $_("The name used to identify the virtual machine. If omitted, a name will be chosen based on the template used.")
                 </p>
-                <input type="text" class="text" style="width: 300px" name="name">
             </div>
         </section>
         <section class="form-section">
@@ -45,13 +44,13 @@
             <div class="field">
                 <div class="text-help">
                     <div id="prompt-create-template" class="hidden">
-                        <div>$_("Please create a template first.")</div>
+                        <div class="text-help">$_("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>$_("Please choose a template.")</span>
+                        <span class="text-help">$_("Please choose a template.")</span>
                     </div>
                 </div>
                 <ul id="templateTile" class="tile-check tile-template">
@@ -83,6 +82,9 @@
         <div class="btn-group">
             <button id="vm-doAdd" class="btn-normal" disabled="disabled" href="javascript:void(0);"><span class="text">$_("Create")</span></button>
             <button id="vm-doAdding" class="btn-normal" disabled="disabled" style="display:none" href="javascript:void(0);"><span class="text">$_("Creating...")</span></button>
+            <button id="vm-add=cancel" class="btn-normal close" type="button">
+                <span class="text">$_("Cancel")</span>
+            </button>
         </div>
     </footer>
 </div>
diff --git a/ui/pages/guest-edit.html.tmpl b/ui/pages/guest-edit.html.tmpl
index 9db1e1c..e861973 100644
--- a/ui/pages/guest-edit.html.tmpl
+++ b/ui/pages/guest-edit.html.tmpl
@@ -23,8 +23,7 @@
 
 <div id="guest-edit-window" class="window">
     <header>
-        <h1 class="title">$_("Edit Guest")</h1>
-        <div class="close">X</div>
+        <h1 class="title h1 grey">$_("Edit Guest")</h1>
     </header>
     <div class="content">
         <div id="guest-edit-tabs">
@@ -189,6 +188,9 @@
             <button id="guest-edit-button-save" class="btn-normal">
                 <span class="text">$_("Save")</span>
             </button>
+            <button id="guest-edit-button-save" class="btn-normal close">
+                <span class="text">$_("Cancel")</span>
+            </button>
         </div>
     </footer>
 </div>
-- 
2.1.0


