var.scss 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. // 颜色
  2. $--color-red: #fc625d;
  3. $--color-warn: #fcbc40;
  4. $--color-success: #34c749;
  5. // 文字
  6. $--color-text: #1d2129;
  7. $--color-text-1: #4e5969;
  8. $--color-text-2: #86909c;
  9. $--color-text-3: #c9cdd4;
  10. $--color-text-4: #f2f3f5;
  11. // 变亮值
  12. $--light-shalow: 2%;
  13. // 白色
  14. $--color-light-bg: #fff;
  15. $--color-light-bg-1: #fafafc;
  16. $--color-light-bg-1-shallow: lighten($--color-light-bg-1, $--light-shalow);
  17. $--color-light-bg-2: #f2f3f5;
  18. $--color-light-bg-2-shallow: lighten($--color-light-bg-2, $--light-shalow);
  19. $--color-light-bg-3: #e5e6eb;
  20. $--color-light-bg-3-shallow: lighten($--color-light-bg-3, $--light-shalow);
  21. $--color-light-bg-4: #e3e3e4;
  22. $--color-light-bg-4-shallow: lighten($--color-light-bg-4, $--light-shalow);
  23. $--color-light-bg-5: #bebebe;
  24. $--color-light-bg-5-shallow: lighten($--color-light-bg-5, $--light-shalow);
  25. $--color-light-border: #efeff5;
  26. // 变暗值
  27. $--dark-shalow: 2%;
  28. // 黑色
  29. $--color-dark-black: #000;
  30. $--color-dark-bg-1: #18181c;
  31. $--color-dark-bg-1-shallow: darken($--color-dark-bg-1, $--dark-shalow);
  32. $--color-dark-bg-2: #232324;
  33. $--color-dark-bg-2-shallow: darken($--color-dark-bg-2, $--dark-shalow);
  34. $--color-dark-bg-3: #2a2a2b;
  35. $--color-dark-bg-3-shallow: darken($--color-dark-bg-3, $--dark-shalow);
  36. $--color-dark-bg-4: #313132;
  37. $--color-dark-bg-4-shallow: darken($--color-dark-bg-4, $--dark-shalow);
  38. $--color-dark-bg-5: #373739;
  39. $--color-dark-bg-5-shallow: darken($--color-dark-bg-5, $--dark-shalow);
  40. $--color-dark-border: #333335;
  41. // 最大宽度
  42. $--max-width: 1920px;
  43. // 顶部距离
  44. $--header-height: 60px;
  45. // 底部距离
  46. $--footer-height: 50px;
  47. // 模糊
  48. $--filter-blur-base: blur(20px);
  49. // 毛玻璃
  50. $--filter-color-login-dark: rgba(35,35,36, 0.8);
  51. $--filter-color-login-light: rgba(240, 240, 240, 0.8);
  52. // 边框
  53. $--border-radius-base: 8px;
  54. // 阴影
  55. $--border-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);