add.wxss 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892
  1. page{
  2. background-color: #f0f0f0;
  3. }
  4. .TopLeftButton{
  5. width: 100rpx;
  6. height:100rpx;
  7. justify-content: flex-start;
  8. }
  9. .CombinedShape{
  10. width:19rpx;
  11. height:34rpx;
  12. }
  13. .panelTop{
  14. width: 100%;
  15. height:100rpx;
  16. background-color: #fff;
  17. position: fixed;
  18. z-index: 10;
  19. border-bottom: 1rpx solid #d2d2d2;
  20. justify-content: space-between;
  21. font-size: 28rpx;
  22. }
  23. .panelTop .panelTopLeft {
  24. width: 374rpx;
  25. background-color: #fff;
  26. height:100rpx;
  27. font-size:28rpx;
  28. }
  29. .universalpic_data_black_30x32{
  30. width:30rpx;
  31. height:28rpx;
  32. }
  33. .universalpic_examine_black_30x32{
  34. width:30rpx;
  35. height:32rpx;
  36. }
  37. .line {
  38. width:100%;
  39. height:120rpx;
  40. background-color: #f0f0f0;
  41. }
  42. .line0 {
  43. width:2rpx;
  44. height:30rpx;
  45. background-color: #d2d2d2;
  46. }
  47. .panelText {
  48. font-size: 28rpx;
  49. margin-left: 20rpx;
  50. }
  51. .panelText1 {
  52. width:344rpx;
  53. height:100rpx;
  54. color:#FE6659;
  55. text-align: left;
  56. line-height: 100rpx;
  57. margin: 0 30rpx;
  58. font-weight: 500;
  59. }
  60. .panelText2 {
  61. width:344rpx;
  62. height:100rpx;
  63. color:#0071EF;
  64. text-align: right;
  65. line-height: 100rpx;
  66. margin: 0 30rpx;
  67. font-weight: 500;
  68. }
  69. .panelTop .panelTopRight{
  70. width:100rpx;
  71. height:100rpx;
  72. }
  73. /* 中间开始 */
  74. .panelItemCircle{
  75. width:710rpx;
  76. border-radius: 20rpx;
  77. background-color: #fff;
  78. justify-content: space-between;
  79. }
  80. .panelItemCircleTop{
  81. border-top-left-radius: 20rpx;
  82. border-top-right-radius: 20rpx;
  83. }
  84. .panelItemCircleBottom{
  85. border-bottom-left-radius: 20rpx;
  86. border-bottom-right-radius: 20rpx;
  87. }
  88. .panelItemCircle1{
  89. width:100%;
  90. height: 80rpx;
  91. justify-content: space-between;
  92. }
  93. .panelItemCircle11{
  94. font-size: 28rpx;
  95. margin-left:30rpx;
  96. height: 100rpx;
  97. font-weight: 400;
  98. align-items: flex-start;
  99. }
  100. .panelItemCircle110{
  101. height: 132rpx;
  102. }
  103. .panelItemCircle111{
  104. font-size: 28rpx;
  105. color:#1e1e1e;
  106. }
  107. .panelItemCircle1110{
  108. color:#4D4D4D;
  109. font-weight: 500;
  110. margin-top: 10rpx;
  111. }
  112. .panelItemCircle112{
  113. font-size: 20rpx;
  114. color:#787878;
  115. margin-top: 4rpx;
  116. }
  117. .panelItemCircle12{
  118. margin-right: 30rpx;
  119. }
  120. .line2{
  121. width: 100%;
  122. height:1rpx;
  123. background-color: #E3E3E3;
  124. }
  125. .panelTimePlan {
  126. margin-top: 20rpx;
  127. height: 100rpx;
  128. width:710rpx;
  129. justify-content: space-between;
  130. font-size: 28rpx;
  131. background-color: #fff;
  132. }
  133. .panelTimePlanadd2_IsEditCardType {
  134. width:610rpx;
  135. }
  136. .panelTimePlan0 {
  137. background-color: #0071EF;
  138. color:#fff;
  139. }
  140. .panelTimePlan1{
  141. color:#787878;
  142. font-size: 28rpx;
  143. font-weight: 500;
  144. text-align: right;
  145. overflow: hidden;
  146. max-width: 400rpx;
  147. white-space:nowrap;
  148. margin-left: 10rpx;
  149. }
  150. .panelTimePlan1_IsEditCardType{
  151. color:#0071EF;
  152. }
  153. .universalpic_plan_6dots_black_30x32{
  154. width:30rpx;
  155. height:32rpx;
  156. margin-right: 20rpx;
  157. }
  158. .panelTimePlanRemark{
  159. font-size:24rpx;
  160. margin-top:30rpx;
  161. color:#787878;
  162. font-weight: 400;
  163. }
  164. .universalpic_tag_black_30x30{
  165. width:30rpx;
  166. height:30rpx;
  167. margin-right: 20rpx;
  168. }
  169. /* 中间结束 */
  170. /* 弹出界面开始 */
  171. .panelTag{
  172. width: 690rpx;
  173. background-color: #fff;
  174. margin: 20rpx 30rpx;
  175. flex-wrap: wrap;
  176. justify-content: flex-start;
  177. }
  178. .panelTag .panelTag1{
  179. color:#1e1e1e;
  180. height:73rpx;
  181. line-height: 73rpx;
  182. }
  183. .panelTag .panelTag2{
  184. border-radius: 10rpx;
  185. background-color: #0071EF;
  186. color:#fff;
  187. }
  188. .panelTag .tag1{
  189. font-size: 24rpx;
  190. margin-right: 20rpx;
  191. margin-top:10rpx;
  192. padding: 0 20rpx;
  193. }
  194. .universalpic_del_white_14x14{
  195. width:14rpx;
  196. height:14rpx;
  197. margin: 10rpx 20rpx 0 -20rpx;
  198. }
  199. /* 弹出界面结束 */
  200. .panelTitle {
  201. width: 100%;
  202. height:100rpx;
  203. justify-content: flex-start;
  204. }
  205. .panelTitle .panelTitle1 {
  206. font-size: 28rpx;
  207. margin-left: 30rpx;
  208. }
  209. .panelItem {
  210. width: 100%;
  211. justify-content: flex-start;
  212. font-size: 28rpx;
  213. min-height: 130rpx;
  214. height:auto;
  215. background-color: #fff;
  216. align-items: flex-start;
  217. font-weight: 400;
  218. }
  219. .iphone10plus{
  220. width:100%;
  221. height:30rpx;
  222. background-color: #fff;
  223. }
  224. .panelItem0 {
  225. width:100%;
  226. }
  227. .panelItem01 {
  228. margin-top: 20rpx;
  229. width:80rpx;
  230. height: 100rpx;
  231. line-height: 100rpx;
  232. text-align: center;
  233. font-size:24rpx;
  234. margin-left: 20rpx;
  235. background-color: #fff;
  236. border-radius: 20rpx;
  237. }
  238. .panelItem1 {
  239. margin-left: 30rpx;
  240. font-weight: 400;
  241. }
  242. .panelItem .panelItem11{
  243. margin: 45rpx 0 0 30rpx;
  244. justify-content: flex-start;
  245. align-items: flex-start;
  246. }
  247. .panelItem .number {
  248. font-family: 'Roboto-Black';
  249. font-size: 24rpx;
  250. width: 40rpx;
  251. height: 40rpx;
  252. background-color: #0071ef;
  253. border-radius: 50%;
  254. text-align: center;
  255. line-height: 40rpx;
  256. color: #fff;
  257. }
  258. .panelItem .number2 {
  259. background-color: #fff;
  260. border:2rpx solid #0071EF;
  261. width: 38rpx;
  262. height:38rpx;
  263. line-height: 38rpx;
  264. color: #0071ef;
  265. }
  266. .panelItem2 {
  267. margin-right: 30rpx;
  268. font-weight: 400;
  269. }
  270. .panelItem .panelItem21 {
  271. font-weight: 400;
  272. flex-wrap: wrap;
  273. align-items: flex-start;
  274. justify-content: flex-start;
  275. width: 610rpx;
  276. font-size: 36rpx;
  277. color:#1e1e1e;
  278. margin: 40rpx 0 40rpx 40rpx;
  279. }
  280. .panelItem .textNull {
  281. color: #d2d2d2;
  282. font-weight: 400;
  283. }
  284. .panelItem .sound{
  285. width:40rpx;
  286. height:40rpx;
  287. margin: 5rpx 10rpx 0 10rpx;
  288. border-radius: 50%;
  289. background-color: #F0F0F0;
  290. }
  291. .panelItem .universalpic_read_mark_black_20x20 {
  292. width:21rpx;
  293. height:20rpx;
  294. }
  295. .panelItem .textLine {
  296. text-decoration: underline;
  297. }
  298. .panelItem .textHighlighter {
  299. color:#fff;
  300. background-color: #1E1E1E;
  301. }
  302. .panelItem .textPinyin {
  303. text-decoration: underline;
  304. margin-right: 10rpx;
  305. }
  306. .panelItem .panelRecorder {
  307. width: 70rpx;
  308. height: 70rpx;
  309. background-color: #fff;
  310. border-radius: 10rpx;
  311. border:1rpx solid #9B9B9B;
  312. }
  313. .panelItem .universalpic_voicerecorder_transmit_black_44x34{
  314. width: 44rpx;
  315. height: 34rpx;
  316. }
  317. .panelItem .imageFree{
  318. width:100rpx;
  319. }
  320. .panelItem .textReturn{
  321. width:100%;
  322. }
  323. .panelItem .textBr{
  324. width:100%;
  325. height:20rpx;
  326. }
  327. .panelItem .textReturn2{
  328. width:100%;
  329. height:30rpx;
  330. }
  331. .panelSave {
  332. width: 100%;
  333. background-color: #fff;
  334. position: fixed;
  335. bottom: 0;
  336. z-index: 10;
  337. border-top: 1rpx solid #d2d2d2;
  338. }
  339. .panelSave .panelSave00 {
  340. width: 100%;
  341. height: 120rpx;
  342. justify-content: space-between;
  343. }
  344. .iphone10plus{
  345. width:100%;
  346. height:30rpx;
  347. background-color: #fff;
  348. }
  349. .panelSave .panelSave1 {
  350. width: 125rpx;
  351. line-height: 120rpx;
  352. text-align: center;
  353. font-size: 28rpx;
  354. color:#1e1e1e;
  355. }
  356. .panelSave .panelSave2 {
  357. width: 500rpx;
  358. background-color: #f0f0f0;
  359. color:#1E1E1E;
  360. text-align: center;
  361. line-height: 80rpx;
  362. height:80rpx;
  363. border-radius: 10rpx;
  364. font-size:36rpx;
  365. }
  366. .panelSave .panelSave0{
  367. width:290rpx;
  368. line-height:100rpx;
  369. text-align: center;
  370. margin:0;
  371. }
  372. .panelSave .line1 {
  373. width: 4rpx;
  374. height: 30rpx;
  375. background-color: #d2d2d2;
  376. }
  377. .universalpic_preview_black_30x30 {
  378. width: 36rpx;
  379. height: 36rpx;
  380. margin: 0 40rpx;
  381. }
  382. /* 字段编辑 */
  383. .addItem {
  384. justify-content: flex-start;
  385. font-weight: 500;
  386. color: #1e1e1e;
  387. background-color: #f0f0f0;
  388. position: fixed;
  389. }
  390. .left {
  391. margin-left: 20rpx;
  392. }
  393. .right {
  394. margin-right: 20rpx;
  395. }
  396. .panelItemTag {
  397. width: 100%;
  398. height: 100rpx;
  399. background-color: #fff;
  400. }
  401. .panelSaveTag0 {
  402. width: 100rpx;
  403. background-color: #fff;
  404. color: #FE6659;
  405. text-align: center;
  406. height: 80rpx;
  407. line-height: 80rpx;
  408. font-size: 28rpx;
  409. margin-left: 10rpx;
  410. }
  411. .panelSaveTag1 {
  412. width: 80rpx;
  413. height: 80rpx;
  414. background-color: #fff;
  415. margin-right: 10rpx;
  416. }
  417. .panelSaveTag2 {
  418. background-color: #0071ef;
  419. border-radius: 10rpx;
  420. }
  421. .universalpic_underline_begin_black_16x24 {
  422. width: 16rpx;
  423. height: 24rpx;
  424. }
  425. .universalpic_underline_end_white_34x24 {
  426. width: 34rpx;
  427. height: 24rpx;
  428. }
  429. .universalpic_highlighter_begin_black_30x25 {
  430. width: 30rpx;
  431. height: 25rpx;
  432. }
  433. .universalpic_highlighter_end_white_49x25 {
  434. width: 49rpx;
  435. height: 25rpx;
  436. }
  437. .universalpic_read_begin_black_26x26{
  438. width: 26rpx;
  439. height: 26rpx;
  440. }
  441. .universalpic_picture_black_30x28 {
  442. width: 30rpx;
  443. height: 28rpx;
  444. }
  445. .universalpic_voicerecorder_black_20x26{
  446. width: 20rpx;
  447. height: 26rpx;
  448. }
  449. .add {
  450. font-size: 42rpx;
  451. font-weight: 600;
  452. margin: 0 10rpx 10rpx 0;
  453. }
  454. .panelSaveTag11{
  455. margin-right: 0;
  456. }
  457. .panelSaveTag3 {
  458. color: #0071ef;
  459. margin-right: 10rpx;
  460. }
  461. .line1 {
  462. width: 4rpx;
  463. height: 30rpx;
  464. background-color: #d2d2d2;
  465. margin-right: 20rpx;
  466. }
  467. .universalpic_help_gray_26x26 {
  468. width: 26rpx;
  469. height: 26rpx;
  470. margin: 0 0 0 40rpx;
  471. }
  472. .panelInput {
  473. width: 100%;
  474. margin-top: 10rpx;
  475. background-color: #fff;
  476. font-size: 36rpx;
  477. font-weight: 400;
  478. }
  479. .input {
  480. margin: 30rpx 30rpx 0 30rpx;
  481. width: 690rpx;
  482. height: 315rpx;
  483. }
  484. .panelBtnItem {
  485. width: 100%;
  486. background-color: #fff;
  487. }
  488. .panelBtnSmall {
  489. z-index: 10;
  490. width:100%;
  491. height: 100rpx;
  492. background-color: #fff;
  493. display: flex;
  494. white-space: nowrap;
  495. }
  496. .panelBtnSmall .btn0 {
  497. width: 10rpx;
  498. display: inline-block;
  499. }
  500. .panelBtnSmall .btn {
  501. width: 80rpx;
  502. background-color: #fff;
  503. border: 1rpx solid #fff;
  504. color: #787878;
  505. border-radius: 10rpx;
  506. text-align: center;
  507. line-height: 80rpx;
  508. height: 80rpx;
  509. margin-top: 10rpx;
  510. margin-right: 10rpx;
  511. font-size: 28rpx;
  512. font-weight: 700;
  513. display: inline-block;
  514. }
  515. .panelBtnSmall .btn1 {
  516. border: 1rpx solid #f0f0f0;
  517. background-color: #f0f0f0;
  518. color: #1e1e1e;
  519. }
  520. .panelBtnSmall .btn2 {
  521. font-size: 24rpx;
  522. }
  523. .universalpic_editbar_brackets_gray {
  524. width: 34rpx;
  525. height: 26rpx;
  526. }
  527. .universalpic_editbar_underline_gray {
  528. width: 18rpx;
  529. height: 28rpx;
  530. }
  531. .universalpic_read_end_white_44x26{
  532. width: 44rpx;
  533. height: 26rpx;
  534. }
  535. .universalpic_editbar_sqr_gray {
  536. width: 25rpx;
  537. height: 22rpx;
  538. }
  539. .panelBtn {
  540. width: 100%;
  541. background-color: #f8f8f8;
  542. z-index: 10;
  543. }
  544. .panelBtn .line1 {
  545. width: 4rpx;
  546. height: 30rpx;
  547. background-color: #d2d2d2;
  548. }
  549. .panelBtn .text1 {
  550. width: 374rpx;
  551. line-height: 100rpx;
  552. text-align: center;
  553. font-size: 28rpx;
  554. color: #a20602;
  555. }
  556. .panelBtn .text2 {
  557. color: #0071ef;
  558. }
  559. .lineFooter {
  560. z-index: 10;
  561. }
  562. .Arrow{
  563. width:16rpx;
  564. height:26rpx;
  565. margin-left: 30rpx;
  566. }
  567. /* 更多功能 */
  568. .numberContainer {
  569. width: 100%;
  570. justify-content: flex-start;
  571. align-items: flex-start;
  572. position: fixed;
  573. background-color: #f0f0f0;
  574. color:#1e1e1e;
  575. z-index: 20;
  576. border-top: 1 solid #fff;
  577. }
  578. .universalpic_bell_black_30x30{
  579. width:42rpx;
  580. height:30rpx;
  581. margin: 50rpx 20rpx 0 30rpx;
  582. }
  583. .numberContainer .numberContaineFooter{
  584. width: 100%;
  585. position: fixed;
  586. bottom: 0;
  587. align-items: flex-start;
  588. font-size: 36rpx;
  589. border-top: 1rpx solid rgba(0, 0, 0, 0.2);
  590. text-align: center;
  591. line-height: 131rpx;
  592. }
  593. .numberContainer .numberContaineFooter2{
  594. color:#B3443B;
  595. font-weight: 500;
  596. }
  597. .universalpic_sequence_black_30x30_2{
  598. margin: 50rpx 20rpx 0 30rpx;
  599. }
  600. .numberContainerFooter1{
  601. width:100%;
  602. position: fixed;
  603. bottom:131rpx;
  604. }
  605. .numberContainerFooter102{
  606. width:100%;
  607. height: 132rpx;
  608. justify-content: flex-start;
  609. }
  610. .numberContainerFooter103{
  611. width:100%;
  612. height: 111rpx;
  613. justify-content: flex-start;
  614. }
  615. .numberContainerFooter104{
  616. width:100%;
  617. height: 100rpx;
  618. justify-content: flex-start;
  619. }
  620. .numberContainerFooter101{
  621. width:100%;
  622. height: 357rpx;
  623. justify-content: flex-start;
  624. align-items: flex-start;
  625. }
  626. .universalpic_edit_gray_25x25{
  627. width: 25rpx;
  628. height: 25rpx;
  629. margin: 0 30rpx 0 30rpx;
  630. }
  631. .universalpic_typesize_gray_30x18{
  632. width: 30rpx;
  633. height: 18rpx;
  634. margin: 57rpx 20rpx 0 30rpx;
  635. }
  636. .numberContainerFooter11{
  637. align-items: flex-start;
  638. margin-top: 40rpx;
  639. }
  640. .numberContainerFooter111{
  641. font-size:36rpx;
  642. font-weight: 400;
  643. }
  644. .numberContainerFooter1111{
  645. margin-top: 40rpx;
  646. }
  647. .numberContainerFooter113{
  648. font-size:28rpx;
  649. font-weight: 400;
  650. margin-left: 80rpx;
  651. }
  652. .numberContainerFooter112{
  653. justify-content: flex-start;
  654. flex-wrap: wrap;
  655. }
  656. .numberContainerFooter1121{
  657. line-height:73rpx;
  658. border:3rpx solid #D2D2D2;
  659. border-radius: 10rpx;
  660. text-align: center;
  661. margin: 30rpx 30rpx 0 0;
  662. font-size:24rpx;
  663. padding: 0 30rpx;
  664. }
  665. .numberContainerFooter1121Select{
  666. border:3rpx solid #0071EF;
  667. color:#fff;
  668. background-color: #0071EF;
  669. }
  670. .RecorderPanel1{
  671. width:100%;
  672. height:332rpx;
  673. background-color: #fff;
  674. position: fixed;
  675. bottom:0rpx;
  676. justify-content: flex-start;
  677. border-top:1rpx solid #d2d2d2;
  678. }
  679. .RecorderPanel11{
  680. width:100%;
  681. margin-top: 60rpx;
  682. }
  683. .RecorderPanel111{
  684. margin-left: 30rpx;
  685. }
  686. .RecorderPanel1111{
  687. margin-left: 20rpx;
  688. font-size:36rpx;
  689. }
  690. .RecorderPanel112{
  691. font-family: 'Roboto-Black';
  692. font-size:36rpx;
  693. color:#787878;
  694. }
  695. .RecorderPanel1121{
  696. color:#0071EF;
  697. }
  698. .btnRecorderStart{
  699. width:690rpx;
  700. line-height:110rpx;
  701. background-color: #F0F0F0;
  702. text-align: center;
  703. font-size:32rpx;
  704. font-weight: 500;
  705. color:#1E1E1E;
  706. margin-top: 40rpx;
  707. border-radius: 10rpx;
  708. }
  709. .RecorderPanel12{
  710. width:690rpx;
  711. height:110rpx;
  712. margin-top: 20rpx;
  713. justify-content: space-between;
  714. }
  715. .btnRecorderStart2{
  716. width:335rpx;
  717. color:#1E1E1E;
  718. }
  719. .symbol1{
  720. font-size:28rpx;
  721. margin-right: 20rpx;
  722. color:#F44336;
  723. }
  724. .symbol2{
  725. font-size:28rpx;
  726. margin-right: 20rpx;
  727. color:#4D4D4D;
  728. }
  729. .btnRecorderEnd{
  730. color:#fff;
  731. background-color: #0071EF;
  732. border:1rpx solid #0071EF;
  733. }
  734. .RecorderPanel2{
  735. width:100%;
  736. height:449rpx;
  737. position: fixed;
  738. bottom:332rpx;
  739. }
  740. .edit_voicerecorder_illus{
  741. width:222rpx;
  742. height:449rpx;
  743. }
  744. .RecorderPanel3{
  745. width:100%;
  746. min-height:714rpx;
  747. position: fixed;
  748. top:0;
  749. justify-content: flex-start;
  750. }
  751. .RecorderPanel31{
  752. width:100%;
  753. height:116rpx;
  754. justify-content: flex-start;
  755. align-items: flex-start;
  756. }
  757. .RecorderPanel311{
  758. font-size:24rpx;
  759. font-weight: 400;
  760. color:#787878;
  761. margin: 10rpx 0 0 30rpx;
  762. }
  763. .RecorderPanel32{
  764. width:690rpx;
  765. height:500rpx;
  766. font-size:36rpx;
  767. }