questionnaire.css 3.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. .flex-box{
  2. display: -webkit-box;
  3. display: -ms-flexbox;
  4. display: flex;
  5. -webkit-box-pack: center;
  6. -ms-flex-pack: center;
  7. justify-content: center;
  8. -webkit-box-align: center;
  9. -ms-flex-align: center;
  10. align-items: center;
  11. }
  12. .flex-box-item{
  13. -webkit-box-flex: 1;
  14. -ms-flex: 1;
  15. flex: 1;
  16. }
  17. [v-cloak] {
  18. display: none;
  19. }
  20. .prompt-text{background-color: #ffa39e;color: #fff;font-size: 12px;text-align: center;line-height: 26px;}
  21. .single-choice-question{margin: 20px;padding: 0 20px;max-height: 540px;overflow-y: auto;border: 1px solid #d7dce6;border-radius: 10px;}
  22. .question-title{font-size: 16px;line-height: 40px;}
  23. .question-list,.daan-list{margin: 0;padding: 0;list-style: none;font-size: 14px;line-height: 1;}
  24. .question-list>li{border-top: 1px solid #d7dce6;padding: 10px 0;}
  25. .question-name{margin-bottom: 10px;}
  26. .daan-list{padding-left: 20px;}
  27. .daan-list input{opacity: 0;}
  28. .daan-list input[type="radio"],.daan-list input[type="checkbox"]{width: 100%;height: 100%;opacity: 0;position: absolute;cursor: pointer;margin: 0;left: 0;right: 0;top: 0;bottom: 0;}
  29. .daan-list i{width: 20px;height: 20px;display: inline-block;vertical-align: middle;margin-right: 10px;}
  30. .daan-list input[type="radio"]~i{background: url(../images/dianxuan_btn.png) center center / 100% 100% no-repeat;}
  31. .daan-list input[type="checkbox"]~i{background: url(../images/gouxuan_btn.png) center center / 100% 100% no-repeat;}
  32. .daan-list input[type="radio"]:checked ~ i{background-image: url(../images/dianxuan_pre.png);}
  33. .daan-list input[type="checkbox"]:checked ~ i{background-image: url(../images/gouxuan_pre.png);}
  34. .label-block{display: block;position: relative;cursor: pointer;}
  35. .label-block+.label-block{margin-top: 10px;}
  36. .label-block span{color: #ff9630;}
  37. .w-250{width: 250px;border: 1px solid #d7dce6;border-top: 0;overflow: hidden;height: 605px;overflow: auto;}
  38. .f-16{font-size: 16px;}
  39. .m20{margin: 20px;}
  40. .base-info,.completion-of-progress,.btn-group-bottom{padding: 17px;font-size: 14px;}
  41. .completion-of-progress{border-top: 1px solid #d7dce6;border-bottom: 1px solid #d7dce6;}
  42. .completion-of-progress .canvas-box{position:relative;width: 120px;height: 120px;display: block;margin: 20px auto;}
  43. .completion-of-progress p{margin-bottom: 0;}
  44. .canvas-box canvas{width: 100%;height: 100%;}
  45. .w-70{width: 70px;}
  46. .base-info .flex-box{margin-top: 20px;}
  47. .right-triangle{position: relative;background: url(../images/right-triangle.png) right center / auto 15px no-repeat;}
  48. .base-info .w-70{padding-right: 10px;text-align: justify;position: relative;text-align-last: justify;}
  49. .base-info .w-70:after{content: ':';position: absolute;right: 2px;top: 0;font-weight: bold;}
  50. .base-info input{height: 20px;padding: 0;text-align: center;width: 60px;margin: 0 5px;border-radius: 10px;border: 1px solid #d7dce6;}
  51. .base-info .flex-box-item{padding-right: 15px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
  52. .progress-number{position: absolute;top: 50%;margin-top: -30px;text-align: center;left: 0;right: 0;}
  53. .progress-number>span{font-size: 14px;color: #12b7f5;}
  54. .btn-group-bottom .btn{width: 100%;height: 40px;padding: 8px 12px;}
  55. .btn-group-bottom .btn+.btn{margin-top: 10px;}
  56. .disabled{pointer-events: none;}
  57. .wenjuan-textarea{padding: 8px 12px;width: 100%;border-radius: 4px;}
  58. .submit-btn{background-color: #12b7f5;color: #fff;}