Bug 590073 - Classic specific styling of arrow panels. r=neil a=b

--HG--
extra : rebase_source : 839d3bbda55d4fe2b06d99f9a06d6b4effad46e6
This commit is contained in:
Dão Gottwald 2010-12-21 00:02:09 +01:00
parent c3ab72823b
commit eefbd6b061
9 changed files with 228 additions and 83 deletions

View File

@ -1121,9 +1121,7 @@ toolbar[iconsize="small"] #feed-button {
/* Notification popup */
#notification-popup {
margin: 4px 0;
min-width: 280px;
padding: 10px;
}
.popup-notification-icon {
@ -1330,10 +1328,6 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
}
/* Bookmarking panel */
#editBookmarkPanel {
padding: 4px;
}
#editBookmarkPanelStarIcon {
list-style-image: url("chrome://browser/skin/places/starred48.png");
width: 48px;

View File

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg"
width="17"
height="34">
<path d="M 17,0 L 0,17 17,34 z"
fill="-moz-Dialog"/>
</svg>

After

Width:  |  Height:  |  Size: 183 B

View File

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg"
width="34"
height="17">
<path d="M 0,17 L 17,0 34,17 z"
fill="-moz-Dialog"/>
</svg>

After

Width:  |  Height:  |  Size: 183 B

View File

@ -43,6 +43,8 @@ toolkit.jar:
+ skin/classic/global/icons/folder-item.png (icons/folder-item.png)
+ skin/classic/global/icons/loading_16.png (icons/loading_16.png)
+ skin/classic/global/icons/notloading_16.png (icons/notloading_16.png)
+ skin/classic/global/icons/panelarrow-horizontal.svg (icons/panelarrow-horizontal.svg)
+ skin/classic/global/icons/panelarrow-vertical.svg (icons/panelarrow-vertical.svg)
+ skin/classic/global/icons/resizer.png (icons/resizer.png)
+ skin/classic/global/icons/sslWarning.png (icons/sslWarning.png)
+ skin/classic/global/icons/webconsole.png (icons/webconsole.png)

View File

@ -49,11 +49,60 @@ panel {
panel[type="arrow"] {
-moz-transition: opacity 300ms;
-moz-appearance: none;
}
.panel-arrowbox {
/* the arrows don't display properly on Linux so disable for now */
display: none;
panel[type="arrow"][side="top"],
panel[type="arrow"][side="bottom"] {
margin-left: -23px;
margin-right: -23px;
}
panel[type="arrow"][side="left"],
panel[type="arrow"][side="right"] {
margin-top: -23px;
margin-bottom: -23px;
}
.panel-arrowcontent {
padding: 10px;
color: -moz-DialogText;
background: -moz-Dialog;
border: 1px solid ThreeDShadow;
}
.panel-arrow[side="top"],
.panel-arrow[side="bottom"] {
list-style-image: url("chrome://global/skin/icons/panelarrow-vertical.svg");
position: relative;
margin-left: 6px;
margin-right: 6px;
}
.panel-arrow[side="top"] {
margin-bottom: -1px;
}
.panel-arrow[side="bottom"] {
-moz-transform: scaleY(-1);
margin-top: -1px;
}
.panel-arrow[side="left"],
.panel-arrow[side="right"] {
list-style-image: url("chrome://global/skin/icons/panelarrow-horizontal.svg");
position: relative;
margin-top: 6px;
margin-bottom: 6px;
}
.panel-arrow[side="left"] {
margin-right: -1px;
}
.panel-arrow[side="right"] {
-moz-transform: scaleX(-1);
margin-left: -1px;
}
/* ::::: tooltip ::::: */

View File

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg"
width="17"
height="34">
<path d="M 17,0 L 0,17 17,34 z"
fill="ThreeDShadow"/>
<path d="M 17,1 L 1,17 17,33 z"
fill="-moz-Dialog"/>
</svg>

After

Width:  |  Height:  |  Size: 247 B

View File

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg"
width="34"
height="17">
<path d="M 0,17 L 17,0 34,17 z"
fill="ThreeDShadow"/>
<path d="M 1,17 L 17,1 33,17 z"
fill="-moz-Dialog"/>
</svg>

After

Width:  |  Height:  |  Size: 247 B

View File

@ -80,6 +80,8 @@ toolkit.jar:
skin/classic/global/arrow/panelarrow-up.png (arrow/panelarrow-up.png)
skin/classic/global/arrow/panelarrow-down.png (arrow/panelarrow-down.png)
skin/classic/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz.png)
skin/classic/global/arrow/panelarrow-horizontal.svg (arrow/panelarrow-horizontal.svg)
skin/classic/global/arrow/panelarrow-vertical.svg (arrow/panelarrow-vertical.svg)
skin/classic/global/checkbox/cbox-check.gif (checkbox/cbox-check.gif)
skin/classic/global/checkbox/cbox-check-dis.gif (checkbox/cbox-check-dis.gif)
skin/classic/global/console/console.css (console/console.css)
@ -257,6 +259,8 @@ toolkit.jar:
skin/classic/aero/global/arrow/panelarrow-up.png (arrow/panelarrow-up-aero.png)
skin/classic/aero/global/arrow/panelarrow-down.png (arrow/panelarrow-down-aero.png)
skin/classic/aero/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz-aero.png)
skin/classic/aero/global/arrow/panelarrow-horizontal.svg (arrow/panelarrow-horizontal.svg)
skin/classic/aero/global/arrow/panelarrow-vertical.svg (arrow/panelarrow-vertical.svg)
skin/classic/aero/global/checkbox/cbox-check.gif (checkbox/cbox-check.gif)
skin/classic/aero/global/checkbox/cbox-check-dis.gif (checkbox/cbox-check-dis.gif)
* skin/classic/aero/global/console/console.css (console/console-aero.css)

