dwui/packages/tree/style/base.less

a part of wrapper on iView UI

// base tree
.tree {
  color: #0e0e0e;
  font-size: 1.2em;
}
.tree-node, .tree-children, .tree-container-ul { display:block; margin:0; padding:0; list-style-type:none; list-style-image:none; }
//.tree-children {overflow: auto; }
.tree-node { white-space:nowrap; }
.tree-anchor { display:inline-block;color:black;width: 100%; white-space:nowrap; padding:0 4px 0 1px; margin:0; vertical-align:top; font-size: 14px;}
.tree-anchor:focus { outline:0; }
.tree-anchor, .tree-anchor:link, .tree-anchor:visited, .tree-anchor:hover, .tree-anchor:active { text-decoration:none; color:inherit; }
.tree-icon { display:inline-block; text-decoration:none; margin:0; padding:0; vertical-align:top; text-align:center; }
.tree-icon:empty { display:inline-block; text-decoration:none; margin:0; padding:0; vertical-align:top; text-align:center; }
.tree-ocl { cursor:pointer; }
.tree-leaf > .tree-ocl { cursor:default; }
.tree-anchor > .tree-themeicon { margin-right:2px; }
.tree-no-icons .tree-themeicon,
.tree-anchor > .tree-themeicon-hidden { display:none; }
.tree-hidden, .tree-node.tree-hidden { display:none; }

// base tree rtl
.tree-rtl {
  .tree-anchor { padding:0 1px 0 4px; }
  .tree-anchor > .tree-themeicon { margin-left:2px; margin-right:0; }
  .tree-node { margin-left:0; }
  .tree-container-ul > .tree-node { margin-right:0; }
}

// base tree wholerow
.tree-wholerow-ul {
  position:relative;
  display:inline-block;
  min-width:100%;
  .tree-leaf > .tree-ocl { cursor:pointer; }
  .tree-anchor, .tree-icon { position:relative; }
  .tree-wholerow { width:100%; cursor:pointer; z-index: -1; position:absolute; left:0; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; }
}

.tree-item-wrapper {
  position: relative;
  padding-top:1px;
  /*background-color: white;*/
}
.tree-item-info {
  color: rgba(27, 25, 18, 0.77);
  display: inline-block;
  position: absolute;
  top: 0;right: 0;
  z-index: 3;
  //visibility: hidden;
  opacity: 0;
  background-color: inherit ;
  line-height: 22px;
  padding-left: 5px;
  padding-right: 12px;
  cursor: pointer;
}
.tree-anchor {
  font-size: 12px;
}
.tree-show-info {
  display: inline-block;
  cursor: pointer;
}
//.tree-item-info-display {
//  animation: tree-item-info-ani 1.5s ;
//  opacity: 1;
//  -webkit-animation: tree-item-info-ani 1.5s;
//  -moz-animation: tree-item-info-ani 1.5s;
//  -o-animation: tree-item-info-ani 1.5s;
//  cursor: pointer;
//}
.tree-search-matched {
  color: red;
}

@keyframes tree-item-info-ani {
  from {
    opacity: 0;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes tree-item-info-ani {
  from {
    opacity: 0;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}
.tree-item-shared {
  color: #c24a40;
  position: absolute;
  top: -1px;
  left: 18px;
  font-size: 12px;
  transform: scale(0.88);
  line-height: 12px
}
//.tree-item-shared {
//  color: white;
//  position: absolute;
//  top: -1px;
//  left: 18px;
//  font-size: 12px;
//  line-height: 12px;
//  transform: scale(0.8);
//  background-color: #106ee2;
//  border-radius: 12px;
//  padding: 1px 2px;
//}

.tree-item-shared-empty-expand {
  color: #c24a40;
  position: absolute;
  top: 0px;
  left: 44px;
  font-size: 12px;
  transform: scale(0.8);
  line-height: 12px;
  background-color: #106ee2;
  border-radius: 12px;
  padding: 1px 2px;
}
//.tree-item-shared-empty-expand {
//  color: white;
//  position: absolute;
//  top: 0px;
//  left: 44px;
//  font-size: 12px;
//  transform: scale(0.8);
//  line-height: 12px;
//  background-color: #106ee2;
//  border-radius: 12px;
//  padding: 1px 2px;
//}

.icon-folder-python-color {
  color: #3cb3ff;
  font-size: 1.4em;
}

.icon-yonghuPython-color {
  color: #d4c46f;
}
.icon-sql-color {
  color: green;
}

.icon-stream-color {
  color: blue;
  font-size: 0.6rem;
}

.icon-java-color {
  color: orangered;
}

.icon-python-color {
  color: blue;
}

.icon-scala-color {
  color: red;
}

.icon-fold-color {
  color: #c5c8ce;
  font-size: 18px;
}

.icon-shell-color {
  color: #7b7b7b;
}