Merge lp:~tblue/quam-plures/bug12-fix_toolbar_colors into lp:quam-plures

[Tilman Blumenbach]

See http://bugs.quamplures.net/cgi-bin/show_bug.cgi?id=12

Fixes issues with toolbar colors in Opera by "hardcoding" them instead of using the (deprecated) CSS2 system color names.

[EdB (edb)]

downloading now, sorry for the delay, will test and review and report back.

[EdB (edb)]

Approving even though the comment in the css file is pure bloat. I mean, it is cool info, but there is no reason at all to send that info to every visitor.

Anyway looks good works pretty much as expected so yay :)

Slight color diffs for me (FF 3.foo.bar), which is a good thing. It if really does blend in with the browser frame stuff then it kinda isn't obviously part of the pages.

I'll do a handful of merges this weekend.

review: Approve

[Tilman Blumenbach (tblue)]

> Approving even though the comment in the css file is pure bloat. I mean, it is cool info, but there is no reason at all to send that info to every visitor.

I knew you would say that, but I think it's useful info for us developers. It will get stripped out by minify anyway (I'll work on including that soon).

=== modified file 'qp_rsc/css/basic.css'
--- qp_rsc/css/basic.css	2011-08-04 18:00:51 +0000
+++ qp_rsc/css/basic.css	2011-09-02 13:51:18 +0000
@@ -1,4 +1,39 @@
-/* Obviously, this file no longer contains only basic styles */
+/* Obviously, this file no longer contains only basic styles.
+ *
+ * For the toolbar, we do not use the system colors defined by CSS2 as they are
+ * deprecated in CSS3 and don't seem to work correctly in Opera. Instead, we use
+ * the following values (taken from Firefox 6.0.1 which probably uses the standard
+ * GTK+ theme colors or something):
+ * 
+ * ActiveBorder:        #FFFFFF
+ * ActiveCaption:       #DCDAD5
+ * AppWorkspace:        #DCDAD5
+ * Background:          #DCDAD5
+ * ButtonFace:          #DCDAD5
+ * ButtonHighlight:     #FFFFFF
+ * ButtonShadow:        #9E9A91
+ * ButtonText:          #000000
+ * CaptionText:         #000000
+ * GrayText:            #757575
+ * Highlight:           #4B6983
+ * HighlightText:       #FFFFFF
+ * InactiveBorder:      #DCDAD5
+ * InactiveCaption:     #DCDAD5
+ * InactiveCaptionText: #757575
+ * InfoBackground:      #EEE1B3
+ * InfoText:            #000000
+ * Menu:                #DCDAD5
+ * MenuText:            #000000
+ * Scrollbar:           #C4C2BD
+ * ThreeDDarkShadow:    #000000
+ * ThreeDFace:          #DCDAD5
+ * ThreeDHighlight:     #FFFFFF
+ * ThreeDLightShadow:   #DCDAD5
+ * ThreeDShadow:        #9E9A91
+ * Window:              #DCDAD5
+ * WindowFrame:         #DCDAD5
+ * WindowText:          #000000
+ */
 
 @import url("basic_styles.css"); /* Import the REAL basic styles */
 
@@ -105,13 +140,12 @@
  * any too general styles a template may want to bring in for its own body/general display.
  */
 div#toolbar {
-	background-color: ThreeDFace;
-	color: ButtonText;
-	border-top: 1px solid ThreeDHighlight;
-	border-bottom: 1px solid ThreeDShadow;
+	background-color: #DCDAD5;
+	color: #000000;
+	border-top: 1px solid #FFFFFF;
+	border-bottom: 1px solid #9E9A91;
 	text-align: left;
 	margin: 0;
-	/* font: menu; /* -- poorly supported */
 	font-size: 11px;
 	font-family: "Microsoft sans serif", sans-serif, Arial, Helvetica;
 	position: fixed;
