layout.scss 786 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. @use "sass:string";
  2. $position: top, right, bottom, left;
  3. @each $item in $position {
  4. .m#{string.slice($item, 0, 1)}-auto {
  5. margin-#{$item}: auto;
  6. }
  7. .m#{string.slice($item, 0, 1)}-0 {
  8. margin-#{$item}: 0px;
  9. }
  10. }
  11. @for $i from 2 to 100 {
  12. @each $item in $position {
  13. .m#{string.slice($item, 0, 1)}-#{$i} {
  14. margin-#{$item}: #{$i}rpx;
  15. }
  16. .p#{string.slice($item, 0, 1)}-#{$i} {
  17. padding-#{$item}: #{$i}rpx;
  18. }
  19. }
  20. .height-#{$i} {
  21. height: #{$i}rpx;
  22. }
  23. .width-#{$i} {
  24. width: #{$i}rpx;
  25. }
  26. .br-#{$i} {
  27. border-radius: #{$i}rpx;
  28. }
  29. }
  30. .br-round {
  31. border-radius: 50%;
  32. }
  33. .mb-0 {
  34. margin-bottom: 0px;
  35. }
  36. .ml-auto {
  37. margin-left: auto;
  38. }
  39. .mt-auto {
  40. margin-top: auto;
  41. }
  42. .width-168 {
  43. width: 168rpx;
  44. }
  45. .width-half {
  46. width: 50%;
  47. }