uni.scss 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. .text-center {
  2. text-align: center;
  3. }
  4. .font-weight {
  5. font-weight: bold;
  6. }
  7. // 屏幕宽度
  8. .page-width {
  9. width: 100%;
  10. }
  11. .goods-hover-class {
  12. opacity: .9;
  13. background-color: #f7f7f7;
  14. }
  15. // 背景图片
  16. .background-image {
  17. background-repeat: no-repeat;
  18. background-size: 100% 100%;
  19. background-position: center;
  20. }
  21. // 重要
  22. $uni-important-color-red: #ff4544; // 小面积使用,用于特别强调和突出的文字,按钮和icon
  23. $uni-important-color-black: #353535;// 用于重要级文字信息、标题信息等
  24. // 一般
  25. $uni-general-color-one: #666666;// 用于普通段落信息
  26. $uni-general-color-two: #999999;// 用于辅助、次要文字信息
  27. $uni-general-color-three: #cdcdcd;// 用于灰按钮、占位文字
  28. // 较弱
  29. $uni-weak-color-one: #e2e2e2;// 用于分割线
  30. $uni-weak-color-two: #f7f7f7;// 用于内容区域底色
  31. // 重要
  32. $uni-font-size-import-one: 36rpx; // 用在少量标题
  33. $uni-line-height-import-one: 44rpx;
  34. $uni-font-size-import-two: 32rpx; // 用于一些较为重要的文字或操作按钮
  35. $uni-line-height-import-two: 40rpx;
  36. // 一般
  37. $uni-font-size-general-one: 28rpx;// 用于大多数文字
  38. $uni-line-height-general-one: 36rpx;
  39. $uni-font-size-general-two: 26rpx;// 用于大多数文字
  40. $uni-line-height-general-two: 32rpx;
  41. // 弱
  42. $uni-font-size-weak-one: 24rpx; // 用于辅助性文字
  43. $uni-line-height-weak-one: 30rpx;
  44. $uni-font-size-weak-two: 22rpx; // 用于辅助性文字
  45. $uni-line-height-weak-two: 28rpx;
  46. /*全局文字大小*/
  47. $uni-font-size: 32rpx;
  48. /* 屏幕宽度*/
  49. $screen-width: 750rpx;
  50. page {
  51. font-size: $uni-font-size;
  52. background: $uni-weak-color-two;
  53. }
  54. .page-width {
  55. width: 100%;
  56. }
  57. // 交互优化
  58. .u-hover-class {
  59. opacity: .9;
  60. background-color: #f7f7f7;
  61. }
  62. .safe-area-inset-bottom {
  63. padding-bottom: 0;
  64. padding-bottom: constant(safe-area-inset-bottom);
  65. padding-bottom: env(safe-area-inset-bottom);
  66. }