print.css 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. @charset "UTF-8";
  2. /*
  3. Theme Name: Brompton
  4. Adding print support. The print styles are based on the the great work of
  5. Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/.
  6. */
  7. /*--------------------------------------------------------------
  8. >>> TABLE OF CONTENTS:
  9. ----------------------------------------------------------------
  10. # Margins
  11. # Typography÷
  12. # Page breaks
  13. # Links
  14. # Visibility
  15. --------------------------------------------------------------*/
  16. @media print {
  17. /* Margins */
  18. @page {
  19. margin: 2cm;
  20. }
  21. .entry {
  22. margin-top: 1em;
  23. }
  24. .entry .entry-header, .site-footer .site-info {
  25. margin: 0;
  26. }
  27. /* Fonts */
  28. body {
  29. font: 13pt Georgia, "Times New Roman", Times, serif;
  30. line-height: 1.3;
  31. background: #fff !important;
  32. color: #000;
  33. }
  34. h1 {
  35. font-size: 24pt;
  36. }
  37. h2,
  38. h3,
  39. h4,
  40. .has-regular-font-size,
  41. .has-large-font-size,
  42. h2.author-title,
  43. p.author-bio,
  44. .comments-title, h3 {
  45. font-size: 14pt;
  46. margin-top: 25px;
  47. }
  48. /* Page breaks */
  49. a {
  50. page-break-inside: avoid;
  51. }
  52. blockquote {
  53. page-break-inside: avoid;
  54. }
  55. h1,
  56. h2,
  57. h3,
  58. h4,
  59. h5,
  60. h6 {
  61. page-break-after: avoid;
  62. page-break-inside: avoid;
  63. }
  64. img {
  65. page-break-inside: avoid;
  66. page-break-after: avoid;
  67. }
  68. table, pre {
  69. page-break-inside: avoid;
  70. }
  71. ul, ol, dl {
  72. page-break-before: avoid;
  73. }
  74. /* Links */
  75. a:link, a:visited, a {
  76. background: transparent;
  77. font-weight: bold;
  78. text-decoration: underline;
  79. text-align: left;
  80. }
  81. a {
  82. page-break-inside: avoid;
  83. }
  84. a[href^=http]:after {
  85. content: " < " attr(href) "> ";
  86. }
  87. a:after > img {
  88. content: "";
  89. }
  90. article a[href^="#"]:after {
  91. content: "";
  92. }
  93. a:not(:local-link):after {
  94. content: " < " attr(href) "> ";
  95. }
  96. /* Visibility */
  97. .main-navigation,
  98. .site-title + .main-navigation,
  99. .social-navigation,
  100. .site-branding-container:before,
  101. .entry .entry-title:before,
  102. .entry-footer,
  103. .author-description:before,
  104. .post-navigation,
  105. .widget-area,
  106. .comment-form-flex,
  107. .comment-reply,
  108. .comment .comment-metadata .edit-link {
  109. display: none;
  110. }
  111. .entry .entry-content .wp-block-button .wp-block-button__link,
  112. .entry .entry-content .button {
  113. color: #000;
  114. background: none;
  115. }
  116. /* Site Header (With Featured Image) */
  117. .site-header.featured-image {
  118. min-height: 0;
  119. }
  120. .site-header.featured-image .main-navigation a,
  121. .site-header.featured-image .main-navigation a + svg,
  122. .site-header.featured-image .social-navigation a,
  123. .site-header.featured-image .site-title a,
  124. .site-header.featured-image .site-featured-image a,
  125. .site-header.featured-image .site-branding .site-title,
  126. .site-header.featured-image .site-branding .site-description,
  127. .site-header.featured-image .main-navigation a:after,
  128. .site-header.featured-image .main-navigation .main-menu > li.menu-item-has-children:after,
  129. .site-header.featured-image .main-navigation li,
  130. .site-header.featured-image .social-navigation li,
  131. .site-header.featured-image .entry-meta,
  132. .site-header.featured-image .entry-title,
  133. .site-header.featured-image#masthead .site-title a {
  134. color: #000;
  135. text-shadow: none;
  136. }
  137. .site-header.featured-image .site-featured-image .entry-header,
  138. .site-header.featured-image .site-branding-container {
  139. margin-top: 0;
  140. margin-bottom: 0;
  141. }
  142. .site-header.featured-image .site-featured-image .post-thumbnail img {
  143. position: relative;
  144. height: initial;
  145. width: initial;
  146. object-fit: none;
  147. min-width: 0;
  148. min-height: 0;
  149. max-width: 100%;
  150. margin-top: 1rem;
  151. }
  152. /* Remove image filters from featured image */
  153. .image-filters-enabled *:after {
  154. display: none !important;
  155. }
  156. .image-filters-enabled .site-header.featured-image .site-featured-image:before {
  157. display: none;
  158. }
  159. .image-filters-enabled .site-header.featured-image .site-featured-image .post-thumbnail img {
  160. filter: none;
  161. }
  162. }