rui.css 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. /*
  2. * 主颜色:#1389D3,可替换成你想要的颜色
  3. */
  4. body,html{height:100%;-webkit-tap-highlight-color:transparent;}
  5. body{overflow-x:hidden;background-color:#f1f1f1;-webkit-overflow-scrolling:touch;--main-color:#1389D3}
  6. table{border-spacing: 0;border-collapse: collapse;}
  7. input,select,textarea{resize: none;outline:none}
  8. input:focus{border-color:#1389D3;border-color:var(--main-color)}
  9. a:link,a:visited{TEXT-DECORATION:none;color:var(--main-color)}
  10. .blank1{ height:1px; overflow:hidden; border-bottom:1px #dddddd solid}
  11. .blank10{ height:10px; overflow:hidden;width:100%}
  12. .blank5{ height:5px; overflow:hidden;width:100%}
  13. .blank15{ height:15px;overflow:hidden;width:100%}
  14. .blank20{ height:20px;overflow:hidden;width:100%}
  15. .blank25{ height:25px;overflow:hidden;width:100%}
  16. .blank30{ height:30px; overflow:hidden;width:100%}
  17. .blank40{ height:40px; overflow:hidden;width:100%}
  18. .r-wrap{word-wrap:break-word;word-break:break-all;white-space:normal;}
  19. .r-touch{-webkit-overflow-scrolling:touch;overflow-scrolling:touch;overflow-y:auto;overflow-x:hidden}
  20. .r-zhu-bgcolor{background-color:#1389D3;background-color:var(--main-color)}
  21. .r-success-bgcolor{background-color:#449d44;}
  22. .r-info-bgcolor{background-color:#d9edf7;}
  23. .r-error-bgcolor{background-color:#f2dede;}
  24. .r-header{height:50px;line-height:50px; background-color:white;overflow:hidden;color:#000000;font-size:18px;text-align:center;position:fixed;left:0px;top:0px;width:100%;z-index:10;border-bottom:0.5px #dddddd solid}
  25. .r-header-text{text-align:center;font-size:18px;color:#000000}
  26. .r-float-right{float:right;}
  27. .r-float-left{float:left;}
  28. .r-position-right{position:absolute;right:0px;bottom:0px}
  29. .r-position-left{position:absolute;left:0px;bottom:0px}
  30. .r-padding10{padding:10px}
  31. .r-padding20{padding:20px}
  32. .r-header-btn{display:block;height:50px;width:40px;text-align:center;line-height:50px;font-size:16px}
  33. .r-header-btn:active{color:#aaaaaa}
  34. .r-label{padding:3px;color:white;font-size:12px;border-radius:2px}
  35. .blank50{height:50px;overflow:hidden}
  36. .r-input{height:30px;width:97%;border:1px #cccccc solid;padding:2px}
  37. .r-border-t,.r-border-b,.r-border-l,.r-border-r,.r-border{position: relative;}
  38. .r-border-t:after {
  39. content: " ";
  40. position: absolute;
  41. display: block;
  42. left: 0;
  43. top: 0;
  44. width: 100%;
  45. height: 1px;
  46. border-top: 1px solid #cccccc;
  47. color: #cccccc;
  48. -webkit-transform-origin: 0 0;
  49. transform-origin: 0 0;
  50. -webkit-transform: scaleY(0.5);
  51. transform: scaleY(0.5);
  52. }
  53. .r-border:after {
  54. content: '';
  55. position: absolute;
  56. display: block;
  57. left: 0;
  58. top: 0;
  59. width: 200%;
  60. height: 200%;
  61. border: 1px solid #cccccc;
  62. color: #cccccc;
  63. -webkit-transform-origin: 0 0;
  64. transform-origin: 0 0;
  65. -webkit-transform: scale(0.5);
  66. transform: scale(0.5);
  67. pointer-events: none;
  68. }
  69. .r-border-b:before {
  70. content: " ";
  71. position: absolute;
  72. display: block;
  73. right: 0;
  74. bottom: 0;
  75. width: 100%;
  76. height: 1px;
  77. border-bottom: 1px solid #cccccc;
  78. color: #cccccc;
  79. -webkit-transform-origin: 0 0;
  80. transform-origin: 0 0;
  81. -webkit-transform: scaleY(0.5);
  82. transform: scaleY(0.5);
  83. }
  84. .r-border-r:after {
  85. content: " ";
  86. position: absolute;
  87. display: block;
  88. right: 0;
  89. top: 0;
  90. width: 1px;
  91. height: 100%;
  92. border-right: 1px solid #cccccc;
  93. color: #cccccc;
  94. -webkit-transform-origin: 100% 0;
  95. transform-origin: 100% 0;
  96. -webkit-transform: scaleX(0.5);
  97. transform: scaleX(0.5);
  98. }
  99. .r-border-l:before {
  100. content: " ";
  101. position: absolute;
  102. display: block;
  103. left: 0;
  104. top: 0;
  105. width: 1px;
  106. height: 100%;
  107. border-left: 1px solid #cccccc;
  108. color: #cccccc;
  109. -webkit-transform-origin: 0 100%;
  110. transform-origin: 0 100%;
  111. -webkit-transform: scaleX(0.5);
  112. transform: scaleX(0.5);
  113. }
  114. .badge {
  115. display: inline-block;
  116. min-width: 10px;
  117. padding: 3px 5px;
  118. font-size: 12px;
  119. line-height: 1;
  120. color: #fff;
  121. text-align: center;
  122. white-space: nowrap;
  123. vertical-align: baseline;
  124. background-color:red;font-size:12px;
  125. border-radius: 10px;
  126. }
  127. .badge:empty {
  128. display: none;
  129. }
  130. .r-btn-active:active{opacity:0.8}
  131. .r-chat{height:50px;overflow:hidden;background-color:#f1f1f1;position:fixed;left:0px;bottom:0px;width:100%}
  132. .r-chat-input{height:30px;overflow:hidden;border:none;width:100%;background:none;border-bottom:1px #cccccc solid;font-size:16px;}
  133. .r-chat-btn{height:30px;font-size:16px;overflow:hidden;border:none;width:50px;color:white; background-color:var(--main-color);display:block}
  134. .r-tab{display: -webkit-box;display: -webkit-flex;display: flex;width: 100%;background-color:white;height:50px;overflow:hidden}
  135. .r-tab-item{height:50px;overflow:hidden;line-height:49px;display: block;-webkit-box-flex: 1;-webkit-flex: 1; flex: 1;text-align:center}
  136. .r-tab-item.active{color:var(--main-color);border-bottom:1px var(--main-color) solid;height:49px;}
  137. .r-subtitle{color:#888888;padding:5px;font-size:14px;margin-top:5px}
  138. .menulist{background-color:white}
  139. .menulist div{padding:12px 0px;font-size:16px;text-align:center}
  140. .menulist div:active{ background-color:#f1f1f1}