View File

@ -70,105 +70,169 @@ panel[type="arrow"] {
-moz-transition: opacity 300ms;
}
panel[type="arrow"][side="top"],
panel[type="arrow"][side="bottom"] {
margin-left: -25px;
margin-right: -25px;
}
%ifdef XP_WIN
@media not all and (-moz-windows-default-theme) {
%endif
panel[type="arrow"][side="top"],
panel[type="arrow"][side="bottom"] {
margin-left: -23px;
margin-right: -23px;
}
panel[type="arrow"][side="left"],
panel[type="arrow"][side="right"] {
margin-top: -25px;
margin-bottom: -25px;
}
panel[type="arrow"][side="left"],
panel[type="arrow"][side="right"] {
margin-top: -23px;
margin-bottom: -23px;
}
.panel-arrowcontent {
border-radius: 6px;
.panel-arrowcontent {
border-radius: 6px;
padding: 10px;
color: -moz-DialogText;
background: -moz-Dialog;
border: 1px solid ThreeDShadow;
}
.panel-arrow[side="top"],
.panel-arrow[side="bottom"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
position: relative;
margin-left: 6px;
margin-right: 6px;
}
.panel-arrow[side="top"] {
margin-bottom: -1px;
}
.panel-arrow[side="bottom"] {
-moz-transform: scaleY(-1);
margin-top: -1px;
}
.panel-arrow[side="left"],
.panel-arrow[side="right"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
position: relative;
margin-top: 6px;
margin-bottom: 6px;
}
.panel-arrow[side="left"] {
margin-right: -1px;
}
.panel-arrow[side="right"] {
-moz-transform: scaleX(-1);
margin-left: -1px;
}
%ifdef XP_WIN
}
%endif
%ifdef XP_WIN
@media all and (-moz-windows-default-theme) {
panel[type="arrow"][side="top"],
panel[type="arrow"][side="bottom"] {
margin-left: -25px;
margin-right: -25px;
}
panel[type="arrow"][side="left"],
panel[type="arrow"][side="right"] {
margin-top: -25px;
margin-bottom: -25px;
}
.panel-arrowcontent {
border-radius: 6px;
%ifdef WINSTRIPE_AERO
background-color: rgba(179,230,255,.35);
background-image: -moz-linear-gradient(rgba(250,253,255,.9), rgba(250,253,255,.75) 20px, rgba(250,253,255,.70) 39px, rgba(250,253,255,0) 41px, rgba(250,253,255,0));
margin: 5px;
box-shadow: 0 0 0 1px rgba(255,255,255,.65) inset,
0 1px 0 rgba(255,255,255,.3) inset,
0 0 0 1px rgba(0,0,0,.75),
0 1px 3px 2px rgba(0,0,0,.65);
background-color: rgba(179,230,255,.35);
background-image: -moz-linear-gradient(rgba(250,253,255,.9), rgba(250,253,255,.75) 20px, rgba(250,253,255,.70) 39px, rgba(250,253,255,0) 41px, rgba(250,253,255,0));
margin: 5px;
box-shadow: 0 0 0 1px rgba(255,255,255,.65) inset,
0 1px 0 rgba(255,255,255,.3) inset,
0 0 0 1px rgba(0,0,0,.75),
0 1px 3px 2px rgba(0,0,0,.65);
%else
background: -moz-linear-gradient(rgba(250,251,253,.95), rgba(250,251,253,.95) 20px, rgba(250,251,253,.95));
padding: 16px;
margin: 3px;
box-shadow: 0 0 5px 1px rgba(184,205,232,1) inset,
0 0 0 1px rgba(0,0,0,.25),
0 1px 5px rgba(0,0,0,.5);
background: -moz-linear-gradient(rgba(250,251,253,.95), rgba(250,251,253,.95) 20px, rgba(250,251,253,.95));
padding: 16px;
margin: 3px;
box-shadow: 0 0 5px 1px rgba(184,205,232,1) inset,
0 0 0 1px rgba(0,0,0,.25),
0 1px 5px rgba(0,0,0,.5);
%endif
}
}
%ifdef WINSTRIPE_AERO
.panel-inner-arrowcontent {
background-color: rgba(250,250,250,.95);
background-clip: padding-box;
margin: 4px;
border: 2px solid;
-moz-border-radius: 2px;
-moz-border-top-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-left-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-bottom-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-right-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
padding: 16px;
}
.panel-inner-arrowcontent {
background-color: rgba(250,250,250,.95);
background-clip: padding-box;
margin: 4px;
border: 2px solid;
-moz-border-radius: 2px;
-moz-border-top-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-left-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-bottom-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
-moz-border-right-colors: rgba(255,255,255,.6) rgba(0,0,0,.7);
padding: 16px;
}
%endif
.panel-arrow[side="top"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png");
.panel-arrow[side="top"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png");
%ifdef WINSTRIPE_AERO
margin-bottom: -5px;
margin-top: -5px;
margin-bottom: -5px;
margin-top: -5px;
%else
margin-left: 6px;
margin-right: 6px;
margin-bottom: -13px;
margin-top: -4px;
margin-left: 6px;
margin-right: 6px;
margin-bottom: -13px;
margin-top: -4px;
%endif
}
}
.panel-arrow[side="bottom"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png");
.panel-arrow[side="bottom"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png");
%ifdef WINSTRIPE_AERO
margin-top: -5px;
margin-bottom: -5px;
margin-top: -5px;
margin-bottom: -5px;
%else
margin-left: 6px;
margin-right: 6px;
margin-top: -12px;
margin-bottom: -4px;
margin-left: 6px;
margin-right: 6px;
margin-top: -12px;
margin-bottom: -4px;
%endif
}
}
.panel-arrow[side="left"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
.panel-arrow[side="left"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
%ifdef WINSTRIPE_AERO
margin-right: -5px;
margin-left: -5px;
margin-right: -5px;
margin-left: -5px;
%else
margin-top: 6px;
margin-bottom: 6px;
margin-right: -12px;
margin-left: -4px;
margin-top: 6px;
margin-bottom: 6px;
margin-right: -12px;
margin-left: -4px;
%endif
}
}
.panel-arrow[side="right"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
-moz-transform: scaleX(-1);
.panel-arrow[side="right"] {
list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
-moz-transform: scaleX(-1);
%ifdef WINSTRIPE_AERO
margin-left: -5px;
margin-right: -5px;
margin-left: -5px;
margin-right: -5px;
%else
margin-top: 6px;
margin-bottom: 6px;
margin-left: -12px;
margin-right: -4px;
margin-top: 6px;
margin-bottom: 6px;
margin-left: -12px;
margin-right: -4px;
%endif
}
}
%endif
/* ::::: tooltip ::::: */