index.less 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. @import '../../app.less';
  2. .answer-button {
  3. text-align: center;
  4. cursor: pointer;
  5. display: inline-block;
  6. vertical-align: middle;
  7. transition: all 0.25s;
  8. border-radius: 2px;
  9. }
  10. .answer-button.basic {
  11. padding: 4px 24px;
  12. line-height: 20px;
  13. font-size: 14px;
  14. }
  15. .answer-button.small {
  16. padding: 3px 14px;
  17. line-height: 18px;
  18. font-size: 12px;
  19. }
  20. .answer-button.lager {
  21. font-size: 18px;
  22. line-height: 28px;
  23. padding: 8px 30px;
  24. }
  25. .answer-button.disabled {
  26. cursor: no-drop;
  27. }
  28. .answer-button.basic.radius {
  29. border-radius: 17px;
  30. }
  31. .answer-button.small.radius {
  32. border-radius: 14px;
  33. }
  34. .answer-button.lager.radius {
  35. border-radius: 36px;
  36. }
  37. .answer-button.default {
  38. background: transparent;
  39. color: #686872;
  40. }
  41. .answer-button.cancel {
  42. background: transparent;
  43. color: #A7A7B7;
  44. }
  45. .answer-button.confirm {
  46. background: #4299FF;
  47. color: #fff;
  48. }
  49. .answer-button.default:hover,
  50. .answer-button.default.active {
  51. background: #4299FF;
  52. color: #fff;
  53. }
  54. .answer-button.cancel:hover,
  55. .answer-button.cancel.active {
  56. background: #ECEDEE;
  57. }
  58. .answer-button.confirm:hover,
  59. .answer-button.confirm.active {
  60. background: #69AEFF;
  61. }
  62. .answer-button.default.disabled {
  63. color: #A7A7B7;
  64. }
  65. .answer-button.default.disabled:hover,
  66. .answer-button.default.active.disabled {
  67. background: #ECEDEE;
  68. color: #A7A7B7;
  69. }