wing-space-height.scss 956 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. //高度,两翼,空格相关样式
  2. @use "../define/wing-height.scss" as *;
  3. .height {
  4. @each $key, $size in $heights {
  5. &-#{''+$key} {
  6. height: $size;
  7. }
  8. }
  9. }
  10. .gap {
  11. @each $key, $size in $heights {
  12. &-#{''+$key} {
  13. gap: $size;
  14. }
  15. }
  16. }
  17. .row-gap {
  18. @each $key, $size in $heights {
  19. &-#{''+$key} {
  20. row-gap: $size;
  21. }
  22. }
  23. }
  24. .column-gap {
  25. @each $key, $size in $heights {
  26. &-#{''+$key} {
  27. column-gap: $size;
  28. }
  29. }
  30. }
  31. .wing {
  32. @each $key, $size in $wings {
  33. &-#{''+$key} {
  34. margin-left: $size;
  35. margin-right: $size;
  36. }
  37. }
  38. }
  39. .padding-wing {
  40. @each $key, $size in $wings {
  41. &-#{''+$key} {
  42. padding-left: $size;
  43. padding-right: $size;
  44. }
  45. }
  46. }
  47. .space {
  48. @each $key, $size in $space {
  49. &-#{''+$key} {
  50. margin-top: $size;
  51. margin-bottom: $size;
  52. }
  53. }
  54. }
  55. .h {
  56. @for $i from 0 through 20 {
  57. &-#{$i * 5} {
  58. height: $i * 5%;
  59. }
  60. }
  61. }
  62. .w {
  63. @for $i from 0 through 20 {
  64. &-#{$i * 5} {
  65. width: $i * 5%;
  66. }
  67. }
  68. }