base.scss 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. /**
  2. *全局公共样式
  3. */
  4. .app-content {
  5. // line-height: 1;
  6. background-color: $backColor;
  7. height: 100vh;
  8. overflow-y: auto;
  9. }
  10. /* #ifdef H5 */
  11. .app-content.app-main {
  12. min-height: calc(100vh - 100upx);
  13. }
  14. /* #endif */
  15. .gray_txt {
  16. color: #999 !important;
  17. }
  18. .ph {
  19. font-size: 30upx;
  20. color: gray;
  21. }
  22. .w100 {
  23. width: 100% !important;
  24. }
  25. .ml0{
  26. margin-left: 0 !important;
  27. }
  28. .text_main_color {
  29. color: #ff9000;
  30. }
  31. .underline {
  32. text-decoration: underline;
  33. }
  34. .separate_line {
  35. color: #999;
  36. margin: 0 16upx;
  37. }
  38. .text_sub_com {
  39. color: #999;
  40. font-size: 24upx;
  41. }
  42. .flex {
  43. display: flex;
  44. }
  45. .flex-center-center {
  46. @extend .flex;
  47. align-items: center;
  48. justify-content: center;
  49. }
  50. .flex-center {
  51. display: flex;
  52. align-items: center;
  53. }
  54. .flex-start {
  55. @extend .flex;
  56. align-items: flex-start;
  57. }
  58. .flex-end {
  59. @extend .flex;
  60. align-items: flex-end;
  61. }
  62. .flex-center-between {
  63. @extend .flex;
  64. align-items: center;
  65. justify-content: space-between;
  66. }
  67. .flex-center-around {
  68. @extend .flex;
  69. align-items: center;
  70. justify-content: space-around;
  71. }
  72. .flex-center-evenly {
  73. @extend .flex;
  74. align-items: center;
  75. justify-content: space-evenly;
  76. }
  77. .flex-center-start {
  78. @extend .flex;
  79. align-items: center;
  80. justify-content: flex-start;
  81. }
  82. .flex-center-end {
  83. @extend .flex;
  84. align-items: center;
  85. justify-content: flex-end;
  86. }
  87. // =================== 定义的全局字体普通样式 ========================
  88. .app-padding {
  89. padding: 0 30upx;
  90. }
  91. .app-color-0 {
  92. color: $fontColorMain;
  93. }
  94. .app-color-1 {
  95. color: $mainColor;
  96. }
  97. .app-color-2 {
  98. color: $fontColor2;
  99. }
  100. .app-color-3 {
  101. color: $fontColor3;
  102. }
  103. .app-color-4 {
  104. color: $mainColor1;
  105. }
  106. // 金额
  107. .app-price {
  108. color: #FF2842;
  109. }
  110. .app-bold {
  111. font-weight: bold;
  112. }
  113. .app-size-24 {
  114. font-size: 24upx;
  115. }
  116. .app-size-26 {
  117. font-size: 26upx;
  118. }
  119. .app-size-28 {
  120. font-size: 28upx;
  121. }
  122. .app-size-30 {
  123. font-size: 30upx;
  124. }
  125. .app-size-32 {
  126. font-size: 32upx;
  127. }
  128. .app-size-34 {
  129. font-size: 34upx;
  130. }
  131. .app-size-36 {
  132. font-size: 36upx;
  133. }
  134. .app-size-38 {
  135. font-size: 38upx;
  136. }
  137. .app-size-40 {
  138. font-size: 40upx;
  139. }