rtl.less 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. @import '../../style/themes/index';
  2. @import '../../style/mixins/index';
  3. @import '../../checkbox/style/mixin';
  4. @tree-prefix-cls: ~'@{ant-prefix}-tree';
  5. @select-tree-prefix-cls: ~'@{ant-prefix}-select-tree';
  6. @tree-node-prefix-cls: ~'@{tree-prefix-cls}-treenode';
  7. .@{tree-prefix-cls} {
  8. &-rtl {
  9. direction: rtl;
  10. .@{tree-prefix-cls}-node-content-wrapper[draggable='true'] {
  11. .@{tree-prefix-cls}-drop-indicator {
  12. &::after {
  13. right: -6px;
  14. left: unset;
  15. }
  16. }
  17. }
  18. }
  19. // ===================== TreeNode =====================
  20. .@{tree-node-prefix-cls} {
  21. &-rtl {
  22. direction: rtl;
  23. }
  24. }
  25. // >>> Switcher
  26. &-switcher {
  27. &_close {
  28. .@{tree-prefix-cls}-switcher-icon {
  29. svg {
  30. .@{tree-prefix-cls}-rtl & {
  31. transform: rotate(90deg);
  32. }
  33. }
  34. }
  35. }
  36. }
  37. // ==================== Show Line =====================
  38. &-show-line {
  39. // ================ Indent lines ================
  40. .@{tree-prefix-cls}-indent {
  41. &-unit {
  42. &::before {
  43. .@{tree-prefix-cls}-rtl& {
  44. right: auto;
  45. left: -(@tree-title-height / 2) - 1px;
  46. border-right: none;
  47. border-left: 1px solid @border-color-base;
  48. }
  49. }
  50. }
  51. }
  52. }
  53. // >>> Checkbox
  54. &-checkbox {
  55. .@{tree-prefix-cls}-rtl & {
  56. margin: ((@tree-title-height - @checkbox-size) / 2) 0 0 8px;
  57. }
  58. }
  59. }
  60. .@{select-tree-prefix-cls} {
  61. // >>> Checkbox
  62. &-checkbox {
  63. .@{tree-prefix-cls}-select-dropdown-rtl & {
  64. margin: ((@tree-title-height - @checkbox-size) / 2) 0 0 8px;
  65. }
  66. }
  67. }