index.less 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. @resizable-prefix-cls: ~'nz-resizable';
  2. .@{resizable-prefix-cls} {
  3. &-preview {
  4. position: absolute;
  5. top: 0;
  6. left: 0;
  7. z-index: 8;
  8. border: 1px dashed #d1d1d1;
  9. }
  10. &-handle {
  11. position: absolute;
  12. z-index: 9;
  13. user-select: none;
  14. &-top {
  15. top: -5px;
  16. left: 0;
  17. width: 100%;
  18. height: 10px;
  19. }
  20. &-right {
  21. top: 0;
  22. right: -5px;
  23. width: 10px;
  24. height: 100%;
  25. }
  26. &-bottom {
  27. bottom: -5px;
  28. left: 0;
  29. width: 100%;
  30. height: 10px;
  31. }
  32. &-left {
  33. top: 0;
  34. left: -5px;
  35. width: 10px;
  36. height: 100%;
  37. }
  38. &-topRight {
  39. top: -5px;
  40. right: -5px;
  41. z-index: 10;
  42. width: 20px;
  43. height: 20px;
  44. }
  45. &-bottomRight {
  46. right: -5px;
  47. bottom: -5px;
  48. z-index: 10;
  49. width: 20px;
  50. height: 20px;
  51. }
  52. &-bottomLeft {
  53. bottom: -5px;
  54. left: -5px;
  55. z-index: 10;
  56. width: 20px;
  57. height: 20px;
  58. }
  59. &-topLeft {
  60. top: -5px;
  61. left: -5px;
  62. z-index: 10;
  63. width: 20px;
  64. height: 20px;
  65. }
  66. }
  67. .@{resizable-prefix-cls}-handle {
  68. &-cursor-type {
  69. &-window {
  70. &.@{resizable-prefix-cls}-handle {
  71. &-top,
  72. &-bottom {
  73. cursor: ns-resize;
  74. }
  75. &-right,
  76. &-left {
  77. cursor: ew-resize;
  78. }
  79. }
  80. }
  81. &-grid {
  82. &.@{resizable-prefix-cls}-handle {
  83. &-top,
  84. &-bottom {
  85. cursor: row-resize;
  86. }
  87. &-right,
  88. &-left {
  89. cursor: col-resize;
  90. }
  91. }
  92. }
  93. }
  94. &-bottomRight,
  95. &-topLeft {
  96. cursor: nwse-resize;
  97. }
  98. &-bottomLeft,
  99. &-topRight {
  100. cursor: nesw-resize;
  101. }
  102. }
  103. &-disabled {
  104. .@{resizable-prefix-cls} {
  105. &-handle {
  106. pointer-events: none;
  107. }
  108. }
  109. }
  110. }