jstree.css 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. .jstree-contextmenu{
  2. z-index: 999999;
  3. }
  4. .jstree-contextmenu {
  5. z-index: 3000
  6. }
  7. .jstree-contextmenu.jstree-default-contextmenu {
  8. border: 1px solid #d6d6d6;
  9. box-shadow: 0 0 8px rgba(99,99,99,.3);
  10. background-color: #f6f6f6;
  11. padding: 0
  12. }
  13. .jstree-contextmenu.jstree-default-contextmenu li {
  14. display: block
  15. }
  16. .jstree-contextmenu.jstree-default-contextmenu .vakata-context-separator {
  17. display: none
  18. }
  19. .jstree-contextmenu.jstree-default-contextmenu .vakata-contextmenu-sep {
  20. display: none
  21. }
  22. .jstree-contextmenu.jstree-default-contextmenu li a {
  23. border-bottom: 0;
  24. height: 30px;
  25. line-height: 24px;
  26. padding-top: 3px;
  27. padding-bottom: 3px
  28. }
  29. .jstree-contextmenu.jstree-default-contextmenu li.vakata-context-hover a {
  30. text-shadow: none;
  31. background: #116cd6;
  32. box-shadow: none;
  33. color: #fff
  34. }
  35. .jstree-contextmenu.jstree-default-contextmenu li>a>i:empty {
  36. width: 24px;
  37. height: 24px;
  38. line-height: 24px;
  39. vertical-align: middle
  40. }
  41. .jstree .jstree-node .jstree-anchor {
  42. padding-right: 36px;
  43. color: #666
  44. }
  45. .jstree .jstree-node .m-tree-operate {
  46. position: absolute;
  47. right: 6px;
  48. z-index: 100;
  49. display: block
  50. }
  51. .jstree .jstree-node .m-tree-operate .operate-show {
  52. font-size: 20px;
  53. color: #999;
  54. display: none
  55. }
  56. .jstree .jstree-node .m-tree-operate .operate-show i {
  57. height: 24px;
  58. line-height: 24px;
  59. vertical-align: top;
  60. margin-top: 1px;
  61. display: inline-block;
  62. font-size: 18px;
  63. transition-property: transform;
  64. transition-duration: .3s;
  65. transition-timing-function: .3s;
  66. transition-delay: 0s;
  67. -moz-transition-property: transform;
  68. -moz-transition-duration: .3s;
  69. -moz-transition-timing-function: .3s;
  70. -moz-transition-delay: 0s;
  71. -webkit-transition-property: transform;
  72. -webkit-transition-duration: .3s;
  73. -webkit-transition-timing-function: .3s;
  74. -webkit-transition-delay: 0s;
  75. -o-transition-property: transform;
  76. -o-transition-duration: .3s;
  77. -o-transition-timing-function: .3s;
  78. -o-transition-delay: 0s
  79. }
  80. .jstree .jstree-node .m-tree-operate .operate-hide {
  81. width: 0;
  82. right: 100%;
  83. top: 2px;
  84. position: absolute;
  85. overflow: hidden;
  86. transition-property: width;
  87. transition-duration: .3s;
  88. transition-timing-function: linear;
  89. transition-delay: 0s;
  90. -moz-transition-property: width;
  91. -moz-transition-duration: .3s;
  92. -moz-transition-timing-function: linear;
  93. -moz-transition-delay: 0s;
  94. -webkit-transition-property: width;
  95. -webkit-transition-duration: .3s;
  96. -webkit-transition-timing-function: linear;
  97. -webkit-transition-delay: 0s;
  98. -o-transition-property: width;
  99. -o-transition-duration: .3s;
  100. -o-transition-timing-function: linear;
  101. -o-transition-delay: 0s
  102. }
  103. .jstree .jstree-node .m-tree-operate .operate-hide b {
  104. font-size: 12px;
  105. display: inline-block;
  106. margin: 3px 2px 0;
  107. vertical-align: top;
  108. width: 18px;
  109. height: 18px;
  110. text-align: center;
  111. line-height: 18px;
  112. border-radius: 9px;
  113. color: #fff;
  114. cursor: pointer
  115. }
  116. .jstree .jstree-node .m-tree-operate .operate-hide b.add {
  117. background-color: #39f
  118. }
  119. .jstree .jstree-node .m-tree-operate .operate-hide b.del {
  120. background-color: #c00
  121. }
  122. .jstree .jstree-node .m-tree-operate .operate-hide b.edit {
  123. background-color: #e5b120
  124. }
  125. .jstree .jstree-node .m-tree-operate .operate-hide b.up {
  126. background-color: #3e8a2a;
  127. font-size: 18px
  128. }
  129. .jstree .jstree-node .m-tree-operate .operate-hide b.down {
  130. background-color: #3e8a2a;
  131. font-size: 18px
  132. }
  133. .jstree .jstree-node .m-tree-operate:hover .operate-hide {
  134. width: 108px
  135. }
  136. .jstree .jstree-node .m-tree-operate:hover .operate-show i {
  137. color: #333;
  138. transform: rotate(360deg);
  139. -ms-transform: rotate(360deg);
  140. -moz-transform: rotate(360deg);
  141. -webkit-transform: rotate(360deg);
  142. -o-transform: rotate(360deg)
  143. }
  144. .jstree .jstree-node .jstree-anchor.jstree-clicked ,.jstree .jstree-hovered{
  145. color: #ffffff !important;
  146. }
  147. .jstree .jstree-node .m-tree-operate.operate-hover .operate-hide {
  148. width: 108px
  149. }
  150. .jstree-default .jstree-wholerow-hovered {
  151. background: #08c;
  152. color: white !important;
  153. }
  154. .jstree-default .jstree-wholerow-clicked {
  155. background: #10af88;
  156. background: -webkit-linear-gradient(top, #beebff 0%, #a8e4ff 100%);
  157. background: linear-gradient(to bottom, #10af88 0%, #10af88 100%);
  158. color: #ffffff;
  159. }
  160. .jstree-default .jstree-wholerow {
  161. height: 30px;
  162. }
  163. .jstree-default .jstree-node {
  164. min-height: 30px;
  165. line-height: 30px;
  166. margin-left: 30px;
  167. min-width: 30px;
  168. }
  169. .jstree-default .jstree-node {
  170. min-height: 20px;
  171. line-height: 20px;
  172. margin-left: 20px;
  173. min-width: 20px;
  174. }
  175. .jstree-default .jstree-anchor {
  176. line-height: 30px;
  177. height: 30px;
  178. }