teacher.scss 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. .page-teacher{
  2. background:#000;
  3. display:flex;
  4. flex-direction: column;
  5. width:100vw;
  6. min-height: 100vh;
  7. .uni-swiper-dot{
  8. height:200px;
  9. border:1px solid red;
  10. }
  11. .section0{
  12. color:#FFF;
  13. margin-left:10px;
  14. margin-right: 10px;
  15. display: flex;
  16. .teach-banner{
  17. width: 100%;
  18. overflow: hidden;
  19. border-radius: 7px;
  20. height:200px;
  21. }
  22. }
  23. .section1{
  24. display:flex;
  25. flex-direction: column;
  26. margin-left:10px;
  27. margin-right:10px;
  28. margin-top:10px;
  29. .name{
  30. height:30px;
  31. display:flex;
  32. flex-direction: row;
  33. justify-content: space-between;
  34. align-items: center;
  35. margin-left:5px;
  36. .text{
  37. color:$teacher-main-color;
  38. width:50%;
  39. font-size:12px;
  40. }
  41. .sign{
  42. color:#FFF;
  43. width:50%;
  44. display: flex;
  45. flex-direction: row;
  46. justify-content: flex-end;
  47. >view{
  48. .img{
  49. margin-right: 10px;
  50. .icon{
  51. width:14px;
  52. height:14px;
  53. }
  54. }
  55. }
  56. }
  57. }
  58. .intro{
  59. color:#FFF;
  60. font-size:12px;
  61. color:#CCC;
  62. }
  63. }
  64. .section2{
  65. margin-top:10px;
  66. .title{
  67. font-size:14px;
  68. color:$teacher-main-color;
  69. font-weight: bold;
  70. margin-left:10px;
  71. }
  72. .zs{
  73. display:flex;
  74. flex-direction: row;
  75. justify-content: center;
  76. align-items: center;
  77. margin-top:10px;
  78. margin-left:10px;
  79. margin-right:10px;
  80. .image{
  81. width:100px;
  82. height:100px;
  83. overflow: hidden;
  84. margin-right:5px;
  85. .img{
  86. width:90px;
  87. height:90px;
  88. }
  89. }
  90. }
  91. }
  92. .section3{
  93. // margin: 0 auto;
  94. .title{
  95. display:flex;
  96. justify-content: space-between;
  97. text-align: center;
  98. margin-top: 20px;
  99. margin-bottom: 10px;
  100. margin-left:10px;
  101. width: 100%;
  102. font-size:14px;
  103. color:$teacher-main-color;
  104. font-weight: bold;
  105. height:30px;
  106. line-height: 30px;
  107. }
  108. .list{
  109. font-size:12px;
  110. color:#FFF;
  111. }
  112. }
  113. .selection{
  114. display:flex;
  115. flex-direction: row;
  116. margin-left:20px;
  117. margin-right:10px;
  118. margin-top:10px;
  119. }
  120. .address{
  121. font-size:12px;
  122. color:#dedede;
  123. margin-left:20px;
  124. margin-right: 20px;
  125. height:30px;
  126. line-height: 30px;
  127. }
  128. .section4{
  129. background:#1a1a1a;
  130. margin-left:10px;
  131. margin-right: 10px;
  132. border-radius: 20px;
  133. margin-top:10px;
  134. .course-date{
  135. height: 100px;
  136. }
  137. .title{
  138. width:90%;
  139. margin:auto;
  140. display:flex;
  141. height:40px;
  142. flex-direction: row;
  143. justify-content: space-between;
  144. align-items: center;
  145. .txt{
  146. color:$teacher-main-color;
  147. font-size:12px;
  148. }
  149. .more{
  150. color:$teacher-sub-title-color;
  151. font-size:12px;
  152. }
  153. }
  154. .calendar{
  155. padding-left:10px;
  156. padding-right: 10px;
  157. height:60px;
  158. display: flex;
  159. color:#FFF;
  160. flex-direction: column;
  161. padding-top:5px;
  162. .week{
  163. display:flex;
  164. flex-direction: row;
  165. height:30px;
  166. justify-content: center;
  167. align-items: center;
  168. .day{
  169. width:100%;
  170. display:flex;
  171. flex-grow: 1;
  172. flex-shrink: 1;
  173. justify-content: center;
  174. align-items: center;
  175. font-size:12px;
  176. }
  177. .active{
  178. .current{
  179. display:flex;
  180. color:#FFf;
  181. width:30px;
  182. height:30px;
  183. background:$teacher-main-color;
  184. border-radius: 50%;
  185. justify-content: center;
  186. align-items: center;
  187. }
  188. }
  189. }
  190. .month{
  191. display:flex;
  192. flex-direction: row;
  193. height:30px;
  194. .day{
  195. width:100%;
  196. display:flex;
  197. flex-grow: 1;
  198. flex-shrink: 1;
  199. justify-content: center;
  200. align-items: center;
  201. font-size:12px;
  202. }
  203. }
  204. }
  205. .selection{
  206. display:flex;
  207. flex-direction: row;
  208. margin-left:20px;
  209. margin-left:10px;
  210. }
  211. .address{
  212. font-size:12px;
  213. color:#dedede;
  214. margin-left:20px;
  215. margin-right: 20px;
  216. height:30px;
  217. line-height: 30px;
  218. }
  219. .teacher-list{
  220. display:flex;
  221. flex-direction: column;
  222. }
  223. }
  224. }