Skip to content

Instantly share code, notes, and snippets.

@davidhund
Created April 14, 2017 08:52
Show Gist options
  • Save davidhund/0cf7dd437402c5a1dcb7bd701141a4a7 to your computer and use it in GitHub Desktop.
Save davidhund/0cf7dd437402c5a1dcb7bd701141a4a7 to your computer and use it in GitHub Desktop.
An example (starter) Print stylesheet
/**
* = PRINT styles
*
* - Imported in global.css (http://www.phpied.com/delay-loading-your-print-css/)
* - Taken straight from: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css#L197
*
* @TODO:
* - Add to this?
*
* ========================================================================= */
/* stylelint-disable declaration-no-important */
@media print {
*,
*:before,
*:after,
*:first-letter,
p:first-line,
div:first-line,
blockquote:first-line,
li:first-line {
background: transparent !important;
color: #000 !important; /* Black prints faster:
http://www.sanbeiji.com/archives/953 */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
/*
* Don't show links that are fragment identifiers,
* or use the `javascript:` pseudo protocol
*/
a[href^="#"]:after,
a[href^="javascript:"]:after { content: ""; }
pre { white-space: pre-wrap !important; }
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
/*
* Printing Tables:
* http://css-discuss.incutio.com/wiki/Printing_Tables
*/
thead { display: table-header-group; }
tr,
img { page-break-inside: avoid; }
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 { page-break-after: avoid; }
/**
* HIDE certain elements completely
*/
.site-navigation {
display: none;
}
/**
* Or go Nuclear and use this:
* from: https://medium.com/@matuzo/i-totally-forgot-about-print-style-sheets-f1e6604cfd6#.9de6r4yhr
*
* body > *:not(main) { display: none; }
*
*/
}
/* stylelint-enable */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment