hiprint.css 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806
  1. /* hiprint-pagination */
  2. .hiprint-pagination {
  3. display: inline-block;
  4. padding-left: 0;
  5. }
  6. .hiprint-pagination > li {
  7. border: 1px solid #bdc3c7;
  8. -moz-border-radius: 2px;
  9. -webkit-border-radius: 2px;
  10. display: block;
  11. float: left;
  12. padding: 5px;
  13. text-decoration: none;
  14. margin-right: 5px;
  15. margin-bottom: 5px;
  16. font-family: helvetica;
  17. font-size: 13px;
  18. cursor: pointer
  19. }
  20. .hiprint-pagination > li > span {
  21. padding: 0 10px 0 10px;
  22. }
  23. .hiprint-pagination > li > a {
  24. color: #bdc3c7;
  25. font-weight: bold;
  26. text-decoration: none;
  27. font-size: 11px;
  28. padding: 3px;
  29. }
  30. .hiprint-pagination > li > a:hover {
  31. color: red;
  32. }
  33. .hiprint-pagination-sm > li > a {
  34. padding: 5px 10px;
  35. font-size: 12px;
  36. line-height: 1.5;
  37. }
  38. /*rect-printElement-type hiprint-printElement-type */
  39. .rect-printElement-types .hiprint-printElement-type {
  40. display: block;
  41. }
  42. .rect-printElement-types .hiprint-printElement-type {
  43. padding: 0 0 0 0;
  44. list-style: none;
  45. }
  46. .rect-printElement-types .hiprint-printElement-type > li > .title {
  47. display: block;
  48. padding: 4px 0px;
  49. clear: both;
  50. }
  51. .rect-printElement-types .hiprint-printElement-type > li > ul {
  52. padding: 0 0 0 0;
  53. display: block;
  54. list-style: none;
  55. }
  56. .rect-printElement-types .hiprint-printElement-type > li > ul > li {
  57. display: block;
  58. width: 50%;
  59. float: left;
  60. max-width: 100px;
  61. }
  62. .rect-printElement-types .hiprint-printElement-type > li > ul > li > a {
  63. height: 92px;
  64. padding: 12px 6px;
  65. margin-left: -1px;
  66. line-height: 1.42857143;
  67. color: #337ab7;
  68. text-decoration: none;
  69. background-color: #fff;
  70. border: 1px solid #ddd;
  71. margin-right: 5px;
  72. width: 95%;
  73. max-width: 100px;
  74. display: inline-block;
  75. text-align: center;
  76. margin-bottom: 7px;
  77. box-sizing: border-box;
  78. color: #b9a5a6;
  79. border: 1px solid rgba(0,0,0,0.2);
  80. border-radius: 3px;
  81. box-shadow: 0 1px 0 0 rgba(0,0,0,0.15);
  82. }
  83. /*small-printElement-type hiprint-printElement-type */
  84. .small-printElement-types .hiprint-printElement-type {
  85. display: block;
  86. }
  87. .small-printElement-types .hiprint-printElement-type {
  88. padding: 0 0 0 0;
  89. list-style: none;
  90. }
  91. .small-printElement-types .hiprint-printElement-type > li > .title {
  92. display: block;
  93. padding: 4px 0px;
  94. clear: both;
  95. }
  96. .small-printElement-types .hiprint-printElement-type > li > ul {
  97. padding: 0 0 0 0;
  98. display: block;
  99. list-style: none;
  100. width: 100%;
  101. }
  102. .small-printElement-types .hiprint-printElement-type > li > ul > li {
  103. display: block;
  104. width: 50%;
  105. float: left;
  106. padding: 0 4px;
  107. }
  108. .small-printElement-types .hiprint-printElement-type > li > ul > li > a {
  109. height: 22px;
  110. /* padding: 12px 6px; */
  111. /* margin-left: -1px; */
  112. line-height: 20px;
  113. color: #337ab7;
  114. text-decoration: none;
  115. background-color: #fff;
  116. border: 1px solid #ddd;
  117. margin-right: 5px;
  118. width: 100%;
  119. display: block;
  120. text-align: center;
  121. margin-bottom: 7px;
  122. box-sizing: border-box;
  123. color: #b9a5a6;
  124. border: 1px solid rgba(0,0,0,0.2);
  125. border-radius: 3px;
  126. box-shadow: 0 1px 0 0 rgba(0,0,0,0.15);
  127. }
  128. /* hiprint-toolbar*/
  129. .hiprint-toolbar {
  130. }
  131. .hiprint-toolbar > ul {
  132. padding: 0px;
  133. margin-bottom: 5px;
  134. }
  135. .hiprint-toolbar > ul > li {
  136. display: inline-block;
  137. }
  138. .hiprint-toolbar > ul > li > a {
  139. position: relative;
  140. float: left;
  141. padding: 3px 10px;
  142. margin-left: -1px;
  143. line-height: 1.42857143;
  144. color: #337ab7;
  145. text-decoration: none;
  146. background-color: #fff;
  147. border: 1px solid #ddd;
  148. margin-right: 4px;
  149. cursor: pointer;
  150. }
  151. .hiprint-printElement-type .glyphicon-class {
  152. display: block;
  153. text-align: center;
  154. word-wrap: break-word;
  155. /*font-size: 0.65rem;
  156. font-weight: normal;*/
  157. font-family: Helvetica, sans-serif;
  158. }
  159. .hiprint-printElement-type .glyphicon {
  160. margin-top: 5px;
  161. margin-bottom: 10px;
  162. font-size: 37px;
  163. }
  164. /*
  165. */
  166. /*option css*/
  167. /*option css*/
  168. .hiprint-option-items {
  169. font-size: .75rem;
  170. padding: 10px 5px;
  171. display: flex;
  172. flex-wrap: wrap;
  173. align-items: flex-end;
  174. box-sizing: border-box;
  175. width: 100%;
  176. }
  177. .hiprint-option-items .hiprint-option-item {
  178. box-sizing: border-box;
  179. float: left;
  180. width: 50%;
  181. margin-bottom: 5px;
  182. padding: 0 5px;
  183. }
  184. .hiprint-option-items .hiprint-option-item-row {
  185. width: 100%;
  186. }
  187. .hiprint-option-item-label {
  188. margin: 5px 5px 3px 0;
  189. }
  190. .hiprint-option-items .hiprint-option-item-field input, .hiprint-option-items .hiprint-option-item-field select, .hiprint-option-items .hiprint-option-item-field textarea {
  191. color: inherit;
  192. background-color: transparent;
  193. box-sizing: border-box;
  194. width: 100%;
  195. position: relative;
  196. padding: 3px;
  197. z-index: 1;
  198. border: 1px solid rgb(169, 169, 169);
  199. height: 19pt;
  200. }
  201. .hiprint-option-item-settingBtn {
  202. height: 19pt;
  203. line-height: 19pt;
  204. font-size: 12px;
  205. padding: 0 24px;
  206. background: #00c1de;
  207. border-color: transparent;
  208. color: #fff;
  209. display: inline-block;
  210. margin: 5px;
  211. font-weight: 400;
  212. border: 1px solid transparent;
  213. font-family: PingFangSC, helvetica neue, hiragino sans gb, arial, microsoft yahei ui, microsoft yahei, simsun, "sans-serif";
  214. vertical-align: middle;
  215. transition: .3s cubic-bezier(.4, 0, .2, 1);
  216. transform: translateZ(0);
  217. }
  218. .hiprint-option-item-deleteBtn {
  219. background: red;
  220. }
  221. .hiprint-option-items .minicolors {
  222. position: relative;
  223. }
  224. .hiprint-option-items .minicolors-sprite {
  225. background-image: url(./image/jquery.minicolors.png);
  226. }
  227. .hiprint-option-items .minicolors-swatch {
  228. position: absolute;
  229. vertical-align: middle;
  230. background-position: -80px 0;
  231. cursor: text;
  232. padding: 0;
  233. margin: 0;
  234. display: inline-block;
  235. }
  236. .hiprint-option-items .minicolors-swatch-color {
  237. position: absolute;
  238. top: 0;
  239. left: 0;
  240. right: 0;
  241. bottom: 0;
  242. }
  243. .hiprint-option-items .minicolors input[type=hidden] + .minicolors-swatch {
  244. width: 28px;
  245. position: static;
  246. cursor: pointer;
  247. }
  248. .hiprint-option-items .minicolors input[type=hidden][disabled] + .minicolors-swatch {
  249. cursor: default;
  250. }
  251. /* Panel */
  252. .hiprint-option-items .minicolors-panel {
  253. position: absolute;
  254. width: 173px;
  255. background: white;
  256. border: solid 1px #CCC;
  257. box-shadow: 0 0 20px rgba(0, 0, 0, .2);
  258. z-index: 99999;
  259. box-sizing: content-box;
  260. display: none;
  261. }
  262. .hiprint-option-items .minicolors-panel.minicolors-visible {
  263. display: block;
  264. }
  265. /* Panel positioning */
  266. .hiprint-option-items .minicolors-position-top .minicolors-panel {
  267. top: -154px;
  268. }
  269. .hiprint-option-items .minicolors-position-right .minicolors-panel {
  270. right: 0;
  271. }
  272. .hiprint-option-items .minicolors-position-bottom .minicolors-panel {
  273. top: auto;
  274. }
  275. .hiprint-option-items .minicolors-position-left .minicolors-panel {
  276. left: 0;
  277. }
  278. .hiprint-option-items .minicolors-with-opacity .minicolors-panel {
  279. width: 194px;
  280. }
  281. .hiprint-option-items .minicolors .minicolors-grid {
  282. position: relative;
  283. top: 1px;
  284. left: 1px; /* LTR */
  285. width: 150px;
  286. height: 150px;
  287. margin-bottom: 2px;
  288. background-position: -120px 0;
  289. cursor: crosshair;
  290. }
  291. .hiprint-option-items .minicolors .minicolors-grid-inner {
  292. position: absolute;
  293. top: 0;
  294. left: 0;
  295. width: 150px;
  296. height: 150px;
  297. }
  298. .hiprint-option-items .minicolors-slider-saturation .minicolors-grid {
  299. background-position: -420px 0;
  300. }
  301. .hiprint-option-items .minicolors-slider-saturation .minicolors-grid-inner {
  302. background-position: -270px 0;
  303. background-image: inherit;
  304. }
  305. .hiprint-option-items .minicolors-slider-brightness .minicolors-grid {
  306. background-position: -570px 0;
  307. }
  308. .hiprint-option-items .minicolors-slider-brightness .minicolors-grid-inner {
  309. background-color: black;
  310. }
  311. .hiprint-option-items .minicolors-slider-wheel .minicolors-grid {
  312. background-position: -720px 0;
  313. }
  314. .hiprint-option-items .minicolors-slider,
  315. .hiprint-option-items .minicolors-opacity-slider {
  316. position: absolute;
  317. top: 1px;
  318. left: 152px; /* LTR */
  319. width: 20px;
  320. height: 150px;
  321. background-color: white;
  322. background-position: 0 0;
  323. cursor: row-resize;
  324. }
  325. .hiprint-option-items .minicolors-slider-saturation .minicolors-slider {
  326. background-position: -60px 0;
  327. }
  328. .hiprint-option-items .minicolors-slider-brightness .minicolors-slider {
  329. background-position: -20px 0;
  330. }
  331. .hiprint-option-items .minicolors-slider-wheel .minicolors-slider {
  332. background-position: -20px 0;
  333. }
  334. .hiprint-option-items .minicolors-opacity-slider {
  335. left: 173px; /* LTR */
  336. background-position: -40px 0;
  337. display: none;
  338. }
  339. .hiprint-option-items .minicolors-with-opacity .minicolors-opacity-slider {
  340. display: block;
  341. }
  342. /* Pickers */
  343. .hiprint-option-items .minicolors-grid .minicolors-picker {
  344. position: absolute;
  345. top: 70px;
  346. left: 70px;
  347. width: 12px;
  348. height: 12px;
  349. border: solid 1px black;
  350. border-radius: 10px;
  351. margin-top: -6px;
  352. margin-left: -6px;
  353. background: none;
  354. }
  355. .hiprint-option-items .minicolors-grid .minicolors-picker > div {
  356. position: absolute;
  357. top: 0;
  358. left: 0;
  359. width: 8px;
  360. height: 8px;
  361. border-radius: 8px;
  362. border: solid 2px white;
  363. box-sizing: content-box;
  364. }
  365. .hiprint-option-items .minicolors-picker {
  366. position: absolute;
  367. top: 0;
  368. left: 0;
  369. width: 18px;
  370. height: 2px;
  371. background: white;
  372. border: solid 1px black;
  373. margin-top: -2px;
  374. box-sizing: content-box;
  375. }
  376. /* Swatches */
  377. .hiprint-option-items .minicolors-swatches,
  378. .hiprint-option-items .minicolors-swatches li {
  379. margin: 5px 0 3px 5px; /* LTR */
  380. padding: 0;
  381. list-style: none;
  382. overflow: hidden;
  383. }
  384. .hiprint-option-items .minicolors-swatches .minicolors-swatch {
  385. position: relative;
  386. float: left; /* LTR */
  387. cursor: pointer;
  388. margin: 0 4px 0 0; /* LTR */
  389. }
  390. .hiprint-option-items .minicolors-with-opacity .minicolors-swatches .minicolors-swatch {
  391. margin-right: 7px; /* LTR */
  392. }
  393. .hiprint-option-items .minicolors-swatch.selected {
  394. border-color: #000;
  395. }
  396. /* Inline controls */
  397. .hiprint-option-items .minicolors-inline {
  398. display: inline-block;
  399. }
  400. .hiprint-option-items .minicolors-inline .minicolors-input {
  401. display: none !important;
  402. }
  403. .hiprint-option-items .minicolors-inline .minicolors-panel {
  404. position: relative;
  405. top: auto;
  406. left: auto; /* LTR */
  407. box-shadow: none;
  408. z-index: auto;
  409. display: inline-block;
  410. }
  411. /* Bootstrap theme */
  412. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-swatch {
  413. z-index: 2;
  414. top: 3px;
  415. left: 3px;
  416. width: 17px;
  417. height: 17px;
  418. }
  419. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-swatches .minicolors-swatch {
  420. margin-bottom: 2px;
  421. top: 0;
  422. left: 0; /* LTR */
  423. width: 20px;
  424. height: 20px;
  425. }
  426. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-swatch-color {
  427. border-radius: inherit;
  428. }
  429. .hiprint-option-items .minicolors-theme-bootstrap.minicolors-position-right > .minicolors-swatch {
  430. left: auto; /* LTR */
  431. right: 3px; /* LTR */
  432. }
  433. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-input {
  434. float: none;
  435. padding-left: 23px; /* LTR */
  436. }
  437. .hiprint-option-items .minicolors-theme-bootstrap.minicolors-position-right .minicolors-input {
  438. padding-right: 44px; /* LTR */
  439. padding-left: 12px; /* LTR */
  440. }
  441. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-input.input-lg + .minicolors-swatch {
  442. top: 4px;
  443. left: 4px; /* LTR */
  444. width: 37px;
  445. height: 37px;
  446. border-radius: 5px;
  447. }
  448. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-input.input-sm + .minicolors-swatch {
  449. width: 24px;
  450. height: 24px;
  451. }
  452. .hiprint-option-items .minicolors-theme-bootstrap .minicolors-input.input-xs + .minicolors-swatch {
  453. width: 18px;
  454. height: 18px;
  455. }
  456. .hiprint-option-items .input-group .minicolors-theme-bootstrap:not(:first-child) .minicolors-input {
  457. border-top-left-radius: 0; /* LTR */
  458. border-bottom-left-radius: 0; /* LTR */
  459. }
  460. /*hitable reizer*/
  461. .hitable {
  462. }
  463. .hitable .selected {
  464. background: #3e66ad;
  465. }
  466. /*resizer*/
  467. .hitable tr.resizerRow,
  468. .hitable .resizerRow td {
  469. border: 0pt dashed;
  470. height: 0pt;
  471. background: #fff;
  472. }
  473. .hitable tr.resizerRow + tr,
  474. .hitable tr.resizerRow + tr td {
  475. border-top: 0px !important;
  476. }
  477. .hitable td.resizerColumn {
  478. border: 0pt dashed;
  479. width: 0.000001px !important;
  480. background: #fff;
  481. }
  482. .hitable td.resizerColumn + td {
  483. border-left: 0px !important;
  484. }
  485. /*GRIP*/
  486. .columngrips {
  487. height: 0px;
  488. position: absolute;
  489. }
  490. .columngrip {
  491. margin-left: -5px;
  492. position: absolute;
  493. z-index: 5;
  494. width: 10px;
  495. }
  496. .columngrip .gripResizer {
  497. position: absolute;
  498. filter: alpha(opacity=1);
  499. opacity: 0;
  500. width: 10px;
  501. height: 100%;
  502. cursor: col-resize;
  503. top: 0px;
  504. }
  505. .columngripDraging {
  506. border-left: 1px dotted black;
  507. }
  508. .rowgrips {
  509. height: 0px;
  510. width: 0px;
  511. position: absolute;
  512. }
  513. .rowgrip {
  514. margin-top: -5px;
  515. position: absolute;
  516. z-index: 5;
  517. height: 10px;
  518. }
  519. .rowgrip .gripResizer {
  520. position: absolute;
  521. filter: alpha(opacity=1);
  522. opacity: 0;
  523. height: 10px;
  524. width: 100%;
  525. cursor: row-resize;
  526. left: 0px;
  527. }
  528. .rowgripDraging {
  529. border-top: 1px dotted black;
  530. }
  531. .hitable .hitable-editor-text {
  532. border: 1px solid;
  533. width: 95%;
  534. height: 80%;
  535. }
  536. .hipanel-disable {
  537. height: 0px;
  538. display: block !important;
  539. top: 8500px;
  540. width: 0px;
  541. overflow: hidden;
  542. position: absolute;
  543. }
  544. .hiprint_rul_wrapper {
  545. position: absolute;
  546. height: 100%;
  547. width: 100%;
  548. overflow: hidden;
  549. pointer-events: none;
  550. border: 0;
  551. border-top: 1px solid rgb(201, 190, 190);
  552. border-left: 1px solid rgb(201, 190, 190);
  553. padding-left: 15px;
  554. margin: -16px
  555. }
  556. .hiprint_rul_wrapper .h_img {
  557. position: absolute;
  558. top: 0px;
  559. left: 15px;
  560. width: 400mm;
  561. height: 15px;
  562. }
  563. .hiprint_rul_wrapper .v_img {
  564. width: 400mm;
  565. transform: rotate(90deg);
  566. transform-origin: 0 100%;
  567. height: 15px;
  568. position: absolute;
  569. top: -2px;
  570. left: 0px;
  571. }
  572. /*hiprint-option-table*/
  573. .hiprint-option-table-selected-columns {
  574. color: inherit;
  575. background-color: transparent;
  576. box-sizing: border-box;
  577. width: 100%;
  578. position: relative;
  579. padding: 0px;
  580. list-style: none;
  581. }
  582. .hiprint-option-table-selected-columns .hiprint-option-table-selected-item {
  583. color: inherit;
  584. background-color: transparent;
  585. box-sizing: border-box;
  586. width: 100%;
  587. padding: 0 3px;
  588. border: 1px solid rgb(169, 169, 169);
  589. line-height: 19pt;
  590. margin: 3px 0;
  591. }
  592. /*hi-pretty */
  593. .hi-pretty * {
  594. box-sizing: border-box;
  595. }
  596. .hi-pretty input:not([type='checkbox']):not([type='radio']) {
  597. display: none;
  598. }
  599. .hi-pretty {
  600. position: relative;
  601. display: inline-block;
  602. margin-right: 1em;
  603. white-space: nowrap;
  604. line-height: 1;
  605. }
  606. .hi-pretty input {
  607. position: absolute;
  608. left: 0;
  609. top: 0;
  610. min-width: 1em;
  611. width: 100%;
  612. height: 100%;
  613. z-index: 2;
  614. opacity: 0;
  615. margin: 0;
  616. padding: 0;
  617. cursor: pointer;
  618. }
  619. .hi-pretty .state label {
  620. position: initial;
  621. display: inline-block;
  622. font-weight: normal;
  623. margin: 0;
  624. text-indent: 1.5em;
  625. min-width: calc(1em + 2px);
  626. }
  627. .hi-pretty .state label:before,
  628. .hi-pretty .state label:after {
  629. content: '';
  630. width: calc(1em + 2px);
  631. height: calc(1em + 2px);
  632. display: block;
  633. box-sizing: border-box;
  634. border-radius: 0;
  635. border: 1px solid transparent;
  636. z-index: 0;
  637. position: absolute;
  638. left: 0;
  639. top: calc((0% - (100% - 1em)) - 8%);
  640. background-color: transparent;
  641. }
  642. .hi-pretty .state label:before {
  643. border-color: #bdc3c7;
  644. }
  645. .hi-pretty .state.p-is-hover,
  646. .hi-pretty .state.p-is-indeterminate {
  647. display: none;
  648. }
  649. .hi-pretty.p-default.p-fill .state label:after {
  650. -webkit-transform: scale(1);
  651. -ms-transform: scale(1);
  652. transform: scale(1);
  653. }
  654. .hi-pretty.p-default .state label:after {
  655. -webkit-transform: scale(0.6);
  656. -ms-transform: scale(0.6);
  657. transform: scale(0.6);
  658. }
  659. .hi-pretty.p-default input:checked ~ .state label:after {
  660. background-color: #bdc3c7 !important;
  661. }
  662. .hi-pretty.p-default.p-thick .state label:before,
  663. .hi-pretty.p-default.p-thick .state label:after {
  664. border-width: calc(1em / 7);
  665. }
  666. .hi-pretty.p-default.p-thick .state label:after {
  667. -webkit-transform: scale(0.4) !important;
  668. -ms-transform: scale(0.4) !important;
  669. transform: scale(0.4) !important;
  670. }