resizable_modal.less 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. @ui-resizable-handle-size: 9px;
  2. @ui-resizable-handle-corner-size: @ui-resizable-handle-size * 1.7;
  3. .ui-resizable-handle {
  4. position: absolute;
  5. font-size: 0.1px;
  6. display: block;
  7. -ms-touch-action: none;
  8. touch-action: none;
  9. //background: rgba(255, 255, 0, .5);
  10. }
  11. .ui-resizable-e {
  12. cursor: e-resize;
  13. width: @ui-resizable-handle-size;
  14. right: 0;
  15. top: 0;
  16. bottom: 0;
  17. }
  18. .ui-resizable-w {
  19. cursor: w-resize;
  20. width: @ui-resizable-handle-size;
  21. left: 0;
  22. top: 0;
  23. bottom: 0;
  24. }
  25. .ui-resizable-s {
  26. cursor: s-resize;
  27. height: @ui-resizable-handle-size;
  28. left: 0;
  29. right: 0;
  30. bottom: 0;
  31. }
  32. .ui-resizable-n {
  33. cursor: n-resize;
  34. height: @ui-resizable-handle-size;
  35. left: 0;
  36. right: 0;
  37. top: 0;
  38. }
  39. .ui-resizable-se {
  40. cursor: se-resize;
  41. width: @ui-resizable-handle-corner-size;
  42. height: @ui-resizable-handle-corner-size;
  43. right: -2px;
  44. bottom: -2px;
  45. transform: translate(10%, 10%);
  46. }
  47. .ui-resizable-sw {
  48. cursor: sw-resize;
  49. width: @ui-resizable-handle-corner-size;
  50. height: @ui-resizable-handle-corner-size;
  51. left: -2px;
  52. bottom: -2px;
  53. }
  54. .ui-resizable-ne {
  55. cursor: ne-resize;
  56. width: @ui-resizable-handle-corner-size;
  57. height: @ui-resizable-handle-corner-size;
  58. right: -2px;
  59. top: -2px;
  60. }
  61. .ui-resizable-nw {
  62. cursor: nw-resize;
  63. width: @ui-resizable-handle-corner-size;
  64. height: @ui-resizable-handle-corner-size;
  65. left: -2px;
  66. top: -2px;
  67. }