mixin.less 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. @import '../../style/mixins/index';
  2. @row-prefix-cls: ~'@{ant-prefix}-row';
  3. @col-prefix-cls: ~'@{ant-prefix}-col';
  4. // mixins for grid system
  5. // ------------------------
  6. .loop-grid-columns(@index, @class) when (@index > 0) {
  7. .@{col-prefix-cls}@{class}-@{index} {
  8. display: block;
  9. flex: 0 0 percentage((@index / @grid-columns));
  10. max-width: percentage((@index / @grid-columns));
  11. }
  12. .@{col-prefix-cls}@{class}-push-@{index} {
  13. left: percentage((@index / @grid-columns));
  14. }
  15. .@{col-prefix-cls}@{class}-pull-@{index} {
  16. right: percentage((@index / @grid-columns));
  17. }
  18. .@{col-prefix-cls}@{class}-offset-@{index} {
  19. margin-left: percentage((@index / @grid-columns));
  20. }
  21. .@{col-prefix-cls}@{class}-order-@{index} {
  22. order: @index;
  23. }
  24. .loop-grid-columns((@index - 1), @class);
  25. }
  26. .loop-grid-columns(@index, @class) when (@index = 0) {
  27. .@{col-prefix-cls}@{class}-@{index} {
  28. display: none;
  29. }
  30. .@{col-prefix-cls}-push-@{index} {
  31. left: auto;
  32. }
  33. .@{col-prefix-cls}-pull-@{index} {
  34. right: auto;
  35. }
  36. .@{col-prefix-cls}@{class}-push-@{index} {
  37. left: auto;
  38. }
  39. .@{col-prefix-cls}@{class}-pull-@{index} {
  40. right: auto;
  41. }
  42. .@{col-prefix-cls}@{class}-offset-@{index} {
  43. margin-left: 0;
  44. }
  45. .@{col-prefix-cls}@{class}-order-@{index} {
  46. order: 0;
  47. }
  48. }
  49. .make-grid(@class: ~'') {
  50. .loop-grid-columns(@grid-columns, @class);
  51. }