report.scss 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. @import "../../../../themes/page.scss";
  2. @import "../../../../themes/t.cell.scss";
  3. @import "../../report-common.scss";
  4. @import "../../../../themes/card.scss";
  5. /* module/health/pages/report/report.wxss */
  6. .constitution-container{
  7. border-radius: 20rpx;
  8. background: linear-gradient(180deg, #D6E4F5 0%, #F3F4F6 100%);
  9. }
  10. .content-wrapper{
  11. background: white;
  12. border-radius: 10px;
  13. // padding: 30px 20px 10px 20px;
  14. padding: 15px 10px 15px 16px;
  15. }
  16. .body-image{
  17. width: 800px;
  18. }
  19. .result-box{
  20. display: flex;
  21. align-items: center;
  22. }
  23. .result-text{
  24. font-size: 14px;
  25. color: #1D6FF6;
  26. }
  27. .text-title{
  28. font-size: 16px;
  29. color: black;
  30. font-weight: 500;
  31. }
  32. .card-title{
  33. display: flex;
  34. align-items: center;
  35. margin-bottom: 10rpx;
  36. }
  37. .icon-title{
  38. width: 20px;
  39. height: 20px;
  40. margin-right: 10rpx;
  41. }
  42. .label-text {
  43. color: black;
  44. font-size: 18px;
  45. font-weight: 500;
  46. }
  47. .label-title {
  48. color: #ccc;
  49. font-size: 16px;
  50. }
  51. .value-text {
  52. color: #1d6ff6;
  53. font-size: 18px;
  54. }
  55. .value-title {
  56. color: black;
  57. font-size: 14px;
  58. }
  59. .report-container {
  60. background: linear-gradient(180deg, #E3EDFA 0%, #FFFFFF 100%);
  61. width: 100%;
  62. height: 100%;
  63. background-image: url('/module/health/assets/image/bg_interview@2x.png');
  64. background-repeat: no-repeat;
  65. background-position: inherit;
  66. background-size: cover;
  67. }
  68. .header-box {
  69. background-color: transparent !important;
  70. }
  71. .card-wrapper {
  72. position: relative;
  73. z-index: 2;
  74. }
  75. .header-row {
  76. display: flex;
  77. justify-content: space-between;
  78. align-items: center;
  79. width: 100%;
  80. }
  81. .date-text {
  82. display: flex;
  83. align-items: center;
  84. }
  85. .recuperate-btn {
  86. display: inline-block;
  87. padding: 6px 12px;
  88. background-color: #1d6ff6;
  89. color: white;
  90. border-radius: 4px;
  91. font-size: 14px;
  92. text-align: center;
  93. }
  94. .card-body.report-wrapper {
  95. display: flex;
  96. flex-direction: row;
  97. align-items: flex-start;
  98. background-color: white !important;
  99. border-radius: 10px !important;
  100. padding: 0px !important;
  101. .content-wrapper {
  102. flex: auto;
  103. }
  104. .image-wrapper {
  105. flex: none;
  106. width: 128px;
  107. height: 128px;
  108. margin: 20px 10px 0 8px;
  109. border-radius: 10px;
  110. }
  111. }
  112. .rows{
  113. background: white;
  114. border-radius: 10px;
  115. padding: 10px;
  116. margin-bottom: 10px;
  117. }
  118. .talbel-wrapper {
  119. $border: 1px solid#EEE;
  120. margin-top: 12px;
  121. border: $border;
  122. // border-radius: 8px;
  123. overflow: hidden;
  124. .talbel-row {
  125. display: flex;
  126. flex-direction: row;
  127. align-items: stretch;
  128. .label {
  129. flex: none;
  130. padding: 4px;
  131. width: 100px;
  132. display: flex;
  133. align-items: center;
  134. justify-content: center;
  135. text-align: center;
  136. }
  137. .value {
  138. flex: 2 2 50%;
  139. min-height: 28px;
  140. padding: 4px;
  141. border-left: $border;
  142. box-sizing: border-box;
  143. display: flex;
  144. align-items: center;
  145. }
  146. &.odd-row {
  147. .label {
  148. background-color: #E3EDFA;
  149. }
  150. .value {
  151. background-color: #F9F9F9;
  152. }
  153. }
  154. &+.talbel-row {
  155. border-top: $border;
  156. }
  157. &.title {
  158. font-weight: 600;
  159. }
  160. }
  161. &.t-2 {
  162. .value {
  163. border-left: none;
  164. }
  165. .v-1 {
  166. border-left: $border;
  167. border-right: $border;
  168. }
  169. }
  170. }
  171. .picture-wrapper {
  172. display: flex;
  173. flex-direction: row;
  174. justify-content: center;
  175. image {
  176. margin: 12px;
  177. width: 128px;
  178. height: 128px;
  179. }
  180. }
  181. .notification-wrapper {
  182. display: flex;
  183. flex-direction: row;
  184. justify-content: center;
  185. align-items: center;
  186. // color: #34A76B;
  187. color: black;
  188. font-weight: 700;
  189. background-color: transparent !important;
  190. .icon {
  191. color: #ff611b;
  192. margin-right: 8px;
  193. }
  194. }