timeline_detail.scss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. .detail_header {
  2. background-color: #fff;
  3. width: 750px;
  4. padding: 40px;
  5. padding-bottom: 20px;
  6. display: flex;
  7. flex-direction: row;
  8. box-sizing: border-box;
  9. min-height: 100vh;
  10. }
  11. html page {
  12. background-color: #fff;
  13. }
  14. .detail_header_header {
  15. margin-right: 24px;
  16. width: 74px;
  17. height: 74px;
  18. border-radius: 37px;
  19. }
  20. .detail_header_content {
  21. display: flex;
  22. flex-direction: column;
  23. flex: 1;
  24. }
  25. .detail_nickname {
  26. color: #5C7099;
  27. font-weight: bold;
  28. font-size: 34px;
  29. line-height: 42px;
  30. margin-bottom: 24px;
  31. }
  32. .add_note {
  33. background-color: #f5f5f5;
  34. position: fixed;
  35. left: 0;
  36. right: 0;
  37. bottom: 0;
  38. height: 112px;
  39. padding-bottom: constant(safe-area-inset-bottom);
  40. /* 兼容 iOS < 11.2 */
  41. padding-bottom: env(safe-area-inset-bottom);
  42. font-size: 26px;
  43. display: flex;
  44. align-items: center;
  45. justify-content: center;
  46. color: #5C7099;
  47. }
  48. .publish_bg {
  49. position: absolute;
  50. left: 0;
  51. right: 0;
  52. top: 0;
  53. bottom: 0;
  54. background-color: rgba(0, 0, 0, 0.9);
  55. box-sizing: border-box;
  56. padding-left: 72px;
  57. padding-right: 72px;
  58. display: flex;
  59. flex-direction: column;
  60. }
  61. .time {
  62. color: #5C7099;
  63. margin-bottom: 30px;
  64. }
  65. .toolbar2 {
  66. height: 172px;
  67. display: flex;
  68. flex-direction: row;
  69. align-items: center;
  70. padding-left: 72px;
  71. padding-right: 72px;
  72. margin-left: -72px;
  73. margin-right: -72px;
  74. box-sizing: border-box;
  75. // margin-bottom: constant(safe-area-inset-bottom);
  76. // margin-bottom: env(safe-area-inset-bottom);
  77. }
  78. .album {
  79. width: 72px;
  80. height: 72px;
  81. margin-right: 48px;
  82. }
  83. .btn {
  84. display: flex;
  85. color: #fff;
  86. width: 128px;
  87. height: 72px;
  88. border-radius: 18px;
  89. align-items: center;
  90. justify-content: center;
  91. }
  92. .detail_time {
  93. color: #5C7099;
  94. margin-top: 10px;
  95. }
  96. .myTextarea {
  97. line-height: 72px;
  98. font-size: 48px;
  99. // width: 606px;
  100. margin-left: -10px;
  101. width: 630px;
  102. color: #fff;
  103. }
  104. .share_btn_bg {
  105. position: relative;
  106. width: 80px;
  107. height: 40px;
  108. }
  109. .share_icon_bg {
  110. width: 80px;
  111. height: 40px;
  112. display: flex;
  113. align-items: center;
  114. justify-content: center;
  115. }
  116. .share_btn {
  117. position: absolute;
  118. opacity: 0;
  119. left: 0;
  120. top: 0;
  121. right: 0;
  122. bottom: 0;
  123. }
  124. .no_data_bg2{
  125. display: flex;
  126. flex-direction: column;
  127. // width: '100%';
  128. // height: '100%';
  129. align-items: center;
  130. justify-content: center;
  131. }