uni.scss 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. /* 页面左右间距 */
  2. $page-row-spacing: 30rpx;
  3. //页面基础颜色
  4. $page-color-base: #f8f8f8;//页面背景颜色
  5. $page-color-light: #f8f6fc;
  6. // 主题颜色
  7. $base-color: #970000;//项目颜色
  8. $box-shadow-color:#5dbc7c;//阴影颜色
  9. $font-color:#ff4c4c;//字体颜色
  10. $font-color-spec: #5dbc7c;//可操作文字颜色
  11. $background-color:#5dbc7c;//按钮背景颜色
  12. // 小图标大小
  13. $uni-img-size-base:36rpx;
  14. /* 文字尺寸 */
  15. $font-sm: 24rpx;
  16. $font-base: 28rpx;
  17. $font-lg: 32rpx;
  18. $ltl-size-mid: 32rpx;
  19. $ltl-size-lg:28rpx;
  20. $ltl-size-big: 36rpx;
  21. /*文字颜色*/
  22. $font-color-dark: #303133;//黑
  23. $font-color-base: #606266;//基础
  24. $font-color-white:#ffffff;//白色
  25. $font-color-light: #909399;//灰色
  26. $font-color-disabled: #c0c4cc;//禁用
  27. /* 边框颜色 */
  28. $border-color-dark: #dcdfe6;//黑
  29. $border-color-base: #e4e7ed;//基础灰
  30. $border-color-light: #ebeef5;//亮灰
  31. // uni自带边框颜色
  32. $uni-border-color:#ebeef5;
  33. /*颜色*/
  34. $color-yellow: #fd5b23;
  35. $color-gray: #999999;
  36. $color-green: #5dbc7c;
  37. $color-red: #dd524d;
  38. /* 图片加载中颜色 */
  39. $image-bg-color: #eee;
  40. /* 行为相关颜色 */
  41. $uni-color-primary: #5dbc7c;
  42. $uni-color-success: #4cd964;
  43. $uni-color-warning: #f0ad4e;
  44. $uni-color-error: #dd524d;
  45. // 提交框阴影
  46. $box-shadow: 0rpx 0rpx 10rpx 10rpx #f3f3f3;
  47. // 圆角
  48. $border-radius-sm: 15rpx;
  49. // 渐变背景颜色
  50. $bg-green-gradual: linear-gradient(#5dbc7c, #71d094);
  51. /* 功能栏字体大小 */
  52. %font-title {
  53. font-size: $font-lg + 2rpx;
  54. color: $font-color-dark;
  55. line-height: 1;
  56. font-weight: bold;
  57. }
  58. // 功能栏字体包裹框
  59. %font-title-box {
  60. flex: 1;
  61. display: flex;
  62. flex-direction: column;
  63. }
  64. /*功能栏左侧小图标*/
  65. %f-left-icon {
  66. height: $font-lg + 2rpx;
  67. width: 8rpx;
  68. background-image: $bg-green-gradual;
  69. margin-right: 10rpx;
  70. border-radius: 10rpx;
  71. }