setArrow.less 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. ._setArrow(@arrowsize, @borderColor, @borderWidth){
  2. display: inline-block;
  3. height: @arrowsize;
  4. width: @arrowsize;
  5. border-width: @borderWidth @borderWidth 0 0;
  6. border-color: @borderColor;
  7. border-style: solid;
  8. }
  9. .setArrow(@direction, @arrowsize, @borderColor, @borderWidth) when (@direction = top) {
  10. ._setArrow(@arrowsize, @borderColor, @borderWidth);
  11. transform: matrix(0.71,-0.71,0.71,0.71,0,0); // rotate(-45deg)
  12. }
  13. .setArrow(@direction, @arrowsize, @borderColor,@borderWidth) when (@direction = right) {
  14. ._setArrow(@arrowsize, @borderColor, @borderWidth);
  15. transform: matrix(0.71,0.71,-0.71,0.71,0,0); // rotate(45deg);
  16. position: relative;
  17. top: -2px;
  18. }
  19. .setArrow(@direction, @arrowsize, @borderColor,@borderWidth) when (@direction = down) {
  20. ._setArrow(@arrowsize, @borderColor, @borderWidth);
  21. transform: matrix(-0.71,0.71,-0.71,-0.71,0,0); // rotate(135deg);
  22. position: relative;
  23. top: -3px;
  24. }
  25. .setArrow(@direction, @arrowsize, @borderColor,@borderWidth) when (@direction = left) {
  26. ._setArrow(@arrowsize, @borderColor, @borderWidth);
  27. transform: matrix(-0.71,-0.71,0.71,-0.71,0,0); // rotate(-135deg);
  28. position: relative;
  29. top: -2px;
  30. }