Change <button> to <span> of notebook action icons

minahlee · minahlee · commit dcdf368cfe7f · 2016-06-21T23:24:19.000-07:00
diff --git a/zeppelin-server/src/test/java/org/apache/zeppelin/integration/AuthenticationIT.java b/zeppelin-server/src/test/java/org/apache/zeppelin/integration/AuthenticationIT.java
@@ -158,8 +158,8 @@ public void testGroupPermission() throws Exception {
 
       String noteId = driver.getCurrentUrl().substring(driver.getCurrentUrl().lastIndexOf("/") + 1);
 
-      pollingWait(By.xpath("//button[@tooltip='Note permissions']"),
-          MAX_BROWSER_TIMEOUT_SEC).sendKeys(Keys.ENTER);
+      pollingWait(By.xpath("//span[@tooltip='Note permissions']"),
+          MAX_BROWSER_TIMEOUT_SEC).click();
       pollingWait(By.xpath("//input[@ng-model='permissions.owners']"), MAX_BROWSER_TIMEOUT_SEC)
           .sendKeys("finance");
       pollingWait(By.xpath("//input[@ng-model='permissions.readers']"), MAX_BROWSER_TIMEOUT_SEC)
diff --git a/zeppelin-web/src/app/notebook/notebook-actionBar.html b/zeppelin-web/src/app/notebook/notebook-actionBar.html
@@ -153,26 +153,24 @@ <h3>
     </span>
 
     <div class="pull-right" style="margin-top:15px; margin-right:15px; font-size:15px;">
-      <span>
-        <button type="button"
-            class="btn btn-default btn-xs"
+      <span class="setting-btn"
+            type="button"
             data-toggle="modal"
             data-target="#shortcutModal"
             tooltip-placement="bottom" tooltip="List of shortcut">
-          <i class="fa fa-keyboard-o"></i>
-        </button>
-        <button type="button"
-            class="btn btn-default btn-xs"
+        <i class="fa fa-keyboard-o"></i>
+      </span>
+      <span class="setting-btn"
+            type="button"
             ng-click="toggleSetting()"
             tooltip-placement="bottom" tooltip="Interpreter binding">
-          <i class="fa fa-cog" ng-style="{color: showSetting ? '#3071A9' : 'black' }"></i>
-        </button>
-        <button type="button"
-            class="btn btn-default btn-xs"
+        <i class="fa fa-cog" ng-style="{color: showSetting ? '#3071A9' : 'black' }"></i>
+      </span>
+      <span class="setting-btn"
+            type="button"
             ng-click="togglePermissions()"
             tooltip-placement="bottom" tooltip="Note permissions">
-          <i class="fa fa-lock" ng-style="{color: showPermissions ? '#3071A9' : 'black' }"></i>
-        </button>
+        <i class="fa fa-lock" ng-style="{color: showPermissions ? '#3071A9' : 'black' }"></i>
       </span>
 
       <span class="btn-group">
diff --git a/zeppelin-web/src/app/notebook/notebook.css b/zeppelin-web/src/app/notebook/notebook.css
@@ -223,6 +223,13 @@
   padding-left: 5px;
 }
 
+.setting-btn {
+  position: relative;
+  top: 2px;
+  margin-right: 4px;
+  cursor: pointer;
+}
+
 .cron-preset-container {
   padding: 10px 20px 0 20px;
   font-weight: normal;
