Prechádzať zdrojové kódy

[security] Restyled ACLs tree nodes

Enrico Berti 11 rokov pred
rodič
commit
2d8d87c

+ 11 - 9
apps/security/src/security/templates/hdfs.mako

@@ -186,19 +186,21 @@ ${ layout.menubar(section='hdfs') }
 </div>
 
 <%def name="treeIcons()">
-  'fa-folder-open-o': isDir() && nodes().length > 0,
-  'fa-folder-o': isDir() && nodes().length == 0,
-  'fa-file-o': !isDir()
+  'fa-folder-open-o': isDir() && nodes().length > 0 && !aclBit(),
+  'fa-folder-open': isDir() && nodes().length > 0 && aclBit(),
+  'fa-folder-o': isDir() && nodes().length == 0 && !aclBit(),
+  'fa-folder': isDir() && nodes().length == 0 && aclBit(),
+  'fa-file-o': !isDir() && !aclBit(),
+  'fa-file': !isDir() && aclBit(),
+  'striked': striked()
 </%def>
 
 <%def name="aclBitPullRight()">
-  <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 class="pull-right rwx" data-bind="style: { color: aclBit() ? '#338bb8': '#999999'}">
+    <span data-bind="text: rwx"></span>
   </div>
-  
-  <div class="pull-right" style="margin-right: 20px" data-bind="visible: aclBit()">
-    <i class="fa fa-lock"></i>
+  <div class="pull-right">
+    <i class="fa fa-lock" data-bind="visible: aclBit()" style="color: #338bb8"></i>
   </div>
 </%def>
 

+ 8 - 15
apps/security/static/css/security.css

@@ -47,6 +47,11 @@
 
 .node-row a.striked {
   text-decoration: line-through;
+  color: #b94a48;
+}
+
+.fa.striked {
+  color: #b94a48!important;
 }
 
 .node-row.selected {
@@ -163,21 +168,9 @@
   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;
+  width: 90px;
   text-align: right;
   padding-right: 10px;
-}
+}
+

+ 2 - 9
desktop/core/src/desktop/templates/common_tree.mako

@@ -73,17 +73,10 @@
 
   <script type="text/html" id="node-name-template">
     <div class="node-row" data-bind="
-    %if styleModifier:
-      style: { border: ${styleModifier}() ? '1px dashed #bce8f1': ''},
-    %endif
-    css: {
     %if itemSelected:
-     selected: ${itemSelected},
-    %endif
-    %if styleModifier:
-     'with-acl': ${styleModifier}(),
+     css: { selected: ${itemSelected}}
     %endif
-      dummy: true}">
+    ">
       <i data-bind="
         %if iconClick:
           click: ${iconClick},