tinyshop.css 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442
  1. ul {
  2. list-style-type: none;
  3. }
  4. .mask-address-info div {
  5. width: 100%;
  6. }
  7. .mask-address-info div h3 {
  8. margin: 0;
  9. padding: 0;
  10. padding-top: 10px;
  11. padding-bottom: 10px;
  12. font-size: 14px;
  13. font-weight: normal;
  14. text-align: center;
  15. border-bottom: 1px solid #eeeeee;
  16. }
  17. .mask-address-info div ul {
  18. margin: 0;
  19. padding: 0;
  20. list-style-type: none;
  21. overflow: hidden;
  22. }
  23. .mask-address-info div ul li {
  24. float: left;
  25. padding: 10px;
  26. line-height: 20px;
  27. width: 20%;
  28. text-align: center;
  29. text-overflow: ellipsis;
  30. overflow: hidden;
  31. white-space: nowrap;
  32. border-right: 1px solid #eeeeee;
  33. border-bottom: 1px solid #eeeeee;
  34. }
  35. .shop-console div span {
  36. cursor: pointer;
  37. }
  38. .mod-table {
  39. /*padding:15px;*/
  40. }
  41. /* 订单 */
  42. .step-region {
  43. margin-bottom: 15px;
  44. background-color: #ffffff
  45. }
  46. .ui-step {
  47. margin: 0;
  48. padding: 14px 0 8px 0;
  49. zoom: 1;
  50. }
  51. .ui-step li {
  52. float: left;
  53. position: relative;
  54. -webkit-box-sizing: border-box;
  55. -moz-box-sizing: border-box;
  56. box-sizing: border-box;
  57. text-align: center;
  58. }
  59. .ui-step:after {
  60. content: "";
  61. display: table;
  62. clear: both;
  63. }
  64. .clearfix:after, .clearfix:before {
  65. display: table;
  66. line-height: 0;
  67. content: "";
  68. }
  69. .clearfix:after, .clearfix:after {
  70. display: table;
  71. line-height: 0;
  72. content: "";
  73. }
  74. .info-region {
  75. width: 320px;
  76. padding: 15px 15px 100px 15px;
  77. border-right: 1px solid #e5e5e5;
  78. float: left;
  79. -webkit-box-sizing: border-box;
  80. -moz-box-sizing: border-box;
  81. box-sizing: border-box;
  82. }
  83. .state-region {
  84. -webkit-box-flex: 1;
  85. -webkit-flex: 1;
  86. -moz-box-flex: 1;
  87. -ms-flex: 1;
  88. flex: 1;
  89. padding: 20px 20px 140px 20px;
  90. margin-left: -1px;
  91. border-left: 1px solid #e5e5e5;
  92. float: left;
  93. -webkit-box-sizing: border-box;
  94. -moz-box-sizing: border-box;
  95. box-sizing: border-box;
  96. }
  97. .ui-step li.ui-step-done::before, .ui-step li.ui-step-done::after, .ui-step li.ui-step-done .ui-step-number {
  98. background: rgb(98, 168, 234);
  99. }
  100. .ui-step li.ui-step-done .ui-step-number::after {
  101. position: absolute;
  102. left: 6px;
  103. width: 17px;
  104. height: 30px;
  105. line-height: 30px;
  106. content: "√";
  107. color: rgb(255, 255, 255);
  108. font-family: serif;
  109. }
  110. .ui-step .ui-step-number {
  111. position: relative;
  112. display: inline-block;
  113. width: 30px;
  114. height: 30px;
  115. margin: 5px 0;
  116. line-height: 30px;
  117. background: #999;
  118. color: #fff;
  119. border-radius: 100%;
  120. -webkit-box-sizing: border-box;
  121. -moz-box-sizing: border-box;
  122. box-sizing: border-box;
  123. z-index: 2;
  124. }
  125. .ui-step li::before, .ui-step li::after {
  126. position: absolute;
  127. left: 0;
  128. top: 38px;
  129. display: block;
  130. content: '';
  131. width: 50%;
  132. height: 4px;
  133. background: #999;
  134. z-index: 1;
  135. }
  136. .ui-step li::after {
  137. left: 50%;
  138. }
  139. .ui-step li:first-child::before {
  140. width: 0;
  141. }
  142. .ui-step li:last-child::after {
  143. width: 0;
  144. }
  145. .ui-step li.ui-step-done .ui-step-title {
  146. color: rgb(98, 168, 234);
  147. }
  148. .ui-step .ui-step-meta {
  149. color: #999;
  150. }
  151. .ui-step li.ui-step-done .ui-step-number {
  152. color: transparent;
  153. }
  154. .info-region .info-div {
  155. font-size: 14px;
  156. font-weight: 500;
  157. color: #526069;
  158. }
  159. .info-region .secured-title {
  160. float: right;
  161. font-size: 12px;
  162. font-weight: normal;
  163. color: #f60;
  164. }
  165. .info-table {
  166. margin-top: 10px;
  167. }
  168. .info-table th, .info-table td {
  169. font-size: 12px;
  170. color: #999;
  171. padding: 0 0 10px 0;
  172. vertical-align: top;
  173. word-break: break-all;
  174. }
  175. .info-table th {
  176. font-weight: normal;
  177. text-align: right;
  178. color: #999;
  179. width: 85px;
  180. }
  181. .info-goods {
  182. margin: 10px 0;
  183. }
  184. .info-goods .ui-centered-image {
  185. float: left;
  186. }
  187. .info-goods .info-goods-content {
  188. margin-left: 70px;
  189. }
  190. .info-goods:after {
  191. content: "";
  192. display: table;
  193. clear: both;
  194. }
  195. .dashed-line {
  196. border-top: 1px dashed #e5e5e5;
  197. }
  198. .state-region .state-title .icon {
  199. position: absolute;
  200. left: -40px;
  201. width: 28px;
  202. height: 28px;
  203. border: 2px solid #07d;
  204. border-radius: 28px;
  205. line-height: 24px;
  206. text-align: center;
  207. -webkit-box-sizing: border-box;
  208. -moz-box-sizing: border-box;
  209. box-sizing: border-box;
  210. font-family: serif;
  211. }
  212. .state-region .state-title {
  213. position: relative;
  214. font-size: 14px;
  215. font-weight: 500;
  216. color: #526069;
  217. margin-bottom: 10px;
  218. }
  219. .state-region .state-title .icon.info {
  220. color: rgb(98, 168, 234);
  221. border-color: rgb(98, 168, 234);
  222. }
  223. .state-region .state-desc {
  224. margin-bottom: 30px;
  225. color: #666;
  226. }
  227. .state-remind {
  228. padding: 20px 0 0 40px;
  229. }
  230. .state-remind .tixing {
  231. color: #FF6600;
  232. font-size: 12px;
  233. margin-bottom: 10px;
  234. }
  235. .state-remind ul {
  236. padding-left: 4px;
  237. }
  238. .state-remind li {
  239. color: #999;
  240. line-height: 20px;
  241. }
  242. .goods-table tfoot .c-red {
  243. color: #f44;
  244. }
  245. .safeguard-log {
  246. padding: 15px;
  247. position: relative;
  248. }
  249. .safeguard-log table {
  250. width: 100%;
  251. }
  252. .safeguard-log .tr-title td {
  253. padding: 30px 0 10px 0;
  254. border-bottom: 1px dashed #e5e5e5;
  255. }
  256. .safeguard-log .tr-title td {
  257. padding: 30px 0 10px 0;
  258. border-bottom: 1px dashed #e5e5e5;
  259. }
  260. .safeguard-log .tr-title td:first-child {
  261. font-weight: bold;
  262. }
  263. .safeguard-log .td-time {
  264. color: #999;
  265. }
  266. .safeguard-log .tr-title+tr td {
  267. padding-top: 10px;
  268. }
  269. .safeguard-log td {
  270. padding: 2px 0;
  271. }
  272. /* 商品编辑 */
  273. .selectImage {
  274. width: 30px;
  275. height: 30px;
  276. padding: 6px;
  277. border: 1px solid #eceef1;
  278. }
  279. .exchange-grid {
  280. float: left;
  281. display: block;
  282. width: 15px;
  283. height: 15px;
  284. }
  285. /* 页面装修 */
  286. .exchange-type {
  287. display: inline-block;
  288. width: 121px;
  289. height: 48px;
  290. border: 1px solid #ededed;
  291. border-radius: 4px;
  292. margin-right: 10px;
  293. line-height: 48px;
  294. position: relative;
  295. cursor: pointer;
  296. }
  297. .exchange-type:hover {
  298. border: 1px solid #1890ff;
  299. }
  300. .exchange-selected {
  301. border: 1px solid #1890ff;
  302. }
  303. .exchange-selected:after {
  304. content: "";
  305. display: inline-block;
  306. width: 20px;
  307. height: 20px;
  308. background-image: url('../img/selected.png');
  309. background-size: 20px;
  310. position: absolute;
  311. bottom: 0;
  312. right: 0;
  313. }
  314. .exchange-style {
  315. display: flex;
  316. -webkit-box-align: center;
  317. align-items: center;
  318. -webkit-box-pack: center;
  319. justify-content: center;
  320. }
  321. /** 模拟手机 **/
  322. .phone-header {
  323. position: relative;
  324. background: transparent url(../img/mobile_head_old.png);
  325. background-position: 0 0;
  326. overflow: hidden;
  327. text-align: center;
  328. padding-top: 30px;
  329. font-size: 15px;
  330. color: #fff;
  331. border: 1px solid #e7e7eb;
  332. }
  333. .phone-binding {
  334. font-size: 15px;
  335. line-height: 30px;
  336. }
  337. .phone-body {
  338. height: 500px;
  339. position: relative;
  340. background-color: white;
  341. }
  342. .phone-body .menu {
  343. border-top: 1px solid #e4eaec;
  344. position: relative;
  345. }
  346. .phone-body .menu .btn {
  347. padding: 5px;
  348. line-height: 1.5;
  349. }
  350. .phone-body .menu .btn {
  351. font-size: 12px;
  352. border-radius: 3px;
  353. }
  354. .phone-foot {
  355. position: absolute;
  356. bottom: 0;
  357. left: 0;
  358. right: 0;
  359. border-top: 0;
  360. background-position: 0 -3px;
  361. background-repeat: no-repeat;
  362. margin-bottom: 0;
  363. }
  364. /** 伸缩盒子布局 **/
  365. .flex-row {
  366. display: flex;
  367. }
  368. .flex-row > * {
  369. display: block;
  370. }
  371. .flex-col {
  372. flex: 1;
  373. }
粤ICP备19079148号