From 25ad8adc68600ba9e77cbd7255a104c004126e21 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 8 Aug 2012 01:14:12 -0400 Subject: themes are now available as separate css files under css/theme/, old theme option in config is no longer supported (closes #104) --- css/print/paper.css | 170 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 170 insertions(+) create mode 100644 css/print/paper.css (limited to 'css/print/paper.css') diff --git a/css/print/paper.css b/css/print/paper.css new file mode 100644 index 0000000..0ac5597 --- /dev/null +++ b/css/print/paper.css @@ -0,0 +1,170 @@ +/* Default Print Stylesheet Template + by Rob Glazebrook of CSSnewbie.com + Last Updated: June 4, 2008 + + Feel free (nay, compelled) to edit, append, and + manipulate this file as you see fit. */ + + +/* SECTION 1: Set default width, margin, float, and + background. This prevents elements from extending + beyond the edge of the printed page, and prevents + unnecessary background images from printing */ +body { + background: #fff; + font-size: 13pt; + width: auto; + height: auto; + border: 0; + margin: 0 5%; + padding: 0; + float: none !important; + overflow: visible; +} +html { + background: #fff; + width: auto; + height: auto; + overflow: visible; +} + +/* SECTION 2: Remove any elements not needed in print. + This would include navigation, ads, sidebars, etc. */ +.nestedarrow, +.controls a, +.reveal .progress, +.reveal.overview, +.fork-reveal, +.share-reveal, +.state-background { + display:none; +} + +/* SECTION 3: Set body font face, size, and color. + Consider using a serif font for readability. */ +body, p, td, li, div, a { + font-size: 13pt; + font-family: Georgia, "Times New Roman", Times, serif !important; + color: #000; +} + +/* SECTION 4: Set heading font face, sizes, and color. + Diffrentiate your headings from your body text. + Perhaps use a large sans-serif for distinction. */ +h1,h2,h3,h4,h5,h6 { + color: #000!important; + height: auto; + line-height: normal; + font-family: Georgia, "Times New Roman", Times, serif !important; + text-shadow: 0 0 0 #000 !important; + text-align: left; + letter-spacing: normal; +} +/* Need to reduce the size of the fonts for printing */ +h1 { font-size: 26pt !important; } +h2 { font-size: 22pt !important; } +h3 { font-size: 20pt !important; } +h4 { font-size: 20pt !important; font-variant: small-caps; } +h5 { font-size: 19pt !important; } +h6 { font-size: 18pt !important; font-style: italic; } + +/* SECTION 5: Make hyperlinks more usable. + Ensure links are underlined, and consider appending + the URL to the end of the link for usability. */ +a:link, +a:visited { + color: #000 !important; + font-weight: bold; + text-decoration: underline; +} +.reveal a:link:after, +.reveal a:visited:after { + content: " (" attr(href) ") "; + color: #222 !important; + font-size: 90%; +} + + +/* SECTION 6: more reveal.js specific additions by @skypanther */ +ul, ol, div, p { + visibility: visible; + position: static; + width: auto; + height: auto; + display: block; + overflow: visible; + margin: auto; + text-align: left !important; +} +.reveal .slides { + position: static; + width: auto; + height: auto; + + left: auto; + top: auto; + margin-left: auto; + margin-top: auto; + padding: auto; + + overflow: visible; + display: block; + + text-align: center; + -webkit-perspective: none; + -moz-perspective: none; + -ms-perspective: none; + perspective: none; + + -webkit-perspective-origin: 50% 50%; /* there isn't a none/auto value but 50-50 is the default */ + -moz-perspective-origin: 50% 50%; + -ms-perspective-origin: 50% 50%; + perspective-origin: 50% 50%; +} +.reveal .slides>section, .reveal .slides>section>section, +.reveal .slides>section.past, .reveal .slides>section.future, +.reveal.linear .slides>section, .reveal.linear .slides>section>section, +.reveal.linear .slides>section.past, .reveal.linear .slides>section.future { + + visibility: visible; + position: static; + width: 90%; + height: auto; + display: block; + overflow: visible; + + left: 0%; + top: 0%; + margin-left: 0px; + margin-top: 0px; + padding: 20px 0px; + + opacity: 1; + + -webkit-transform-style: flat; + -moz-transform-style: flat; + -ms-transform-style: flat; + transform-style: flat; + + -webkit-transform: none; + -moz-transform: none; + -ms-transform: none; + transform: none; +} +.reveal section { + page-break-after: always !important; + display: block !important; +} +.reveal section.stack { + page-break-after: avoid !important; +} +.reveal section .fragment { + opacity: 1 !important; +} +.reveal section img { + display: block; + margin: 15px 0px; + background: rgba(255,255,255,1); + border: 1px solid #666; + box-shadow: none; +} \ No newline at end of file -- cgit v1.2.3 From af2a8b053d27ed5c97256d29ab4f06a6bcece6b7 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 28 Oct 2012 19:32:24 -0400 Subject: include theme background in printed pdfs (#217), fix empty white pages in regular print (#215) --- css/print/paper.css | 57 +++++++++++++++++++++++-------------------- css/print/pdf.css | 53 +++++++++++++++++++--------------------- css/theme/beige.css | 1 + css/theme/default.css | 1 + css/theme/serif.css | 1 + css/theme/simple.css | 1 + css/theme/sky.css | 1 + css/theme/template/theme.scss | 1 + 8 files changed, 61 insertions(+), 55 deletions(-) (limited to 'css/print/paper.css') diff --git a/css/print/paper.css b/css/print/paper.css index 0ac5597..61fa0a9 100644 --- a/css/print/paper.css +++ b/css/print/paper.css @@ -31,19 +31,19 @@ html { /* SECTION 2: Remove any elements not needed in print. This would include navigation, ads, sidebars, etc. */ .nestedarrow, -.controls a, +.controls, .reveal .progress, .reveal.overview, .fork-reveal, .share-reveal, .state-background { - display:none; + display: none !important; } /* SECTION 3: Set body font face, size, and color. Consider using a serif font for readability. */ body, p, td, li, div, a { - font-size: 13pt; + font-size: 16pt!important; font-family: Georgia, "Times New Roman", Times, serif !important; color: #000; } @@ -77,12 +77,14 @@ a:visited { font-weight: bold; text-decoration: underline; } +/* .reveal a:link:after, .reveal a:visited:after { content: " (" attr(href) ") "; color: #222 !important; font-size: 90%; } +*/ /* SECTION 6: more reveal.js specific additions by @skypanther */ @@ -121,35 +123,33 @@ ul, ol, div, p { -ms-perspective-origin: 50% 50%; perspective-origin: 50% 50%; } -.reveal .slides>section, .reveal .slides>section>section, -.reveal .slides>section.past, .reveal .slides>section.future, -.reveal.linear .slides>section, .reveal.linear .slides>section>section, -.reveal.linear .slides>section.past, .reveal.linear .slides>section.future { +.reveal .slides>section, +.reveal .slides>section>section { - visibility: visible; - position: static; - width: 90%; - height: auto; - display: block; - overflow: visible; + visibility: visible !important; + position: static !important; + width: 90% !important; + height: auto !important; + display: block !important; + overflow: visible !important; - left: 0%; - top: 0%; - margin-left: 0px; - margin-top: 0px; - padding: 20px 0px; + left: 0% !important; + top: 0% !important; + margin-left: 0px !important; + margin-top: 0px !important; + padding: 20px 0px !important; - opacity: 1; + opacity: 1 !important; - -webkit-transform-style: flat; - -moz-transform-style: flat; - -ms-transform-style: flat; - transform-style: flat; + -webkit-transform-style: flat !important; + -moz-transform-style: flat !important; + -ms-transform-style: flat !important; + transform-style: flat !important; - -webkit-transform: none; - -moz-transform: none; - -ms-transform: none; - transform: none; + -webkit-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + transform: none !important; } .reveal section { page-break-after: always !important; @@ -161,6 +161,9 @@ ul, ol, div, p { .reveal section .fragment { opacity: 1 !important; } +.reveal section:last-of-type { + page-break-after: avoid !important; +} .reveal section img { display: block; margin: 15px 0px; diff --git a/css/print/pdf.css b/css/print/pdf.css index ec03eda..7c1a496 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -23,7 +23,7 @@ body { padding: 0; float: none !important; overflow: visible; - background: #333; + background-image: none; } html { @@ -35,13 +35,13 @@ html { /* SECTION 2: Remove any elements not needed in print. This would include navigation, ads, sidebars, etc. */ .nestedarrow, -.controls a, +.controls, .reveal .progress, .reveal.overview, .fork-reveal, .share-reveal, .state-background { - display:none; + display: none !important; } /* SECTION 3: Set body font face, size, and color. @@ -102,36 +102,33 @@ ul, ol, div, p { -ms-perspective-origin: 50% 50%; perspective-origin: 50% 50%; } -.reveal .slides>section, .reveal .slides>section>section, -.reveal .slides>section.past, .reveal .slides>section.future, -.reveal.linear .slides>section, .reveal.linear .slides>section>section, -.reveal.linear .slides>section.past, .reveal.linear .slides>section.future { +.reveal .slides>section, .reveal .slides>section>section { - visibility: visible; - position: static; - width: 100%; - height: auto; - min-height: initial; - display: block; - overflow: visible; + visibility: visible !important; + position: static !important; + width: 100% !important; + height: auto !important; + min-height: initial !important; + display: block !important; + overflow: visible !important; - left: 0%; - top: 0%; - margin-left: 0px; - margin-top: 50px; - padding: 20px 0px; + left: 0% !important; + top: 0% !important; + margin-left: 0px !important; + margin-top: 50px !important; + padding: 20px 0px !important; - opacity: 1; + opacity: 1 !important; - -webkit-transform-style: flat; - -moz-transform-style: flat; - -ms-transform-style: flat; - transform-style: flat; + -webkit-transform-style: flat !important; + -moz-transform-style: flat !important; + -ms-transform-style: flat !important; + transform-style: flat !important; - -webkit-transform: none; - -moz-transform: none; - -ms-transform: none; - transform: none; + -webkit-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + transform: none !important; } .reveal section { page-break-after: always !important; diff --git a/css/theme/beige.css b/css/theme/beige.css index fe0e460..727be44 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -23,6 +23,7 @@ body { background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background-color: #f7f3de; } .reveal { diff --git a/css/theme/default.css b/css/theme/default.css index 563e4d9..c8f2eff 100644 --- a/css/theme/default.css +++ b/css/theme/default.css @@ -23,6 +23,7 @@ body { background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background-color: #2b2b2b; } .reveal { diff --git a/css/theme/serif.css b/css/theme/serif.css index 3957b5d..86710c6 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -10,6 +10,7 @@ *********************************************/ body { background: #f0f1eb; + background-color: #f0f1eb; } .reveal { diff --git a/css/theme/simple.css b/css/theme/simple.css index 926bbc5..848ca93 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -12,6 +12,7 @@ *********************************************/ body { background: white; + background-color: white; } .reveal { diff --git a/css/theme/sky.css b/css/theme/sky.css index 6618c0d..a6d94eb 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -16,6 +16,7 @@ body { background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background-color: #f7fbfc; } .reveal { diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index 600c8e3..c53df39 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -6,6 +6,7 @@ body { @include bodyBackground(); + background-color: $backgroundColor; } .reveal { -- cgit v1.2.3 From 2834a6bc897d6ded967773cfa3a6bdf3cbc496d3 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sat, 10 Nov 2012 18:15:05 -0500 Subject: ensure fragments are visible in print styles, fix page-break error in paper print sheet --- css/print/paper.css | 9 ++++++--- css/print/pdf.css | 10 ++++++---- 2 files changed, 12 insertions(+), 7 deletions(-) (limited to 'css/print/paper.css') diff --git a/css/print/paper.css b/css/print/paper.css index 61fa0a9..ec8a8bd 100644 --- a/css/print/paper.css +++ b/css/print/paper.css @@ -155,11 +155,14 @@ ul, ol, div, p { page-break-after: always !important; display: block !important; } -.reveal section.stack { - page-break-after: avoid !important; -} .reveal section .fragment { opacity: 1 !important; + visibility: visible !important; + + -webkit-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + transform: none !important; } .reveal section:last-of-type { page-break-after: avoid !important; diff --git a/css/print/pdf.css b/css/print/pdf.css index 7c1a496..02af691 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -141,6 +141,12 @@ ul, ol, div, p { } .reveal section .fragment { opacity: 1 !important; + visibility: visible !important; + + -webkit-transform: none !important; + -moz-transform: none !important; + -ms-transform: none !important; + transform: none !important; } .reveal img { box-shadow: none; @@ -153,7 +159,3 @@ ul, ol, div, p { .reveal small a { font-size: 16pt !important; } - -pre { - font-size: 9pt !important; -} -- cgit v1.2.3