im-var.scss 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. // 颜色
  2. $im-color-primary: #3e45d7;
  3. $im-color-primary-light-1: mix(#fff, $im-color-primary, 10%);
  4. $im-color-primary-light-2: mix(#fff, $im-color-primary, 20%);
  5. $im-color-primary-light-3: mix(#fff, $im-color-primary, 30%);
  6. $im-color-primary-light-4: mix(#fff, $im-color-primary, 40%);
  7. $im-color-primary-light-5: mix(#fff, $im-color-primary, 50%);
  8. $im-color-primary-light-6: mix(#fff, $im-color-primary, 60%);
  9. $im-color-primary-light-7: mix(#fff, $im-color-primary, 70%);
  10. $im-color-primary-light-8: mix(#fff, $im-color-primary, 80%);
  11. $im-color-primary-light-9: mix(#fff, $im-color-primary, 90%);
  12. $im-color-primary-dark-1: mix(#000, $im-color-primary, 10%);
  13. $im-color-primary-dark-2: mix(#000, $im-color-primary, 20%);
  14. $im-color-primary-dark-3: mix(#000, $im-color-primary, 30%);
  15. $im-color-primary-dark-4: mix(#000, $im-color-primary, 40%);
  16. $im-color-success: #18bc37;
  17. $im-color-warning: #f3a73f;
  18. $im-color-danger: #e43d33;
  19. $im-color-info: #8f939c;
  20. // 文字颜色
  21. $im-text-color: #000000;
  22. $im-text-color-light: #6a6a6a;
  23. $im-text-color-lighter: #909399;
  24. $im-text-color-lighter-extra: #c7c7c7;
  25. // 边框颜色
  26. $im-border: #F0F0F0;
  27. $im-border-light: #EDEDED;
  28. $im-border-lighter: #DCDCDC;
  29. $im-border-lighter-extra: #B9B9B9;
  30. // 文字大小
  31. $im-font-size: 30rpx;
  32. $im-font-size-small: 28rpx;
  33. $im-font-size-smaller: 26rpx;
  34. $im-font-size-smaller-extra: 24rpx;
  35. $im-font-size-large: 32rpx;
  36. $im-font-size-larger: 34rpx;
  37. $im-font-size-larger-extra: 36rpx;
  38. // 阴影
  39. $im-box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
  40. $im-box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  41. $im-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, .12);
  42. $im-box-shadow-dark: 0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
  43. // 背景
  44. $im-bg: #f8f9ff;
  45. $im-bg-linear: linear-gradient(135deg, #f8f9ff 0%, #ffffff 100%);
  46. $im-bg-active: #f7f8fc;
  47. $im-bg-active-dark: $im-color-primary-light-9;
  48. $im-bg-input: #fafafa;
  49. // 标题
  50. $im-title-size: 26px;
  51. $im-title-size-1: 22px;
  52. $im-title-size-2: 18px;
  53. $font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
  54. $im-nav-bar-height: 50px;