mpweixin.css 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484
  1. a {
  2. color: #44b549;
  3. text-decoration: none;
  4. background-color: transparent;
  5. outline: none;
  6. cursor: pointer;
  7. -webkit-transition: color 0.3s;
  8. transition: color 0.3s;
  9. -webkit-text-decoration-skip: objects;
  10. }
  11. h1, h2, h3, h4, h5, h6 {
  12. margin-top: 0;
  13. margin-bottom: 0.5em;
  14. color: rgba(0, 0, 0, 0.85);
  15. font-weight: 500;
  16. }
  17. ul, ol {
  18. padding-left: 0;
  19. list-style-type: none;
  20. }
  21. ol, ul, dl {
  22. margin-top: 0;
  23. margin-bottom: 0;
  24. }
  25. p {
  26. margin-top: 0;
  27. margin-bottom: 0;
  28. }
  29. input[type='radio'], input[type='checkbox'] {
  30. -webkit-box-sizing: border-box;
  31. box-sizing: border-box;
  32. padding: 0;
  33. }
  34. input[type='text'], input[type='password'], input[type='number'], textarea {
  35. -webkit-appearance: none;
  36. }
  37. .menu_setting_area {
  38. margin: 14px 30px 0;
  39. }
  40. .menu_preview_area {
  41. float: left;
  42. margin-right: 12px;
  43. position: relative;
  44. }
  45. .menu_form_area {
  46. display: table-cell;
  47. vertical-align: top;
  48. float: none;
  49. width: auto;
  50. min-width: 500px;
  51. }
  52. .menu_setting_area:after {
  53. content: "\200B";
  54. display: block;
  55. height: 0;
  56. clear: both;
  57. }
  58. .mobile_menu_preview {
  59. width: 294px;
  60. background-size: contain;
  61. }
  62. .mobile_menu_preview {
  63. position: relative;
  64. width: 317px;
  65. height: 580px;
  66. background: transparent url(../x_component_Setting/$Main/default/mpweixin/bg_mobile_head_default49d02c.png) no-repeat 0 0;
  67. background-position: 0 0;
  68. border: 1px solid #e7e7eb;
  69. }
  70. .mobile_menu_preview .mobile_hd {
  71. color: #fff;
  72. text-align: center;
  73. padding-top: 30px;
  74. font-size: 15px;
  75. width: auto;
  76. overflow: hidden;
  77. text-overflow: ellipsis;
  78. white-space: nowrap;
  79. word-wrap: normal;
  80. margin: 0 30px;
  81. }
  82. .menu_preview_area .pre_menu_list {
  83. position: absolute;
  84. bottom: 0;
  85. left: 0;
  86. right: 0;
  87. border-top: 1px solid #e7e7eb;
  88. background: transparent url(../x_component_Setting/$Main/default/mpweixin/bg_mobile_foot_default49d02c.png) no-repeat 0 0;
  89. background-position: 0 0;
  90. background-repeat: no-repeat;
  91. padding-left: 43px;
  92. }
  93. .pre_menu_item {
  94. position: relative;
  95. float: left;
  96. line-height: 50px;
  97. text-align: center;
  98. }
  99. .size1of3 {
  100. width: 33.33%;
  101. }
  102. .menu_preview_area .pre_menu_item:first-child .pre_menu_link {
  103. border-left-width: 0;
  104. }
  105. .pre_menu_item a {
  106. display: block;
  107. width: auto;
  108. overflow: hidden;
  109. text-overflow: ellipsis;
  110. white-space: nowrap;
  111. word-wrap: normal;
  112. color: #616161;
  113. text-decoration: none;
  114. }
  115. .pre_menu_link {
  116. border-left: 1px solid #e7e7eb;
  117. }
  118. .no_extra.grid_item {
  119. float: none;
  120. width: auto;
  121. overflow: hidden;
  122. }
  123. .sub_pre_menu_box {
  124. position: absolute;
  125. left: 0;
  126. width: 100%;
  127. border: 1px solid #d0d0d0;
  128. bottom: 60px;
  129. background-color: #fafafa;
  130. border-top-width: 0;
  131. }
  132. .menu_preview_area .sub_pre_menu_inner {
  133. display: block;
  134. border-top: 1px solid #e7e7eb;
  135. width: auto;
  136. overflow: hidden;
  137. text-overflow: ellipsis;
  138. white-space: nowrap;
  139. word-wrap: normal;
  140. cursor: pointer;
  141. }
  142. .sub_pre_menu_list li a {
  143. padding: 0 .5em;
  144. }
  145. .pre_menu_item a {
  146. display: block;
  147. width: auto;
  148. overflow: hidden;
  149. text-overflow: ellipsis;
  150. white-space: nowrap;
  151. word-wrap: normal;
  152. color: #616161;
  153. text-decoration: none;
  154. }
  155. .menu_preview_area .pre_menu_item.current .pre_menu_link {
  156. border: 1px solid #07c160;
  157. line-height: 48px;
  158. background-color: #fff;
  159. color: #07c160;
  160. }
  161. .menu_preview_area .icon14_menu_add {
  162. background: url(../x_component_Setting/$Main/default/mpweixin/index_z49d030.png) 0 0 no-repeat;
  163. width: 14px;
  164. height: 14px;
  165. vertical-align: middle;
  166. display: inline-block;
  167. margin-top: -2px;
  168. }
  169. .menu_preview_area .sub_pre_menu_box {
  170. bottom: 60px;
  171. background-color: #fafafa;
  172. border-top-width: 0;
  173. }
  174. .menu_preview_area .sub_pre_menu_list li:first-child {
  175. border-top: 1px solid #d0d0d0;
  176. }
  177. .menu_preview_area .sub_pre_menu_list li {
  178. line-height: 44px;
  179. border: 1px solid transparent;
  180. margin: 0 -1px -1px;
  181. }
  182. .menu_preview_area .sub_pre_menu_list li.current {
  183. background-color: #fff;
  184. border: 1px solid #07c160;
  185. position: relative;
  186. z-index: 1;
  187. line-height: 45px;
  188. }
  189. .menu_preview_area .sub_pre_menu_list li.current a {
  190. color: #07c160;
  191. }
  192. .sub_pre_menu_box .arrow {
  193. position: absolute;
  194. left: 50%;
  195. margin-left: -6px;
  196. }
  197. .sub_pre_menu_box .arrow_in {
  198. bottom: -5px;
  199. display: inline-block;
  200. width: 0;
  201. height: 0;
  202. border-width: 6px;
  203. border-style: dashed;
  204. border-color: transparent;
  205. border-bottom-width: 0;
  206. border-top-color: #fafafa;
  207. border-top-style: solid;
  208. }
  209. .sub_pre_menu_box .arrow_out {
  210. bottom: -6px;
  211. display: inline-block;
  212. width: 0;
  213. height: 0;
  214. border-width: 6px;
  215. border-style: dashed;
  216. border-color: transparent;
  217. border-bottom-width: 0;
  218. border-top-color: #d0d0d0;
  219. border-top-style: solid;
  220. }
  221. .grid_line:after {
  222. content: "\200B";
  223. display: block;
  224. height: 0;
  225. clear: both;
  226. }
  227. .menu_setting_area:after {
  228. content: "\200B";
  229. display: block;
  230. height: 0;
  231. clear: both;
  232. }
  233. .portable_editor.to_left {
  234. padding-left: 12px;
  235. }
  236. .portable_editor {
  237. position: relative;
  238. }
  239. .menu_form_area .editor_inner {
  240. min-height: 560px;
  241. padding-bottom: 20px;
  242. }
  243. .portable_editor .editor_inner {
  244. padding: 0 20px 5px;
  245. background-color: #f4f5f9;
  246. border: 1px solid #e7e7eb;
  247. border-radius: 0;
  248. -moz-border-radius: 0;
  249. -webkit-border-radius: 0;
  250. box-shadow: none;
  251. -moz-box-shadow: none;
  252. -webkit-box-shadow: none;
  253. }
  254. .menu_form_hd {
  255. padding: 9px 0;
  256. border-bottom: 1px solid #e7e7eb;
  257. }
  258. .global_mod.float_layout .global_info {
  259. float: left;
  260. }
  261. .menu_form_hd h4 {
  262. font-weight: 400;
  263. }
  264. .global_mod .global_extra {
  265. text-align: right;
  266. }
  267. .global_mod.float_layout:after {
  268. content: "\200B";
  269. display: block;
  270. height: 0;
  271. clear: both;
  272. }
  273. .frm_textarea {
  274. height: 80px;
  275. margin: 4px 0;
  276. }
  277. .frm_input {
  278. height: 22px;
  279. margin: 4px 0;
  280. }
  281. .frm_input, .frm_textarea {
  282. width: 100%;
  283. background-color: transparent;
  284. border: 0;
  285. outline: 0;
  286. }
  287. .portable_editor .frm_control_group {
  288. margin-bottom: 10px;
  289. }
  290. .portable_editor .frm_control_group {
  291. margin-top: 30px;
  292. margin-bottom: 30px;
  293. padding-bottom: 0;
  294. }
  295. .menu_form_area .frm_label {
  296. width: 5em;
  297. }
  298. .menu_content .frm_control_group {
  299. margin-top: 0;
  300. }
  301. .frm_label {
  302. float: left;
  303. width: 5em;
  304. margin-top: .3em;
  305. margin-right: 1em;
  306. font-size: 14px;
  307. }
  308. .portable_editor .frm_label .title {
  309. font-weight: 400;
  310. font-style: normal;
  311. }
  312. .frm_controls {
  313. display: table-cell;
  314. vertical-align: top;
  315. float: none;
  316. width: auto;
  317. }
  318. .frm_vertical_pt {
  319. padding-top: .3em;
  320. }
  321. .frm_input_box.counter_in {
  322. width: 228px;
  323. padding-right: 60px;
  324. }
  325. .frm_textarea_box.counter_in {
  326. width: 228px;
  327. padding-right: 60px;
  328. }
  329. .frm_textarea_box {
  330. display: inline-block;
  331. position: relative;
  332. line-height: 30px;
  333. vertical-align: middle;
  334. width: 278px;
  335. font-size: 14px;
  336. padding: 0 10px;
  337. border: 1px solid #e7e7eb;
  338. box-shadow: none;
  339. -moz-box-shadow: none;
  340. -webkit-box-shadow: none;
  341. border-radius: 0;
  342. -moz-border-radius: 0;
  343. -webkit-border-radius: 0;
  344. background-color: #fff;
  345. }
  346. .frm_input_box {
  347. display: inline-block;
  348. position: relative;
  349. height: 30px;
  350. line-height: 30px;
  351. vertical-align: middle;
  352. width: 278px;
  353. font-size: 14px;
  354. padding: 0 10px;
  355. border: 1px solid #e7e7eb;
  356. box-shadow: none;
  357. -moz-box-shadow: none;
  358. -webkit-box-shadow: none;
  359. border-radius: 0;
  360. -moz-border-radius: 0;
  361. -webkit-border-radius: 0;
  362. background-color: #fff;
  363. }
  364. .menu_form_area .frm_tips, .menu_form_area .frm_msg {
  365. width: auto;
  366. }
  367. .frm_radio_label, .frm_checkbox_label {
  368. display: inline-block;
  369. text-align: left;
  370. cursor: pointer;
  371. margin-right: 1em;
  372. }
  373. .icon_radio {
  374. background: url(../x_component_Setting/$Main/default/mpweixin/base_z49d030.png) 0 -140px no-repeat;
  375. width: 16px;
  376. height: 16px;
  377. vertical-align: middle;
  378. display: inline-block;
  379. }
  380. .icon_radio.selected, .selected .icon_radio {
  381. background: url(../x_component_Setting/$Main/default/mpweixin/base_z49d030.png) 0 -160px no-repeat;
  382. }
  383. .icon_radio, .icon_checkbox {
  384. margin-right: 3px;
  385. margin-top: -2px;
  386. *margin-top: 0;
  387. }
  388. .frm_radio, .frm_checkbox {
  389. position: absolute;
  390. left: -999em;
  391. }
  392. .frm_tips {
  393. position: relative;
  394. }
  395. .frm_tips, .frm_msg {
  396. padding-top: 4px;
  397. width: 300px;
  398. }
  399. .frm_tips {
  400. color: #9a9a9a;
  401. }
  402. .frm_msg.fail {
  403. color: #fa5151;
  404. }
  405. .menu_content_tips {
  406. padding-bottom: 10px;
  407. }
  408. .tips_global {
  409. color: #9a9a9a;
  410. }
  411. .dn {
  412. display: none;
  413. }
  414. .menu_content {
  415. padding: 16px 20px;
  416. border: 1px solid #e7e7eb;
  417. background-color: #fff;
  418. }
  419. .btn-box {
  420. padding: 20px 0 30px 0;
  421. display: flex;
  422. justify-content: center;
  423. align-items: center;
  424. }
  425. .btn_primary {
  426. background-color: #07c160;
  427. background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#07c160),to(#07c160));
  428. background-image: linear-gradient(to bottom,#07c160 0,#07c160 100%);
  429. border-color: #07c160;
  430. color: #fff;
  431. }
  432. .btn {
  433. display: inline-block;
  434. overflow: visible;
  435. margin-left: .5em;
  436. margin-right: .5em;
  437. min-width: 80px !important;
  438. padding: 0;
  439. height: 30px;
  440. line-height: 30px;
  441. vertical-align: middle;
  442. text-align: center;
  443. text-decoration: none;
  444. border-radius: 3px;
  445. -moz-border-radius: 3px;
  446. -webkit-border-radius: 3px;
  447. font-size: 14px;
  448. border-width: 1px;
  449. border-style: solid;
  450. cursor: pointer;
  451. }
  452. .btn button {
  453. color: #fff;
  454. width: 90%;
  455. display: block;
  456. height: 100%;
  457. background-color: transparent;
  458. border: 0;
  459. outline: 0;
  460. overflow: visible;
  461. cursor: pointer;
  462. }