_triangle.less 781 B

123456789101112131415161718192021222324252627282930313233343536
  1. .triangle {
  2. content: ' ';
  3. display: block;
  4. width: 0;
  5. height: 0;
  6. padding: 0 !important;
  7. line-height: 0;
  8. font-size: 0;
  9. border-style: solid;
  10. border-color: transparent;
  11. }
  12. .triangle-top(@color, @width: 10px, @height: @width) {
  13. .triangle;
  14. border-width: @height (@width/2);
  15. border-top-color: @color;
  16. }
  17. .triangle-bottom(@color, @width: 10px, @height: @width) {
  18. .triangle;
  19. border-width: @height (@width/2);
  20. border-bottom-color: @color;
  21. }
  22. .triangle-left(@color, @width: 10px, @height: @width) {
  23. .triangle;
  24. border-width: (@height/2) @width;
  25. border-left-color: @color;
  26. }
  27. .triangle-right(@color, @width: 10px, @height: @width) {
  28. .triangle;
  29. border-width: (@height/2) @width;
  30. border-right-color: @color;
  31. }