SetSchedule.scss 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. @import '@/utils/common.scss';
  2. .box{
  3. margin-left: 32px;
  4. margin-right: 32px;
  5. background: #1C1C1C;
  6. border-radius: $boxBorderRadius;
  7. display: flex;
  8. flex-direction: column;
  9. // margin-top: 20px;
  10. }
  11. .header{
  12. margin-top: 40px;
  13. display: flex;
  14. flex-direction: row;
  15. flex-shrink: 0;
  16. height: 90px;
  17. }
  18. .item1{
  19. display: flex;
  20. flex: 1;
  21. align-items: center;
  22. justify-content: center;
  23. // background-color: pink;
  24. flex-direction: column;
  25. height: 90px;
  26. }
  27. .item_title{
  28. font-size: 32px;
  29. line-height: 32px;
  30. }
  31. .subtitle{
  32. opacity: 0.4;
  33. font-size: 36px;
  34. margin-bottom: 20px;
  35. margin-left:40px;
  36. }
  37. .item_text{
  38. margin-top: 10px;
  39. font-size: 48px;
  40. line-height: 48px;
  41. font-weight: bold;
  42. }
  43. .dial_bg{
  44. margin-top: 40px;
  45. margin-bottom: 40px;
  46. align-items: center;
  47. justify-content: center;
  48. display: flex;
  49. }
  50. .duration_bg{
  51. display: flex;
  52. flex-direction: column;
  53. align-items: center;
  54. justify-content: center;
  55. height: 90px;
  56. margin-bottom: 40px;
  57. margin-right: 40px;
  58. }
  59. .duration_title{
  60. font-size: 32px;
  61. line-height: 32px;
  62. }
  63. .duration_value{
  64. font-size: 48px;
  65. line-height: 48px;
  66. margin-top: 10px;
  67. text-align: center;
  68. font-weight: bold;
  69. }
  70. .schedule_text_value{
  71. color: #fff;
  72. }
  73. .schedule_text_key{
  74. color: #fff;
  75. opacity: 0.6;
  76. }
  77. .next_day{
  78. margin-right: 10px;
  79. font-size: 28px;
  80. color: #fff;
  81. opacity: 0.4;
  82. }