_print.scss 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328
  1. // stylelint-disable declaration-no-important, selector-no-qualifying-type
  2. // Source: https://github.com/h5bp/main.css/blob/master/src/_print.css
  3. // ==========================================================================
  4. // Print styles.
  5. // Inlined to avoid the additional HTTP request:
  6. // https://www.phpied.com/delay-loading-your-print-css/
  7. // ==========================================================================
  8. @if $enable-print-styles {
  9. @media print {
  10. *,
  11. *::before,
  12. *::after {
  13. // Bootstrap specific; comment out `color` and `background`
  14. //color: $black !important; // Black prints faster
  15. text-shadow: none !important;
  16. //background: transparent !important;
  17. box-shadow: none !important;
  18. }
  19. a {
  20. &:not(.btn) {
  21. text-decoration: underline;
  22. }
  23. }
  24. // Bootstrap specific; comment the following selector out
  25. //a[href]::after {
  26. // content: " (" attr(href) ")";
  27. //}
  28. abbr[title]::after {
  29. content: " (" attr(title) ")";
  30. }
  31. // Bootstrap specific; comment the following selector out
  32. //
  33. // Don't show links that are fragment identifiers,
  34. // or use the `javascript:` pseudo protocol
  35. //
  36. //a[href^="#"]::after,
  37. //a[href^="javascript:"]::after {
  38. // content: "";
  39. //}
  40. pre {
  41. white-space: pre-wrap !important;
  42. }
  43. pre,
  44. blockquote {
  45. border: $border-width solid $gray-500; // Bootstrap custom code; using `$border-width` instead of 1px
  46. page-break-inside: avoid;
  47. }
  48. //
  49. // Printing Tables:
  50. // https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
  51. //
  52. thead {
  53. display: table-header-group;
  54. }
  55. tr,
  56. img {
  57. page-break-inside: avoid;
  58. }
  59. p,
  60. h2,
  61. h3 {
  62. orphans: 3;
  63. widows: 3;
  64. }
  65. h2,
  66. h3 {
  67. page-break-after: avoid;
  68. }
  69. // Bootstrap specific changes start
  70. // Specify a size and min-width to make printing closer across browsers.
  71. // We don't set margin here because it breaks `size` in Chrome. We also
  72. // don't use `!important` on `size` as it breaks in Chrome.
  73. @page {
  74. size: $print-page-size;
  75. }
  76. body {
  77. min-width: $print-body-min-width !important;
  78. }
  79. .container {
  80. min-width: $print-body-min-width !important;
  81. }
  82. // Bootstrap components
  83. .navbar {
  84. display: none;
  85. }
  86. .badge {
  87. border: $border-width solid $black;
  88. }
  89. .table {
  90. border-collapse: collapse !important;
  91. td,
  92. th {
  93. background-color: $white !important;
  94. }
  95. }
  96. .table-bordered {
  97. th,
  98. td {
  99. border: 1px solid $gray-300 !important;
  100. }
  101. }
  102. .table-dark {
  103. color: inherit;
  104. th,
  105. td,
  106. thead th,
  107. tbody + tbody {
  108. border-color: $table-border-color;
  109. }
  110. }
  111. .table .thead-dark th {
  112. color: inherit;
  113. border-color: $table-border-color;
  114. }
  115. // Bootstrap specific changes end
  116. }
  117. }
  118. .BA-logo {
  119. width: 250px;
  120. margin-left: auto;
  121. margin-right: auto;
  122. padding-bottom: 10px;
  123. }
  124. .BA-header {
  125. font-family: "Times New Roman", Times, serif;
  126. text-align: center;
  127. padding-bottom: 20px;
  128. }
  129. .BA-div {
  130. padding-top: 100px;
  131. }
  132. .BA-p p {
  133. padding: 10px;
  134. }
  135. .BA-body {
  136. font-family: "Times New Roman", Times, serif;
  137. padding-top: 0px;
  138. padding-left: 50px;
  139. padding-right: 50px;
  140. }
  141. .demo {
  142. border: 1px solid #C0C0C0;
  143. border-collapse: collapse;
  144. padding: 5px;
  145. margin-left: auto;
  146. margin-right: auto;
  147. }
  148. .demo .thdemo {
  149. border: 1px solid #C0C0C0;
  150. padding: 5px;
  151. background: #F0F0F0;
  152. text-align: center;
  153. }
  154. .demo .trdemo{
  155. border: 1px solid #C0C0C0;
  156. padding: 5px;
  157. }
  158. .demo .tddemo {
  159. border: 1px solid #C0C0C0;
  160. padding: 5px;
  161. height: 100px;
  162. min-width: 200px;
  163. }
  164. .table-a {
  165. border: 1px solid #C0C0C0;
  166. border-collapse: collapse;
  167. margin-top: 20px;
  168. margin-bottom: 20px;
  169. padding: 5px;
  170. margin-left: -128px auto;
  171. margin-right: auto;
  172. table-layout: fixed;
  173. }
  174. .table-a th {
  175. border: 1px solid #C0C0C0;
  176. padding: 5px;
  177. background: #F0F0F0;
  178. text-align: center;
  179. }
  180. .table-a td {
  181. border: 1px solid #C0C0C0;
  182. padding: 5px;
  183. word-wrap: break-word;
  184. max-width: 150px;
  185. }
  186. #footer {
  187. position: fixed;
  188. width: 100%;
  189. bottom: 0;
  190. left: 0;
  191. right: 0;
  192. text-align: center;
  193. color: #979595;
  194. padding-bottom: 30px;
  195. }
  196. ////////////////////////////-----SuratBA_A
  197. body {
  198. margin: 0;
  199. padding: 0;
  200. background-color: #FAFAFA;
  201. font: 12pt "Tahoma";
  202. }
  203. * {
  204. box-sizing: border-box;
  205. -moz-box-sizing: border-box;
  206. }
  207. .page {
  208. width: 21cm;
  209. min-height: 29.7cm;
  210. padding: 2cm;
  211. margin: 1cm auto;
  212. border: 1px #D3D3D3 solid;
  213. border-radius: 5px;
  214. background: white;
  215. box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  216. }
  217. .subpage {
  218. padding: 1cm;
  219. border: 5px red solid;
  220. height: 256mm;
  221. outline: 2cm #FFEAEA solid;
  222. }
  223. @page {
  224. size: A4;
  225. margin: 0;
  226. }
  227. @media print {
  228. body,
  229. page[size="A4"] {
  230. // margin: 0;
  231. box-shadow: 0;
  232. margin-bottom: 50px;
  233. }
  234. }
  235. .signature-style{
  236. border: 1px solid#c9c8c8;
  237. width: 380px;
  238. height: 200px;
  239. margin-left: auto;
  240. margin-right: auto;
  241. border-radius: 4px;
  242. }
  243. /////////////////////Coba pake flex wrap
  244. // #ttd {
  245. // width: 410px;
  246. // display: flex;
  247. // flex-wrap: wrap;
  248. // margin-left: auto;
  249. // margin-right: auto;
  250. // text-align: center;
  251. // }
  252. // #ttd-header {
  253. // width: 410px;
  254. // margin-left: auto;
  255. // margin-right: auto;
  256. // text-align: center;
  257. // }
  258. // .ttd-div{
  259. // width: 205px;
  260. // // height: 100px;
  261. // }
  262. // .sign-nama{
  263. // background-color: rgb(206, 206, 206);
  264. // text-align: center;
  265. // // width: 215px;
  266. // border: 1px solid#d9d6d6;
  267. // padding: 2px;
  268. // }
  269. // .sign-ttd{
  270. // width: 205px;
  271. // height: 80px;
  272. // border: 1px solid#d9d6d6;
  273. // padding: 5px;
  274. // }