Home Explore Help
Sign In
yangmc
/
challengeFamily
Watch 2
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
challengeFam...
/
pages
/
account
/
course
/
index.wxss

index.wxss 4.1 KB
Permalink History Raw

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 
  1. page{height:100%; background:linear-gradient(to bottom, #ee3a43 350rpx, #ee3a43 350rpx, #f5f5f4 350rpx, #f5f5f4 350rpx) no-repeat;}
    2. 

  2. .page-bg{background: #f5f5f4;}
    3. 

  3. .picker{display: flex; align-items: center; padding: 20rpx;}
    4. 

  4. .picker .selector{flex-shrink: 1;width: 62%; margin-left:20rpx;}
    5. 

  5. .picker .selector:first-child{margin-left: 0; width: 35%; flex-shrink: 0;}
    6. 

  6. .picker .select{margin-top: 10rpx; background: rgba(255,255,255,.4); border-radius: 40rpx; height: 60rpx; line-height: 60rpx; position: relative; font-size: 24rpx; padding: 0 20rpx;color: #fff;}
    7. 

  7. .picker .select text{overflow: hidden; height: 60rpx; display: inline-block; width: 100%; line-height: 60rpx;}
    8. 

  8. .picker .select::after{content: '\e991'; font-family: 'icomoon'; font-size: 24rpx; position: absolute; right: 20rpx; top: 45%; line-height: 0;}
    9. 

  9. 

  10. .ui-course-box{padding: 36rpx 30rpx;}
    11. 

  11. .user-info{display: flex; overflow: hidden; padding: 50rpx;}
    12. 

  12. .course_seal{position: absolute; top: -25rpx; right: -25rpx; width: 150rpx; height: 150rpx;}
    13. 

  13. .head{width: 180rpx; height: 180rpx; border-radius: 100%; overflow: hidden; line-height: 180rpx; text-align: center; color: #fff; font-size: 22rpx; flex-shrink: 0;}
    14. 

  14. .head > image{width: 100%; height: 100%; vertical-align: middle}
    15. 

  15. .head-bg{width: 100%; height: 100%; background: rgba(0,0,0,.6); position: absolute; top: 0; left: 0;}
    16. 

  16. .user-i-box{flex-shrink: 1; width: 100%; margin-left: 40rpx;}
    17. 

  17. 

  18. .title{border-bottom: 2rpx solid #9fa0a0; font-size: 26rpx; color: #ee3a43;position: relative;}
    19. 

  19. .title [class^="icon-"]{font-size: 60rpx; margin-right: 10rpx; vertical-align: middle;}
    20. 

  20. .title::after{content:'0'; height: 4rpx; line-height: 0; font-size: 0; background: #ee3a43; width: 124rpx; position: absolute; bottom: -4rpx; left: 0;}
    21. 

  21. .ec-canvas{position: relative; top: 0; left: 0; width: 100%; height: 400rpx;}
    22. 

  22. .ec-canvas > ec-canvas{position: absolute;top: 0;bottom: 0;left: 0; right: 0;}
    23. 

  23. 

  24. .solt{background: #ee3a43; border-radius: 20rpx; color: #fff; font-size: 24rpx; padding:2rpx 20rpx;}
    25. 

  25. .ui-c-box{display: flex; justify-content: flex-start; align-items: center;}
    26. 

  26. .ui-c-item{flex-shrink: 1; width: 100%;}
    27. 

  27. .ui-c-item.line{border-right: 2rpx solid #dcdddd; margin-right: 20rpx; padding-right: 20rpx;}
    28. 

  28. .ui-c-item .font35{line-height: 65rpx;}
    29. 

  29. .ui-c-item .icon-arrow{background: #ffe3e8; display: inline-block; width: 37rpx; height: 59rpx; line-height: 59rpx; text-align: center; border-radius: 8rpx; float: right; color: #ee3a43; font-size: 50rpx;}
    30. 

  30. .ui-course-study{background:linear-gradient(to bottom, #ee3a43 174rpx, #ee3a43 174rpx, #fff 174rpx, #fff 174rpx) no-repeat; padding-bottom: 20rpx;}
    31. 

  31. .ui-course-study .title{border-bottom: 0 none; color:#fff;}
    32. 

  32. .ui-course-study .title::after{background: #fff; width: 158rpx;}
    33. 

  33. 

  34. .ui-course-study .ui-course-box{padding:25rpx 30rpx;}
    35. 

  35. .fmTop{margin-top: -65rpx !important;}
    36. 

  36. .course-camp{box-shadow: 0 0 10rpx 4rpx rgba(238,58,67,.2); margin-top: 20rpx;}
    37. 

  37. .course-camp:first-child{margin-top: 0;}
    38. 

  38. .course-camp .ui-c-item{margin-left: 18rpx; flex-shrink: 0; width: auto;}
    39. 

  39. .course-camp .ui-c-item:first-child{margin-left: 0;}
    40. 

  40. .course-camp-video{width: 211rpx; height: 141rpx; vertical-align: middle;}
    41. 

  41. .course-camp .bg{background: rgba(0,0,0,.3); position: absolute; top: 0; left: 0;}
    42. 

  42. .course-camp .icon-video-play{position: absolute; top: 50%; left: 50%; color: #fff; font-size: 80rpx; transform: translate(-50%, -50%); z-index:1; line-height: 0;}
    43. 

  43. .course-camp-title{border-bottom: 2rpx solid #e5e5e5; padding-bottom: 30rpx; margin-bottom: 30rpx; font-size: 26rpx;}
    44. 

  44. .course-camp-title > .solt{opacity: .3; border-radius: 8rpx; margin-right: 10rpx;}
    45. 

  45. .step{letter-spacing: 4rpx;}
    46. 

  46. 

  47. .ui-players{overflow: hidden;}
    48. 

  48. .ui-players .ui-head{text-align: center; width: 16.6666%; margin-top: 20rpx; font-size: 24rpx; color: #908f90; float: left; box-sizing: border-box;}
    49. 

  49. .ui-players .ui-head > image{width: 80rpx; height: 80rpx; border-radius: 100%;}
    50. 

  50. .ui-players .ui-head > text{display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
    51. 

  51. .buttons-row{flex-direction:row;justify-content : flex-start;}
    52. 

  52. .buttons-row > .button{width: 200rpx; flex-shrink:0; display: inline-block; margin-right: 0;}
    53. 

  53. .video{overflow: hidden;}
    54.