azkaban-developers

Issue #152 - Condense page headers and fix header controls except

2/9/2014 7:06:07 PM

Details

diff --git a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
index 104d167..d714510 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
@@ -66,14 +66,13 @@
 		<div class="az-page-header">
 			<div class="container-full">
 				<div class="row">
-					<div class="col-xs-6">
+					<div class="header-title">
 						<h1><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <small>$flowid</small></a></h1>
 					</div>
-					<div class="col-xs-6">
-						<div class="pull-right az-page-header-form">
-							<button type="button" class="btn btn-sm btn-success" id="executebtn">Schedule / Execute Flow</button>
-						</div>
-						<div class="clearfix"></div>
+					<div class="header-control">
+            <div class="pull-right">
+              <button type="button" class="btn btn-sm btn-success" id="executebtn">Schedule / Execute Flow</button>
+            </div>
 					</div>
 				</div>
 			</div>
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
index 6bb0858..cf4c085 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
@@ -19,18 +19,9 @@
         <div class="row">
           <div class="header-title" id="project-page-header">
             <h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
-            <p class="editable" id="project-description">$project.description</p>
-            <div id="project-description-form" class="editable-form">
-              <div class="input-group">
-                <input type="text" class="form-control input-sm" id="project-description-edit" placeholder="Project description">
-                <span class="input-group-btn">
-                  <button class="btn btn-primary btn-sm" type="button" id="project-description-btn">Save</button>
-                </span>
-              </div>
-            </div>
           </div>
           <div class="header-control">
-            <div class="pull-right az-page-header-form" id="project-options">
+            <div class="pull-right" id="project-options">
               <button id="project-delete-btn" class="btn btn-sm btn-danger">
                 <span class="glyphicon glyphicon-trash"></span> Delete Project
               </button>
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
index 20bb3bf..cbebfc7 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
@@ -14,8 +14,17 @@
  * the License.
 *#
 
-					<div class="well">
+					<div class="well" id="project-sidebar">
 						<h3>$project.name</h3>
+            <p class="editable" id="project-description">$project.description</p>
+            <div id="project-description-form" class="editable-form">
+              <div class="input-group">
+                <input type="text" class="form-control input-sm" id="project-description-edit" placeholder="Project description">
+                <span class="input-group-btn">
+                  <button class="btn btn-primary btn-sm" type="button" id="project-description-btn">Save</button>
+                </span>
+              </div>
+            </div>
 						<p><strong>Created on</strong> $utils.formatDate($project.createTimestamp)</p>
 						<p><strong>Last modified by</strong> $utils.formatDate($project.lastModifiedTimestamp)</p>
 						<p><strong>Modified by</strong> $project.lastModifiedUser</p>

src/less/base.less 15(+15 -0)

diff --git a/src/less/base.less b/src/less/base.less
index cb7a0da..999d9b7 100644
--- a/src/less/base.less
+++ b/src/less/base.less
@@ -115,3 +115,18 @@
     background-position: -64px -80px;
   }
 }
+  
+.editable {
+  margin: 0px;
+  cursor: pointer;
+  &:hover {
+    background-color: #fcfcfc;
+  }
+  &.editable-placeholder {
+    color: #a0a0a0;
+  }
+}
+
+.editable-form {
+  display: none;
+}

src/less/header.less 35(+17 -18)

diff --git a/src/less/header.less b/src/less/header.less
index d17c30e..5b10f0e 100644
--- a/src/less/header.less
+++ b/src/less/header.less
@@ -5,8 +5,22 @@
   background-color: #f4f4f4;
 
   h1 {
-    font-size: 28px;
-    margin: 0;
+    font-size: 22px;
+    margin: 4px 0 2px 0;
+    font-weight: 400;
+
+    small {
+      font-size: 22px;
+      font-weight: 300;
+    }
+
+    a {
+      color: #9a9a9a;
+      &:hover,
+      &:active {
+        text-decoration: none;
+      }
+    }
   }
   
   .az-page-header-form {
@@ -21,21 +35,6 @@
     }
   }
 
-  .editable {
-    margin: 0px;
-    cursor: pointer;
-    &:hover {
-      background-color: #fcfcfc;
-    }
-    &.editable-placeholder {
-      color: #a0a0a0;
-    }
-  }
-
-  .editable-form {
-    display: none;
-  }
-
   .header-title {
     padding-left: 15px;
     float: left;
@@ -48,7 +47,7 @@
     width: 500px;
 
     form {
-      margin-top: 5px;
+      margin: 0;
     }
 
     .form-group {
diff --git a/src/web/js/azkaban/view/project-modals.js b/src/web/js/azkaban/view/project-modals.js
index 4f9b5f4..6309d1c 100644
--- a/src/web/js/azkaban/view/project-modals.js
+++ b/src/web/js/azkaban/view/project-modals.js
@@ -148,6 +148,6 @@ $(function() {
     el: $('#delete-project-modal')
   });
 	projectDescription = new azkaban.ProjectDescriptionView({
-    el: $('#project-page-header')
+    el: $('#project-sidebar')
   });
 });