@@ -201,11 +235,11 @@
 	margin-bottom: 1em;
 }
 .sf-menu a {
-	border: 1px solid ThreeDFace;
-	background-color: ThreeDFace;
+	border: 1px solid #DCDAD5;
+	background-color: #DCDAD5;
 	padding: 3px 1ex; /* .5em need to macth global height above */
 	text-decoration:none;
-	color: ButtonText;
+	color: #000000;
 }
 .sf-menu-right a {
 	padding: 3px 1ex 3px; /* .5em need to macth global height above */
@@ -217,7 +251,7 @@
 /* visited pseudo selector so IE6 applies text colour*/
 .sf-menu a,
 .sf-menu a:visited {
-	color: ButtonText;
+	color: #000000;
 }
 .sf-menu li {
 	/* background: #0ff; */
@@ -225,19 +259,19 @@
 .sf-menu li ul {
 }
 .sf-menu li li {
-	background: ThreeDFace; /* IE6 */
+	background: #DCDAD5; /* IE6 */
 }
 .sf-menu li li a {
 	padding: 6px 2ex;
 	border: none;
-	border-left: 1px solid ThreeDHighlight;
-	border-right: 1px solid ThreeDShadow;
+	border-left: 1px solid #FFFFFF;
+	border-right: 1px solid #9E9A91;
 }
 .sf-menu li li:first-child > a {
-	border-top: 1px solid ThreeDHighlight;
+	border-top: 1px solid #FFFFFF;
 }
 .sf-menu li li:last-child > a {
-	border-bottom: 1px solid ThreeDShadow;
+	border-bottom: 1px solid #9E9A91;
 }
 .sf-menu li.separator {
 	padding: 0;
@@ -250,7 +284,7 @@
 	margin: 0;
 }
 .sf-menu li.separator a:hover {
-	background-color: ThreeDFace;
+	background-color: #DCDAD5;
 }
 .sf-menu .separator span {
 	height: 0px;
@@ -258,8 +292,8 @@
 	padding: 0;
 	margin: 0;
 	border: none;
-	border-top: 1px solid ThreeDShadow;
-	border-bottom: 1px solid ThreeDHighlight;
+	border-top: 1px solid #9E9A91;
+	border-bottom: 1px solid #FFFFFF;
 	width: 100%;
 }
 
@@ -272,7 +306,7 @@
 
 .sf-menu a.disabled,
 .sf-menu a.disabled:hover {
-	color: GrayText;
+	color: #757575;
 }
 .sf-menu a.noborder {
 	border: none;
@@ -284,11 +318,11 @@
 .sf-menu a:active {
 	text-decoration: none;
 	outline: 0;
-	border-top-color: ThreeDHighlight;
-	border-left-color: ThreeDHighlight;
-	border-bottom-color: ThreeDShadow;
-	border-right-color: ThreeDShadow;
-	color: ButtonText;
+	border-top-color: #FFFFFF;
+	border-left-color: #FFFFFF;
+	border-bottom-color: #9E9A91;
+	border-right-color: #9E9A91;
+	color: #000000;
 }
 .sf-menu li li:hover,
 .sf-menu li li.sfHover,
@@ -296,24 +330,24 @@
 .sf-menu li li a:hover,
 .sf-menu li li a:active {
 	border: none;
-	background-color: Highlight;
-	color: HighlightText;
+	background-color: #4B6983;
+	color: #FFFFFF;
 }
 .sf-menu li li a:focus,
 .sf-menu li li a:hover,
 .sf-menu li li a:active {
-	border-left: 1px solid ThreeDHighlight;
-	border-right: 1px solid ThreeDShadow;
+	border-left: 1px solid #FFFFFF;
+	border-right: 1px solid #9E9A91;
 }
 .sf-menu li li:first-child > a:focus,
 .sf-menu li li:first-child > a:hover,
 .sf-menu li li:first-child > a:active {
-	border-top: 1px solid ThreeDHighlight;
+	border-top: 1px solid #FFFFFF;
 }
 .sf-menu li li:last-child > a:focus,
 .sf-menu li li:last-child > a:hover,
 .sf-menu li li:last-child > a:active {
-	border-bottom: 1px solid ThreeDShadow;
+	border-bottom: 1px solid #9E9A91;
 }
 /* point right for anchors in subs */
 .sf-menu ul .sf-sub-indicator {