mycss.scss 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. @import './var.scss';
  2. .my-fontsize-normal {
  3. font-size: $fontSizeNormal;
  4. color: $fontColor;
  5. }
  6. .my-fontsize-Large {
  7. font-size: $fontSizeLarge;
  8. }
  9. .my-fontsize-Small {
  10. font-size: $fontSizeSmall;
  11. }
  12. .my-fontsize-title {
  13. font-size: $fontSizeTitle;
  14. }
  15. .my-flex {
  16. display: flex;
  17. justify-content: center;
  18. align-items: center;
  19. }
  20. .flex-column {
  21. display: flex;
  22. flex-direction: column;
  23. justify-content: space-between;
  24. align-items: flex-start;
  25. }
  26. .flex-column-center {
  27. display: flex;
  28. flex-direction: column;
  29. justify-content: center;
  30. align-items: center;
  31. }
  32. .flex-between {
  33. display: flex;
  34. justify-content: space-between;
  35. align-items: center;
  36. }
  37. .flex-around {
  38. display: flex;
  39. justify-content: space-around;
  40. align-items: center;
  41. }
  42. .flex-start {
  43. display: flex;
  44. justify-content: flex-start;
  45. align-items: center;
  46. }
  47. .flex-end {
  48. display: flex;
  49. justify-content: flex-end;
  50. align-items: center;
  51. }
  52. .line {
  53. position: relative;
  54. &::before {
  55. content: '';
  56. position: absolute;
  57. top: 50%;
  58. left: 0;
  59. transform: translateY(-50%);
  60. width: 6rpx;
  61. height: $fontSizeNormal;
  62. border-radius: 2rpx;
  63. background-color: #3F92F9;
  64. }
  65. }