hiprint.css 17 KB

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