Tweak print stylesheet

pull/684/merge
Thibaut Courouble 7 years ago
parent b681c80ed0
commit 0bd8289891

@ -12,6 +12,7 @@
*/ */
@import 'global/variables-dark', @import 'global/variables-dark',
'global/mixins',
'global/icons', 'global/icons',
'global/classes', 'global/classes',
'global/base'; 'global/base';

@ -12,6 +12,7 @@
*/ */
@import 'global/variables', @import 'global/variables',
'global/mixins',
'global/icons', 'global/icons',
'global/classes', 'global/classes',
'global/base'; 'global/base';
@ -98,7 +99,3 @@
'pages/webpack', 'pages/webpack',
'pages/yard', 'pages/yard',
'pages/yii'; 'pages/yii';
html { // specificity hack
@import 'global/print';
}

@ -4,6 +4,9 @@ html {
background: $documentBackground; background: $documentBackground;
@media #{$mediumScreen} { font-size: 93.75%; } @media #{$mediumScreen} { font-size: 93.75%; }
@include print { background: none; }
@import 'global/print';
} }
body { body {

@ -2,19 +2,6 @@
// Utilities // Utilities
// //
/* Usage:
*
* @include print {
* // print styles here
* }
*
*/
@mixin print {
@media print {
@content;
}
}
%border-box { %border-box {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;

@ -0,0 +1,9 @@
//
// Mixins
//
@mixin print {
@media print {
@content;
}
}

@ -1,79 +1,51 @@
// Style overrides for printing
@include print { @include print {
._header, ._sidebar, ._path, ._notif, ._toc, ._pre-clip, ._notice, ._links {
._header, ._sidebar, ._path, ._notif, ._toc, ._pre-clip, ._notice {
display: none !important; display: none !important;
} }
// make the docs fill the page and scroll the <body> instead of ._container body, ._app, ._container, ._content {
body {
height: initial;
&::after {
content: '';
clear: both;
}
}
._app {
height: initial;
}
._container {
margin: 0; margin: 0;
padding: 0; padding: 0;
height: initial; height: initial;
background: none;
._content { &:after {
margin: 0; content: '';
clear: both;
} }
} }
// Hide the scrollbars
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
} }
// empty the boxes. %external-link:after {
%box, display: none;
%heading-box {
background: transparent;
}
%heading-box {
border-radius: 0;
border: {
top: none;
left: none;
right: none;
}
} }
._attribution-p {
// Underline links, put the destination after the link text background: none;
%external-link { border: 2px solid $boxBorder;
text-decoration: underline;
&::after {
content: ' (' attr(href) ')';
background-image: none;
display: inline;
margin: 0;
}
} }
// Link back to DevDocs ._attribution:last-child:after {
._attribution-p { content: 'Exported from DevDocs — https://devdocs.io';
background: transparent; display: block;
border: 2px solid $labelBackground; margin-top: 1rem;
font-weight: $bolderFontWeight;
}
&:after { ._attribution {
content: 'Exported from DevDocs (https://devdocs.io)'; page-break-inside: avoid;
font-style: italic;
} }
h1, h2, h3, h4, h5, h6 {
page-break-inside: avoid;
page-break-after: avoid;
} }
// Fix page breaks
pre { pre {
page-break-before: avoid; page-break-before: avoid;
}
pre {
orphans: 5; orphans: 5;
widows: 5; widows: 5;
} }

Loading…
Cancel
Save