From 37636d3ba7f0ddab5c048eb217b9e344bcfed354 Mon Sep 17 00:00:00 2001 From: clinton Date: Wed, 1 Oct 2008 19:38:09 +0000 Subject: [PATCH] Add print/screen differentiation in stylesheet Now printed output looks tolerable rather than being completely unstyled. Boxes with background colors have lighter backgrounds than on screen, the table of contents has a smaller typeface, and the footer content other than the timestamp is hidden. I am pretty sure this will break the site a bit more on IE, but fuck it IE is a piece of shit. --- default.css | 114 +++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 104 insertions(+), 10 deletions(-) diff --git a/default.css b/default.css index b76183a..47d2674 100644 --- a/default.css +++ b/default.css @@ -2,11 +2,18 @@ body { font-family: serif; - background-color: #D9D9D9; - color: #222222; max-width: 8in; } +@media screen +{ + body + { + background-color: #D9D9D9; + color: #222222; + } +} + .verse, .src, .image, blockquote { clear: right; /* Clear the contents box usually */ @@ -14,9 +21,6 @@ body .src { - color: #e3e3e3; - background-color: #444444; - margin-right: auto; margin-left: auto; width: 95%; @@ -27,6 +31,24 @@ body white-space: -moz-pre-wrap; /* Mozilla */ } +@media screen +{ + .src + { + color: #e3e3e3; + background-color: #444444; + } +} + +@media print +{ + .src + { + color: #535353; + background-color: #888888; + } +} + p { text-align: justify; @@ -34,8 +56,6 @@ p .verse { - background-color: #BBBBBB; - color: #111111; padding: 1em; border: 2px solid #999999; width: 60%; @@ -44,10 +64,17 @@ p font-size: smaller; } +@media screen +{ + .verse + { + background-color: #BBBBBB; + color: #111111; + } +} + blockquote { - background-color: #AAAAAA; - color: #111111; padding: 1em; border: 2px solid black; width: 80%; @@ -55,6 +82,24 @@ blockquote margin-left: auto; } +@media screen +{ + blockquote + { + background-color: #AAAAAA; + color: #111111; + } +} + +@media print +{ + blockquote + { + background-color: #DDDDDD; + color: #000000; + } +} + code { white-space: pre; @@ -110,17 +155,45 @@ div.contents dl margin-bottom: 0.2em; } +@media print +{ + div.contents + { + background-color: #CCCCCC; + } + + div.contents dt + { + font-size: 6pt; + } +} + /* Images */ table.image, p.image { border: 2px solid #222222; - background-color: #999999; width: auto; padding: 0.1em; margin-left: auto; margin-right: auto; } +@media screen +{ + table.image, p.image + { + background-color: #999999; + } +} + +@media print +{ + table.image, p.image + { + background-color: #CCCCCC; + } +} + /* Force spacing between image boxes */ table.image + table.image, p.image + p.image { @@ -168,6 +241,19 @@ img.latex-inline letter-spacing: 0.2em; } +@media print +{ + .rating-good + { + .color: #000000; + } + + .rating-bad + { + color: #CCCCCC; + } +} + /* Footer template */ p.cke-footer { @@ -186,4 +272,12 @@ p.cke-timestamp p.cke-buttons img { border: 0px; +} + +@media print +{ + p.cke-buttons, p.cke-footer + { + display: none; + } } \ No newline at end of file -- 2.20.1