From 8256de476c15c3e667824a2b59630f287726fb0e Mon Sep 17 00:00:00 2001
From: Giorgos Keramidas <keramida@FreeBSD.org>
Date: Fri, 21 Nov 2008 07:28:34 +0000
Subject: [PATCH] Tweak a bit the default stylesheet:

* Remove background color from <screen> elements.  It makes them stand
  out too much.  Some pages have many <screen> elements, listing shell
  commands and their output.  Having a dark background seems a bit too
  distracting.

* Keep the background color for <programlisting> elements, but make it
  a bit lighter and add a thin border that is slightly darker than the
  highlighting background.

* Change the width of <example>, <note>, <warning> and other block
  elements to use a percentage of the page width instead of a
  hardcoded pixel-based length.

* Add Wikipedia-inspired coloured backgrounds and thin borders around
  <example>, <note>, <warning> and tip elements.

Reviewed by:	blackend, gavin, rene
No objections:	freebsd-doc
---
 share/misc/docbook.css | 72 +++++++++++++++++++-----------------------
 1 file changed, 33 insertions(+), 39 deletions(-)

diff --git a/share/misc/docbook.css b/share/misc/docbook.css
index 3fb7cbc93c..2873105d57 100644
--- a/share/misc/docbook.css
+++ b/share/misc/docbook.css
@@ -149,61 +149,55 @@ BODY P B.APPLICATION {
 	text-decoration: underline;
 } 
 
-.PROGRAMLISTING, .SCREEN {
-	background-color: #DEE3E7;
-	padding: 4px;
+.SCREEN {
+	padding: 1ex;
+}
+
+.PROGRAMLISTING {
+	padding: 1ex;
+	background-color: #eee;
+	border: 1px solid #ccc;
 }
 
 @media screen {  /* hide from IE3 */
 	a[href]:hover { background: #ffa }
 }
 
-
-BLOCKQUOTE.NOTE{
-	color: #173B7F;
-	background: #d5e3ff;
-	border: 2px solid #7387b0;
-	padding-top: 1px;
-	padding-left: 5px;
-	padding-right: 5px;
-	padding-bottom: 2px;
-	width: 800px;
+BLOCKQUOTE.NOTE {
+	color: #222;
+	background: #eee;
+	border: 1px solid #ccc;
+	padding: 0.4em 0.4em;
+	width: 85%;
 }
 
-BLOCKQUOTE.TIP{
+BLOCKQUOTE.TIP {
 	color: #004F00;
-	background: #c8dcc6;
-	border: 2px solid green;
-	padding: 3px;
-	width: 800px;
-	align: middle;
+	background: #d8ecd6;
+	border: 1px solid green;
+	padding: 0.2em 2em;
+	width: 85%;
 }
 
-BLOCKQUOTE.IMPORTANT{
-	color:red;
-	font-family: arial; 
+BLOCKQUOTE.IMPORTANT {
 	font-style:italic;
-	font-weight:bold;
-	line-height: 21px;
+	border: 1px solid #a00;
+	border-left: 12px solid #c00;
+	padding: 0.1em 1em;
 }
 
-BLOCKQUOTE.WARNING{
+BLOCKQUOTE.WARNING {
 	color: #9F1313;
-	background: #f8e4e4;
-	border: 2px solid #e59595;
-	padding-top: 1px;
-	padding-left: 5px;
-	padding-right: 5px;
-	padding-bottom: 2px;
-	width: 800px;	
+	background: #f8e8e8;
+	border: 1px solid #e59595;
+	padding: 0.2em 2em;
+	width: 85%;
 }
 
-.EXAMPLE{
+.EXAMPLE {
 	background: #fefde6;
-	border: 2px solid #f1bb16;
-	padding-top: 1px;
-	padding-left: 5px;
-	padding-right: 5px;
-	padding-bottom: 2px;
-	width: 800px;
+	border: 1px solid #f1bb16;
+	margin: 1em 0;
+	padding: 0.2em 2em;
+	width: 90%;
 }