style.sass 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. // ===主题色(蓝)
  2. $theme_color: #353A58
  3. // ===辅色(红)
  4. $theme_fu_red: #9F1130
  5. // ===辅色(蓝色)
  6. $theme_fu_bule: #535F72
  7. // ===辅色(深灰1)
  8. $theme_gray333: #333
  9. // ===辅色(深灰2)
  10. $theme_gray666: #666
  11. // ===辅色(灰1)
  12. $theme_gray999: #999
  13. // ===辅色(展位提示)
  14. $theme_graybbb: #bbb
  15. // ===辅色(边框)
  16. $theme_grayddd: #ddd
  17. // ===辅色(用于背景色)
  18. $theme_grayf0: #f0f0f0
  19. // ===底部背景(用于背景色)
  20. $theme_footer: #171D31
  21. //定位上下左右居中
  22. @mixin center
  23. position: absolute
  24. top: 50%
  25. left: 50%
  26. transform: translate(-50%, -50%)
  27. // 背景图片地址和大小
  28. @mixin bis($url)
  29. background-image: url($url)
  30. background-repeat: no-repeat
  31. background-size: 100% 100%
  32. //定位全屏
  33. @mixin allcover
  34. position:absolute
  35. top: 0
  36. right: 0
  37. //宽高
  38. @mixin wh($width, $height)
  39. width: $width
  40. height: $height
  41. //字体大小,颜色
  42. @mixin sc($size, $color)
  43. font-size: $size
  44. color: $color
  45. //字体大小、行高、字体
  46. @mixin font($size, $line-height, $family: 'Microsoft YaHei')
  47. font: $size/$line-height $family
  48. //定位上下居中
  49. @mixin ct
  50. position: absolute
  51. top: 50%
  52. transform: translateY(-50%)
  53. //定位左右居中
  54. @mixin cl
  55. position: absolute
  56. left: 50%
  57. transform: translateX(-50%)