size.scss 782 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. /**
  2. * 尺寸相关快捷样式类
  3. *
  4. * @since 1.0.0
  5. * @version 1.0.0
  6. */
  7. $ui-width: namespace('w');
  8. $ui-height: namespace('h');
  9. $ui-size-map: (
  10. '0': 0,
  11. '10': 10%,
  12. '20': 20%,
  13. '25': 25%,
  14. '30': 30%,
  15. '40': 40%,
  16. '50': 50%,
  17. '60': 60%,
  18. '70': 70%,
  19. '75': 75%,
  20. '80': 80%,
  21. '90': 90%,
  22. '100': 100%,
  23. 'auto': auto,
  24. );
  25. @each $key, $value in $ui-size-map {
  26. .#{$ui-width + $key} {
  27. width: $value;
  28. }
  29. .#{$ui-height + $key} {
  30. height: $value;
  31. }
  32. }
  33. /* ==========================================================================
  34. 常用的尺寸定义
  35. ========================================================================== */
  36. .wfull {
  37. width: 100vw;
  38. }
  39. .hfull {
  40. height: 100vh;
  41. }
  42. .wmfull {
  43. min-width: 100vw;
  44. }
  45. .hmfull {
  46. min-height: 100vh;
  47. }