directory.less 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. @import '../../style/themes/index';
  2. @tree-prefix-cls: ~'@{ant-prefix}-tree';
  3. .@{tree-prefix-cls}.@{tree-prefix-cls}-directory {
  4. // ================== TreeNode ==================
  5. .@{tree-prefix-cls}-treenode {
  6. position: relative;
  7. // Hover color
  8. &::before {
  9. position: absolute;
  10. top: 0;
  11. right: 0;
  12. bottom: 4px;
  13. left: 0;
  14. transition: background-color 0.3s;
  15. content: '';
  16. pointer-events: none;
  17. }
  18. &:hover {
  19. &::before {
  20. background: @item-hover-bg;
  21. }
  22. }
  23. // Elements
  24. > * {
  25. z-index: 1;
  26. }
  27. // >>> Switcher
  28. .@{tree-prefix-cls}-switcher {
  29. transition: color 0.3s;
  30. }
  31. // >>> Title
  32. .@{tree-prefix-cls}-node-content-wrapper {
  33. border-radius: 0;
  34. user-select: none;
  35. &:hover {
  36. background: transparent;
  37. }
  38. &.@{tree-prefix-cls}-node-selected {
  39. color: @tree-directory-selected-color;
  40. background: transparent;
  41. }
  42. }
  43. // ============= Selected =============
  44. &-selected {
  45. &:hover::before,
  46. &::before {
  47. background: @tree-directory-selected-bg;
  48. }
  49. // >>> Switcher
  50. .@{tree-prefix-cls}-switcher {
  51. color: @tree-directory-selected-color;
  52. }
  53. // >>> Title
  54. .@{tree-prefix-cls}-node-content-wrapper {
  55. color: @tree-directory-selected-color;
  56. background: transparent;
  57. }
  58. }
  59. }
  60. }