wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 683906 - Make the Highlighter Toolbar look like shorlander's design; r=dao

Browse Source
This commit is contained in:
Paul Rouget 2011-10-21 18:06:57 +02:00
parent 3b80f4a4c0
commit 156ebf61b0
4 changed files with 105 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
browser/base/content/browser.xul
View File

@ -976,7 +976,6 @@
<toolbarbutton id="inspector-inspect-toolbutton"
label="&inspectButton.label;"
accesskey="&inspectButton.accesskey;"
class="toolbarbutton-text"
command="Inspector:Inspect"/>
<toolbarseparator />
<hbox id="inspector-tools">

48
browser/themes/gnomestripe/browser/browser.css
View File

@ -1954,6 +1954,54 @@ panel[dimmed="true"] {
outline-color: white;
}
/* Highlighter toolbar */
#inspector-toolbar {
-moz-appearance: none;
padding: 4px 3px;
border-top: 1px solid hsla(210, 8%, 5%, .65);
box-shadow: 0 1px 0 0 hsla(210, 16%, 76%, .2) inset;
background-image: -moz-linear-gradient(top, hsl(210,11%,36%), hsl(210,11%,18%));
}
#inspector-inspect-toolbutton,
#inspector-tools > toolbarbutton {
-moz-appearance: none;
min-width: 78px;
min-height: 22px;
color: hsl(210,30%,85%);
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border: 1px solid hsla(210,8%,5%,.45);
border-radius: 3px;
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
#inspector-inspect-toolbutton:not([checked]):hover:active,
#inspector-tools > toolbarbutton:not([checked]):hover:active {
border-color: hsla(210,8%,5%,.6);
background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
#inspector-inspect-toolbutton[checked],
#inspector-tools > toolbarbutton[checked] {
color: hsl(208,100%,60%) !important;
border-color: hsla(210,8%,5%,.6) !important;
background: -moz-linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
#inspector-inspect-toolbutton[checked]:hover,
#inspector-tools > toolbarbutton[checked]:hover {
background-color: transparent !important;
}
#inspector-inspect-toolbutton[checked]:hover:active,
#inspector-tools > toolbarbutton[checked]:hover:active {
background-color: hsla(210,8%,5%,.2) !important;
}
/*
* need a "bumpy" background image for this!
*/

15
browser/themes/pinstripe/browser/browser.css
View File

@ -2563,8 +2563,7 @@ panel[dimmed="true"] {
#inspector-toolbar {
-moz-appearance: none;
height: 32px;
padding: 0 3px;
padding: 4px 3px;
border-top: 1px solid hsla(210, 8%, 5%, .65);
box-shadow: 0 1px 0 0 hsla(210, 16%, 76%, .2) inset;
background-image: -moz-linear-gradient(top, hsl(210,11%,36%), hsl(210,11%,18%));
@ -2573,17 +2572,21 @@ panel[dimmed="true"] {
#inspector-inspect-toolbutton,
#inspector-tools > toolbarbutton {
-moz-appearance: none;
width: 78px;
margin: 3px 5px;
min-width: 78px;
min-height: 22px;
color: hsl(210,30%,85%);
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border: 1px solid hsla(210,8%,5%,.45);
border-radius: @toolbarbuttonCornerRadius@;
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1));
background-clip: padding-box;
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
#inspector-inspect-toolbutton > .toolbarbutton-text ,
#inspector-tools > toolbarbutton > .toolbarbutton-text {
margin: 1px 6px;
}
#inspector-inspect-toolbutton:not([checked]):hover:active,
#inspector-tools > toolbarbutton:not([checked]):hover:active {
border-color: hsla(210,8%,5%,.6);

48
browser/themes/winstripe/browser/browser.css
View File

@ -2665,6 +2665,54 @@ panel[dimmed="true"] {
outline-color: white;
}
/* Highlighter toolbar */
#inspector-toolbar {
-moz-appearance: none;
padding: 4px 3px;
border-top: 1px solid hsla(211,68%,6%,.65) !important;
box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
background-image: -moz-linear-gradient(top, hsl(209,18%,34%), hsl(210,24%,16%));
}
#inspector-inspect-toolbutton,
#inspector-tools > toolbarbutton {
-moz-appearance: none;
min-width: 78px;
min-height: 22px;
color: hsl(210,30%,85%);
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border: 1px solid hsla(211,68%,6%,.5);
border-radius: 3px;
background: -moz-linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2)) padding-box;
box-shadow: 0 1px 0 hsla(209,29%,72%,.15) inset, 0 0 0 1px hsla(209,29%,72%,.1) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
}
#inspector-inspect-toolbutton > .toolbarbutton-icon,
#inspector-tools > toolbarbutton > .toolbarbutton-icon {
margin: 0;
}
#inspector-inspect-toolbutton:not([checked]):hover:active,
#inspector-tools > toolbarbutton:not([checked]):hover:active {
background-color: hsla(210,18%,9%,.1);
background-image: -moz-linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2));
box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
}
#inspector-inspect-toolbutton[checked],
#inspector-tools > toolbarbutton[checked] {
border-color: hsla(211,68%,6%,.6);
background: -moz-linear-gradient(hsla(211,68%,6%,.1), hsla(211,68%,6%,.2));
box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
color: hsl(200,100%,60%) !important;
}
#inspector-inspect-toolbutton[checked]:hover:active,
#inspector-tools > toolbarbutton[checked]:hover:active {
background-color: hsla(211,68%,6%,.2);
}
/*
* need a "bumpy" background image for this!
*/