CourseItem.scss 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. .com-teacher{
  2. display: flex;
  3. flex-direction: row;
  4. justify-content: flex-start;
  5. align-items: flex-start;
  6. height:100px;
  7. background:#505050;
  8. border-bottom:10px;
  9. border-bottom:1px solid #434343;
  10. .header{
  11. width:30%;
  12. display: flex;
  13. justify-content: center;
  14. align-items: center;
  15. height:100%;
  16. .img{
  17. width:60px;
  18. height:60px;
  19. border-radius: 50%;
  20. }
  21. }
  22. .intro{
  23. width:50%;
  24. color:#FFF;
  25. display: flex;
  26. flex-direction: column;
  27. .name{
  28. font-size:14px;
  29. font-weight: bold;
  30. height:30px;
  31. line-height: 30px;
  32. margin-top:15px;
  33. }
  34. .time{
  35. color:#CCC;
  36. }
  37. .tags{
  38. display: flex;
  39. flex-direction: row;
  40. margin-top:5px;
  41. font-size:12px;
  42. color:#CCC;
  43. // .tag{
  44. // border:1px solid $teacher-main-color;
  45. // color:$teacher-main-color;
  46. // margin-right:5px;
  47. // border-radius: 3px;
  48. // padding:0px 3px;
  49. // font-size:12px;
  50. // }
  51. }
  52. }
  53. .btns{
  54. width:30%;
  55. height:100%;
  56. display:flex;
  57. justify-content: center;
  58. align-items: center;
  59. .btn{
  60. padding:0px;
  61. margin:0px;
  62. height:30px;
  63. width:80%;
  64. font-size:12px;
  65. line-height: 30px;
  66. border-radius:10px;
  67. }
  68. .disabled{
  69. background:#CCC;
  70. }
  71. .active{
  72. background:$teacher-main-color;
  73. color:#FFF;
  74. }
  75. }
  76. }