dirk
/
why-cant-we-deploy-today
1
0
Fork 0
Code Releases Activity

fix non-pdf printing (closes #881)

This commit is contained in:
Hakim El Hattab 2014-04-26 19:16:10 +02:00
parent b019604531
commit ae962d729b
3 changed files with 174 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

153
css/print/paper.css
View File

@ -6,52 +6,54 @@
manipulate this file as you see fit. */ manipulate this file as you see fit. */
/* SECTION 1: Set default width, margin, float, and @media print {
/* SECTION 1: Set default width, margin, float, and
background. This prevents elements from extending background. This prevents elements from extending
beyond the edge of the printed page, and prevents beyond the edge of the printed page, and prevents
unnecessary background images from printing */ unnecessary background images from printing */
body { html {
background: #fff; background: #fff;
font-size: 13pt; width: auto;
height: auto;
overflow: visible;
}
body {
background: #fff;
font-size: 28pt;
width: auto; width: auto;
height: auto; height: auto;
border: 0; border: 0;
margin: 0 5%; margin: 0 5%;
padding: 0; padding: 0;
overflow: visible;
float: none !important; float: none !important;
overflow: visible; }
}
html {
background: #fff;
width: auto;
height: auto;
overflow: visible;
}
/* SECTION 2: Remove any elements not needed in print. /* SECTION 2: Remove any elements not needed in print.
This would include navigation, ads, sidebars, etc. */ This would include navigation, ads, sidebars, etc. */
.nestedarrow, .nestedarrow,
.controls, .controls,
.reveal .progress, .reveal .progress,
.reveal.overview, .reveal.overview,
.fork-reveal, .fork-reveal,
.share-reveal, .share-reveal,
.state-background { .state-background {
display: none !important; display: none !important;
} }
/* SECTION 3: Set body font face, size, and color. /* SECTION 3: Set body font face, size, and color.
Consider using a serif font for readability. */ Consider using a serif font for readability. */
body, p, td, li, div, a { body, p, td, li, div {
font-size: 16pt!important; font-size: 28pt!important;
font-family: Georgia, "Times New Roman", Times, serif !important; font-family: Georgia, "Times New Roman", Times, serif !important;
color: #000; color: #000;
} }
/* SECTION 4: Set heading font face, sizes, and color. /* SECTION 4: Set heading font face, sizes, and color.
Differentiate your headings from your body text. Differentiate your headings from your body text.
Perhaps use a large sans-serif for distinction. */ Perhaps use a large sans-serif for distinction. */
h1,h2,h3,h4,h5,h6 { h1,h2,h3,h4,h5,h6 {
color: #000!important; color: #000!important;
height: auto; height: auto;
line-height: normal; line-height: normal;
@ -59,36 +61,36 @@ h1,h2,h3,h4,h5,h6 {
text-shadow: 0 0 0 #000 !important; text-shadow: 0 0 0 #000 !important;
text-align: left; text-align: left;
letter-spacing: normal; letter-spacing: normal;
} }
/* Need to reduce the size of the fonts for printing */ /* Need to reduce the size of the fonts for printing */
h1 { font-size: 26pt !important; } h1 { font-size: 36pt !important; }
h2 { font-size: 22pt !important; } h2 { font-size: 32pt !important; }
h3 { font-size: 20pt !important; } h3 { font-size: 30pt !important; }
h4 { font-size: 20pt !important; font-variant: small-caps; } h4 { font-size: 30pt !important; font-variant: small-caps; }
h5 { font-size: 19pt !important; } h5 { font-size: 29pt !important; }
h6 { font-size: 18pt !important; font-style: italic; } h6 { font-size: 28pt !important; font-style: italic; }
/* SECTION 5: Make hyperlinks more usable. /* SECTION 5: Make hyperlinks more usable.
Ensure links are underlined, and consider appending Ensure links are underlined, and consider appending
the URL to the end of the link for usability. */ the URL to the end of the link for usability. */
a:link, a:link,
a:visited { a:visited {
color: #000 !important; color: #000 !important;
font-weight: bold; font-weight: bold;
text-decoration: underline; text-decoration: underline;
} }
/* /*
.reveal a:link:after, .reveal a:link:after,
.reveal a:visited:after { .reveal a:visited:after {
content: " (" attr(href) ") "; content: " (" attr(href) ") ";
color: #222 !important; color: #222 !important;
font-size: 90%; font-size: 90%;
} }
*/ */
/* SECTION 6: more reveal.js specific additions by @skypanther */ /* SECTION 6: more reveal.js specific additions by @skypanther */
ul, ol, div, p { ul, ol, div, p {
visibility: visible; visibility: visible;
position: static; position: static;
width: auto; width: auto;
@ -97,17 +99,26 @@ ul, ol, div, p {
overflow: visible; overflow: visible;
margin: auto; margin: auto;
text-align: left !important; text-align: left !important;
} }
.reveal .slides { .reveal pre,
.reveal table {
margin-left: 0;
margin-right: 0;
}
.reveal pre code {
padding: 20px;
border: 1px solid #ddd;
}
.reveal .slides {
position: static; position: static;
width: auto; width: auto;
height: auto; height: auto;
left: auto; left: 0;
top: auto; top: 0;
margin-left: auto; margin-left: 0;
margin-top: auto; margin-top: 0;
padding: auto; padding: 0;
overflow: visible; overflow: visible;
display: block; display: block;
@ -122,10 +133,9 @@ ul, ol, div, p {
-moz-perspective-origin: 50% 50%; -moz-perspective-origin: 50% 50%;
-ms-perspective-origin: 50% 50%; -ms-perspective-origin: 50% 50%;
perspective-origin: 50% 50%; perspective-origin: 50% 50%;
} }
.reveal .slides>section, .reveal .slides>section,
.reveal .slides>section>section { .reveal .slides>section>section {
visibility: visible !important; visibility: visible !important;
position: static !important; position: static !important;
width: 90% !important; width: 90% !important;
@ -133,10 +143,10 @@ ul, ol, div, p {
display: block !important; display: block !important;
overflow: visible !important; overflow: visible !important;
left: 0% !important; left: 0 !important;
top: 0% !important; top: 0 !important;
margin-left: 0px !important; margin-left: 0 !important;
margin-top: 0px !important; margin-top: 0 !important;
padding: 20px 0px !important; padding: 20px 0px !important;
opacity: 1 !important; opacity: 1 !important;
@ -150,12 +160,11 @@ ul, ol, div, p {
-moz-transform: none !important; -moz-transform: none !important;
-ms-transform: none !important; -ms-transform: none !important;
transform: none !important; transform: none !important;
} }
.reveal section { .reveal section {
page-break-after: always !important; page-break-after: always !important;
display: block !important; }
} .reveal section .fragment {
.reveal section .fragment {
opacity: 1 !important; opacity: 1 !important;
visibility: visible !important; visibility: visible !important;
@ -163,14 +172,20 @@ ul, ol, div, p {
-moz-transform: none !important; -moz-transform: none !important;
-ms-transform: none !important; -ms-transform: none !important;
transform: none !important; transform: none !important;
} }
.reveal section:last-of-type { .reveal section:last-of-type {
page-break-after: avoid !important; page-break-after: avoid !important;
} }
.reveal section img { .reveal section img {
display: block; display: block;
margin: 15px 0px; margin: 15px 0px;
background: rgba(255,255,255,1); background: rgba(255,255,255,1);
border: 1px solid #666; border: 1px solid #666;
box-shadow: none; box-shadow: none;
}
.reveal section small {
font-size: 0.8em;
}
} }

6
index.html
View File

@ -20,15 +20,13 @@
<!-- For syntax highlighting --> <!-- For syntax highlighting -->
<link rel="stylesheet" href="lib/css/zenburn.css"> <link rel="stylesheet" href="lib/css/zenburn.css">
<!-- If the query includes 'print-pdf', include the PDF print sheet --> <!-- Include the appropriate print stylesheet -->
<script> <script>
if( window.location.search.match( /print-pdf/gi ) ) {
var link = document.createElement( 'link' ); var link = document.createElement( 'link' );
link.rel = 'stylesheet'; link.rel = 'stylesheet';
link.type = 'text/css'; link.type = 'text/css';
link.href = 'css/print/pdf.css'; link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link ); document.getElementsByTagName( 'head' )[0].appendChild( link );
}
</script> </script>
<!--[if lt IE 9]> <!--[if lt IE 9]>

4
js/reveal.js
View File

@ -2014,7 +2014,7 @@ var Reveal = (function(){
// Show the horizontal slide if it's within the view distance // Show the horizontal slide if it's within the view distance
if( distanceX < viewDistance ) { if( distanceX < viewDistance ) {
horizontalSlide.style.display = 'block'; horizontalSlide.style.display = '';
loadSlide( horizontalSlide ); loadSlide( horizontalSlide );
} }
else { else {
@ -2031,7 +2031,7 @@ var Reveal = (function(){
distanceY = x === indexh ? Math.abs( indexv - y ) : Math.abs( y - oy ); distanceY = x === indexh ? Math.abs( indexv - y ) : Math.abs( y - oy );
if( distanceX + distanceY < viewDistance ) { if( distanceX + distanceY < viewDistance ) {
verticalSlide.style.display = 'block'; verticalSlide.style.display = '';
loadSlide( verticalSlide ); loadSlide( verticalSlide );
} }
else { else {