print.css 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  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. font: 13pt var(--font-base, Georgia, "Times New Roman", Times, serif);
  31. line-height: 1.3;
  32. background: #fff !important;
  33. color: #000;
  34. }
  35. h1 {
  36. font-size: 24pt;
  37. }
  38. h2,
  39. h3,
  40. h4,
  41. .has-regular-font-size,
  42. .has-large-font-size,
  43. h2.author-title,
  44. p.author-bio,
  45. .comments-title, h3 {
  46. font-size: 14pt;
  47. margin-top: 25px;
  48. }
  49. /* Page breaks */
  50. a {
  51. page-break-inside: avoid;
  52. }
  53. blockquote {
  54. page-break-inside: avoid;
  55. }
  56. h1,
  57. h2,
  58. h3,
  59. h4,
  60. h5,
  61. h6 {
  62. page-break-after: avoid;
  63. page-break-inside: avoid;
  64. }
  65. img {
  66. page-break-inside: avoid;
  67. page-break-after: avoid;
  68. }
  69. table, pre {
  70. page-break-inside: avoid;
  71. }
  72. ul, ol, dl {
  73. page-break-before: avoid;
  74. }
  75. /* Links */
  76. a:link, a:visited, a {
  77. background: transparent;
  78. font-weight: bold;
  79. text-decoration: underline;
  80. text-align: left;
  81. }
  82. a {
  83. page-break-inside: avoid;
  84. }
  85. a[href^=http]:after {
  86. content: " < " attr(href) "> ";
  87. }
  88. a:after > img {
  89. content: "";
  90. }
  91. article a[href^="#"]:after {
  92. content: "";
  93. }
  94. a:not(:local-link):after {
  95. content: " < " attr(href) "> ";
  96. }
  97. /* Visibility */
  98. .main-navigation,
  99. .site-title + .main-navigation,
  100. .social-navigation,
  101. .site-branding-container:before,
  102. .entry .entry-title:before,
  103. .entry-footer,
  104. .author-description:before,
  105. .post-navigation,
  106. .widget-area,
  107. .comment-form-flex,
  108. .comment-reply,
  109. .comment .comment-metadata .edit-link {
  110. display: none;
  111. }
  112. .entry .entry-content .wp-block-button .wp-block-button__link,
  113. .entry .entry-content .button {
  114. color: #000;
  115. background: none;
  116. }
  117. /* Site Header (With Featured Image) */
  118. .site-header.featured-image {
  119. min-height: 0;
  120. }
  121. .site-header.featured-image .main-navigation a,
  122. .site-header.featured-image .main-navigation a + svg,
  123. .site-header.featured-image .social-navigation a,
  124. .site-header.featured-image .site-title a,
  125. .site-header.featured-image .site-featured-image a,
  126. .site-header.featured-image .site-branding .site-title,
  127. .site-header.featured-image .site-branding .site-description,
  128. .site-header.featured-image .main-navigation a:after,
  129. .site-header.featured-image .main-navigation .main-menu > li.menu-item-has-children:after,
  130. .site-header.featured-image .main-navigation li,
  131. .site-header.featured-image .social-navigation li,
  132. .site-header.featured-image .entry-meta,
  133. .site-header.featured-image .entry-title,
  134. .site-header.featured-image#masthead .site-title a {
  135. color: #000;
  136. text-shadow: none;
  137. }
  138. .site-header.featured-image .site-featured-image .entry-header,
  139. .site-header.featured-image .site-branding-container {
  140. margin-top: 0;
  141. margin-bottom: 0;
  142. }
  143. .site-header.featured-image .site-featured-image .post-thumbnail img {
  144. position: relative;
  145. height: initial;
  146. width: initial;
  147. object-fit: none;
  148. min-width: 0;
  149. min-height: 0;
  150. max-width: 100%;
  151. margin-top: 1rem;
  152. }
  153. /* Remove image filters from featured image */
  154. .image-filters-enabled *:after {
  155. display: none !important;
  156. }
  157. .image-filters-enabled .site-header.featured-image .site-featured-image:before {
  158. display: none;
  159. }
  160. .image-filters-enabled .site-header.featured-image .site-featured-image .post-thumbnail img {
  161. filter: none;
  162. }
  163. }