style.css 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. /* Cell Component */
  2. /* Header Component */
  3. /* Button Component */
  4. /* Tab Item Component */
  5. /* Tabbar Component */
  6. /* Navbar Component */
  7. /* Checklist Component */
  8. /* Radio Component */
  9. /* z-index */
  10. .mint-radiolist .mint-cell {
  11. padding: 0;
  12. }
  13. .mint-radiolist-label {
  14. display: block;
  15. padding: 0 10px;
  16. }
  17. .mint-radiolist-title {
  18. font-size: 12px;
  19. margin: 8px;
  20. display: block;
  21. color: #888;
  22. }
  23. .mint-radio {}
  24. .mint-radio.is-right {
  25. float: right;
  26. }
  27. .mint-radio-label {
  28. vertical-align: middle;
  29. margin-left: 6px;
  30. }
  31. .mint-radio-input {
  32. display: none;
  33. }
  34. .mint-radio-input:checked + .mint-radio-core {
  35. background-color: #26a2ff;
  36. border-color: #26a2ff;
  37. }
  38. .mint-radio-input:checked + .mint-radio-core::after {
  39. background-color: #fff;
  40. -webkit-transform: scale(1);
  41. transform: scale(1);
  42. }
  43. .mint-radio-input[disabled] + .mint-radio-core {
  44. background-color: #d9d9d9;
  45. border-color: #ccc;
  46. }
  47. .mint-radio-core {
  48. box-sizing: border-box;
  49. display: inline-block;
  50. background-color: #fff;
  51. border-radius: 100%;
  52. border: 1px solid #ccc;
  53. position: relative;
  54. width: 20px;
  55. height: 20px;
  56. vertical-align: middle;
  57. }
  58. .mint-radio-core::after {
  59. content: " ";
  60. border-radius: 100%;
  61. top: 5px;
  62. left: 5px;
  63. position: absolute;
  64. width: 8px;
  65. height: 8px;
  66. -webkit-transition: -webkit-transform .2s;
  67. transition: -webkit-transform .2s;
  68. transition: transform .2s;
  69. transition: transform .2s, -webkit-transform .2s;
  70. -webkit-transform: scale(0);
  71. transform: scale(0);
  72. }