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.
body
{
font-family: serif;
body
{
font-family: serif;
- background-color: #D9D9D9;
- color: #222222;
+@media screen
+{
+ body
+ {
+ background-color: #D9D9D9;
+ color: #222222;
+ }
+}
+
.verse, .src, .image, blockquote
{
clear: right; /* Clear the contents box usually */
.verse, .src, .image, blockquote
{
clear: right; /* Clear the contents box usually */
- color: #e3e3e3;
- background-color: #444444;
-
margin-right: auto;
margin-left: auto;
width: 95%;
margin-right: auto;
margin-left: auto;
width: 95%;
white-space: -moz-pre-wrap; /* Mozilla */
}
white-space: -moz-pre-wrap; /* Mozilla */
}
+@media screen
+{
+ .src
+ {
+ color: #e3e3e3;
+ background-color: #444444;
+ }
+}
+
+@media print
+{
+ .src
+ {
+ color: #535353;
+ background-color: #888888;
+ }
+}
+
- background-color: #BBBBBB;
- color: #111111;
padding: 1em;
border: 2px solid #999999;
width: 60%;
padding: 1em;
border: 2px solid #999999;
width: 60%;
+@media screen
+{
+ .verse
+ {
+ background-color: #BBBBBB;
+ color: #111111;
+ }
+}
+
- background-color: #AAAAAA;
- color: #111111;
padding: 1em;
border: 2px solid black;
width: 80%;
padding: 1em;
border: 2px solid black;
width: 80%;
+@media screen
+{
+ blockquote
+ {
+ background-color: #AAAAAA;
+ color: #111111;
+ }
+}
+
+@media print
+{
+ blockquote
+ {
+ background-color: #DDDDDD;
+ color: #000000;
+ }
+}
+
+@media print
+{
+ div.contents
+ {
+ background-color: #CCCCCC;
+ }
+
+ div.contents dt
+ {
+ font-size: 6pt;
+ }
+}
+
/* Images */
table.image, p.image
{
border: 2px solid #222222;
/* Images */
table.image, p.image
{
border: 2px solid #222222;
- background-color: #999999;
width: auto;
padding: 0.1em;
margin-left: auto;
margin-right: auto;
}
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
{
/* Force spacing between image boxes */
table.image + table.image, p.image + p.image
{
+@media print
+{
+ .rating-good
+ {
+ .color: #000000;
+ }
+
+ .rating-bad
+ {
+ color: #CCCCCC;
+ }
+}
+
/* Footer template */
p.cke-footer
{
/* Footer template */
p.cke-footer
{
p.cke-buttons img
{
border: 0px;
p.cke-buttons img
{
border: 0px;
+}
+
+@media print
+{
+ p.cke-buttons, p.cke-footer
+ {
+ display: none;
+ }
}
\ No newline at end of file
}
\ No newline at end of file