uni.scss 1.8 KB

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