瀏覽代碼

[security] Updated style for ACL node and added rwx info

Enrico Berti 11 年之前
父節點
當前提交
965eb7b

+ 2 - 1
apps/security/src/security/templates/hdfs.mako

@@ -192,7 +192,8 @@ ${ layout.menubar(section='hdfs') }
 </%def>
 
 <%def name="aclBitPullRight()">
-  <div class="pull-right muted"  data-bind="visible: striked">
+  <div class="pull-right muted rwx" data-bind="text: rwx"></div>
+  <div class="pull-right muted" data-bind="visible: striked">
     This is not visible by current user <span data-bind="text: $root.doAs"></span>
   </div>
   

+ 21 - 2
apps/security/static/css/security.css

@@ -38,7 +38,7 @@
 }
 
 .node-row:hover {
-  background-color: #F6F6F6;
+  background: #F6F6F6;
 }
 
 .node-row a, .node-row i {
@@ -50,7 +50,7 @@
 }
 
 .node-row.selected {
-  background-color: #F6F6F6 !important;
+  background: #F6F6F6 !important;
 }
 
 .acl-panel {
@@ -161,4 +161,23 @@
 
 .pointer {
   cursor: pointer;
+}
+
+.with-acl {
+  background: #ffffff; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI2MiUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZDllZGY3IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
+  background: -moz-linear-gradient(left,  #ffffff 62%, #d9edf7 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, right top, color-stop(62%,#ffffff), color-stop(100%,#d9edf7)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(left,  #ffffff 62%,#d9edf7 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(left,  #ffffff 62%,#d9edf7 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(left,  #ffffff 62%,#d9edf7 100%); /* IE10+ */
+  background: linear-gradient(to right,  #ffffff 62%,#d9edf7 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d9edf7',GradientType=1 ); /* IE6-8 */
+}
+
+.rwx {
+  width: 110px;
+  text-align: right;
+  padding-right: 10px;
 }

+ 3 - 0
apps/security/static/js/hdfs.ko.js

@@ -81,6 +81,7 @@ var Assist = function (vm, assist) {
     aclBit: false,
     striked: false,
     selected: false,
+    rwx: "",
     page: {
       number: -1,
       num_pages: -1
@@ -94,6 +95,7 @@ var Assist = function (vm, assist) {
         aclBit: false,
         striked: false,
         selected: false,
+        rwx: "",
         page: {
           number: -1,
           num_pages: -1
@@ -197,6 +199,7 @@ var Assist = function (vm, assist) {
         aclBit: item.rwx.indexOf('+') != -1,
         striked: item.striked != null,
         isExpanded: true,
+        rwx: item.rwx,
         isDir: item.type == "dir" || item.isDir == true,
         page: {
           number: -1,

+ 8 - 8
desktop/core/src/desktop/templates/common_tree.mako

@@ -74,13 +74,16 @@
   <script type="text/html" id="node-name-template">
     <div class="node-row" data-bind="
     %if styleModifier:
-      style: { border: ${styleModifier}() ? '1px dashed #eed3d7': '',  background: ${styleModifier}() ? '#f2dede': ''},
+      style: { border: ${styleModifier}() ? '1px dashed #bce8f1': ''},
     %endif
+    css: {
     %if itemSelected:
-     css:{selected: ${itemSelected}}">
-    %else:
-     css:{unselected: true">
+     selected: ${itemSelected},
     %endif
+    %if styleModifier:
+     'with-acl': ${styleModifier}(),
+    %endif
+      dummy: true}">
       <i data-bind="
         %if iconClick:
           click: ${iconClick},
@@ -94,7 +97,7 @@
             %endif
         },
         %if styleModifier:
-          style: { color: ${styleModifier}() ? '#b94a48': '#999999'}
+          style: { color: ${styleModifier}() ? '#338bb8': '#999999'}
         %else:
           style: { color: '#999999'}
         %endif
@@ -109,9 +112,6 @@
       %if itemDblClick:
         event : { dblclick: ${itemDblClick} },
       %endif
-      %if styleModifier:
-        style: { color: ${styleModifier}() ? '#b94a48': ''},
-      %endif
       %if strikedProperty:
       css:{'striked': striked},
       %endif