#46423 -> New Modern Skin. Fixes for navigation toolbar, removing stacks and unnecessary PNGs so that urlbar typing is faster. r=hangas, a=mscott.

git-svn-id: svn://10.0.0.236/trunk@234260 18797224-902f-48f8-a5cc-f745e15eee43
This commit is contained in:
nbhatla%netscape.com
2007-09-06 21:49:45 +00:00
parent a394257985
commit 86c9faa4ea
7 changed files with 144 additions and 87 deletions

View File

@@ -28,7 +28,7 @@
.bookmarkitem[menuactive="true"]
{
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-item-sel.gif");
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-item.png");
}
.bookmarkfolder
@@ -38,7 +38,7 @@
.bookmarkfolder[menuactive="true"]
{
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-folder-closed-sel.gif");
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.png");
}
.bookmarkfolder[open="true"]
@@ -48,7 +48,7 @@
.bookmarkfolder[open="true"][menuactive="true"]
{
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-folder-open-sel.gif");
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-folder-open.png");
}
@@ -73,7 +73,7 @@ treeitem[selected="true"][type="http://home.netscape.com/NC-rdf#Folder"] > treer
treeitem[selected="true"][type="http://home.netscape.com/NC-rdf#IEFavoriteFolder"] > treerow > .treecell-bookmark,
treeitem[selected="true"][container="true"][open="true"] > treerow > .treecell-bookmark
{
list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed-sel.gif");
list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.png");
}
treeitem[type="http://home.netscape.com/NC-rdf#Folder"][open="true"] > treerow > .treecell-bookmark,
@@ -85,7 +85,7 @@ treeitem[type="http://home.netscape.com/NC-rdf#IEFavoriteFolder"][open="true"] >
treeitem[selected="true"][type="http://home.netscape.com/NC-rdf#Folder"][open="true"] > treerow > .treecell-bookmark,
treeitem[selected="true"][type="http://home.netscape.com/NC-rdf#IEFavoriteFolder"][open="true"] > treerow > .treecell-bookmark
{
list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open-sel.gif");
list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.png");
}
treeitem[container="true"][open="true"] > treerow > .treecell-bookmark {

View File

@@ -3,12 +3,10 @@
{
behavior : url("chrome://global/content/xulBindings.xml#buttontop");
list-style-image : url("chrome://global/skin/animthrob_single.gif");
width : 56px;
max-width : 56px;
padding : 7px 8px 6px 16px;
margin : 0px;
margin : 3px 1px 6px 8px;
padding : 0px;
cursor : pointer;
border : none;
border : 0px;
background-color : transparent;
}
@@ -19,12 +17,12 @@
#navigator-throbber:hover:active
{
padding : 8px 7px 5px 17px;
margin : 4px 0px 5px 9px;
}
#navigator-throbber > .button-internal-box
{
border : none;
border : 0px;
padding : 0px;
margin : 0px;
}

View File

@@ -4,8 +4,8 @@
**/
.button-toolbar
{
border : 1px solid transparent;
margin : 1px 0px 1px 0px;
border : 0px solid transparent;
margin : 0px 0px 0px 0px;
-moz-border-radius : 0px;
color : #FFFFFF;
padding : 0px;
@@ -15,13 +15,13 @@
.button-toolbar:hover
{
border : 1px solid #FFFFFF;
border : 0px solid #FFFFFF;
}
.button-toolbar:hover:active,
.button-toolbar[home-dragover="true"]
{
border : 1px solid #336699;
border : 0px solid #336699;
}
.button-toolbar > .button-internal-box,
@@ -55,7 +55,7 @@
.button-toolbar[toggled="true"]
{
border : 1px solid 0x003366;
border : 0px solid 0x003366;
background-color : #AAAAAA;
-moz-border-radius : 4px;
}
@@ -64,7 +64,7 @@
.button-toolbar[disabled="true"]:hover,
.button-toolbar[disabled="true"]:hover:active
{
border : 1px solid transparent;
border : 0px solid transparent;
}
/** The largest type of toolbar buttons. In the Seamonkey implementation,
@@ -198,11 +198,10 @@
.button-toolbar-3
{
behavior : url("chrome://global/skin/globalBindings.xml#three-slice-button");
margin : 0px 0px 0px 3px;
font-weight : bold;
background-color : transparent;
border : 0px;
margin : 5px 7px 6px 0px;
margin : 2px 7px 3px 0px;
color : #2F405D;
}

View File

@@ -3,61 +3,64 @@
toolbar
{
background-color : #CCCCCC;
border-bottom : 1px solid #003366;
background-color : #394B6E;
border-bottom : 1px solid #677684;
border-top : 1px solid #A9B7D8;
}
toolbargrippy
{
background-image : url("chrome://global/skin/taskbar-tab-trans.gif");
background-repeat : no-repeat;
border-right : 1px solid #003366;
width : 10px;
height : 10px;
background : url("chrome://global/skin/tb-grippy-up.png") no-repeat bottom;
width : 9px;
height : 7px;
margin : 0px 0px 3px 2px;
}
toolbar[collapsed="true"]
toolbargrippy:hover:active
{
min-height : 0px;
background : url("chrome://global/skin/tb-grippy-up-clicked.png") no-repeat bottom;
}
.collapsed-tray-holder
{
background-color : #394B6E; //#B0BFD4;
border-bottom : 1px solid #11151F;
border-top : 1px solid #A9B7D8;
}
toolbargrippy[tbgrippy-collapsed="true"]
{
background : url(chrome://global/skin/tb-grippy-down.png) no-repeat bottom left;
margin : 1px 0px 1px 2px;
}
toolbargrippy[tbgrippy-collapsed="true"]:hover:active
{
background : url("chrome://global/skin/tb-grippy-down-clicked.png") no-repeat bottom left;
}
toolbar[collapsed="true"] > toolbargrippy
{
width : 30px;
}
toolbargrippy:hover
{
background-color : #99cccc !important;
background-image : url("chrome://global/skin/taskbar-tab-hover.gif") !important;
}
.toolbar-primary
.toolbar-standard > toolbargrippy
{
background-image : url("chrome://global/skin/navbar-bg.gif");
background-color : #CCCCCC;
padding : 0px;
border : none;
}
.toolbar-primary > toolbargrippy, .toolbar-standard > toolbargrippy
{
background-color : #003366;
background-color : #003366;
background-image : url("chrome://global/skin/taskbar-tab.gif");
background-repeat : no-repeat;
}
.toolbar-standard
{
color : white;
background-color : #003366;
background-color : #394B6E;
padding : 0px;
margin : 0px;
border : none;
}
.toolbarseparator-standard
{
width : 1px;
@@ -65,3 +68,38 @@ toolbargrippy:hover
border-right : 1px solid #FFFFFF;
margin : 2px 0.2em 2px 0.2em;
}
.toolbar-primary
{
behavior : url("chrome://global/skin/globalBindings.xml#toolbar-primary");
padding : 0px;
border-bottom : 1px solid #354557;
border-top : 0px;
background-color : transparent;
background-image : none;
}
.toolbar-primary-image-left
{
background : url("chrome://global/skin/navbar-bg-leftcap.png") no-repeat;
width : 41px;
max-height : 43px;
}
.toolbar-primary-image-middle
{
background : url("chrome://global/skin/navbar-bg.png") repeat-x;
}
.toolbar-primary-image-right
{
background : url("chrome://global/skin/navbar-bg-rightcap.png") no-repeat;
width : 25px;
max-height : 43px;
}
.toolbary-primary-grippy
{
background-image : none;
background-color : transparent;
}

View File

@@ -20,21 +20,15 @@
<binding id="toolbar-primary" extends="chrome://global/content/toolbarBindings.xml#toolbar">
<content inherits="false">
<xul:stack flex="1">
<xul:box flex="1" class="toolbar-primary-bg-images">
<xul:box class="toolbar-primary-image-left"/>
<xul:box flex="1" class="toolbar-primary-image-middle"/>
<xul:box class="toolbar-primary-image-right"/>
</xul:box>
<xul:box flex="1">
<xul:toolbargrippy inherits="grippytooltiptext:tooltiptext,grippytooltip:tooltip,last-toolbar"
<xul:box class="toolbar-primary-image-left">
<xul:toolbargrippy inherits="grippytooltiptext:tooltiptext,grippytooltip:tooltip,last-toolbar"
onclick="this.grippyClicked();" tbattr="toolbar-grippy"
class="toolbar-primary-grippy"/>
<xul:box flex="1" class="toolbar-holder" inherits="collapsed,last-toolbar,tborient:orient,tbautostretch:autostretch" autostretch="never">
</xul:box>
<xul:box flex="1" class="toolbar-primary-image-middle toolbar-holder" inherits="collapsed,last-toolbar,tborient:orient,tbautostretch:autostretch" autostretch="never">
<children/>
</xul:box>
</xul:box>
</xul:stack>
</xul:box>
<xul:spring class="toolbar-primary-image-right"/>
</content>
</binding>
@@ -53,31 +47,27 @@
<binding id="nav-bar-inner" extends="xul:box">
<content>
<xul:stack flex="1">
<xul:box flex="1" class="navbar-inner-groove-images">
<xul:box class="navbar-inner-groove-image-left"/>
<xul:box flex="1" class="navbar-inner-groove-image-middle"/>
<xul:box class="navbar-inner-groove-image-right"/>
</xul:box>
<xul:box flex="1">
<children/>
<xul:spring class="navbar-inner-groove-image-left"/>
<xul:box flex="1" class="navbar-inner-border-outer">
<xul:box flex="1" class="navbar-inner-border-middle">
<xul:box flex="1" class="navbar-inner-border-inner">
<children/>
</xul:box>
</xul:box>
</xul:box>
</xul:stack>
<xul:spring class="navbar-inner-groove-image-right"/>
</content>
</binding>
<binding id="urlbar-group" extends="xul:box">
<content>
<xul:stack flex="1">
<xul:box flex="1" class="urlbar-groove-images">
<xul:box class="urlbar-image-left"/>
<xul:box flex="1" class="urlbar-image-middle"/>
<xul:box class="urlbar-image-right"/>
</xul:box>
<xul:box flex="1">
<children/>
<xul:spring class="urlbar-image-left"/>
<xul:box flex="1" class="urlbar-border-outer">
<xul:box flex="1" class="urlbar-border-inner">
<children/>
</xul:box>
</xul:box>
</xul:stack>
<xul:spring class="urlbar-image-right"/>
</content>
</binding>

View File

@@ -185,6 +185,10 @@ skins/modern.jar:
global/skin/taskbar-mail.png (global/taskbar-mail.png)
global/skin/taskbar-navigator-clicked.png (global/taskbar-navigator-clicked.png)
global/skin/taskbar-navigator.png (global/taskbar-navigator.png)
global/skin/tb-grippy-down.png (global/tb-grippy-down.png)
global/skin/tb-grippy-up-clicked.png (global/tb-grippy-up-clicked.png)
global/skin/tb-grippy-up.png (global/tb-grippy-up.png)
global/skin/tb-grippy-down-clicked.png (global/tb-grippy-down-clicked.png)
messenger/skin/AccountManager.css (messenger/AccountManager.css)
messenger/skin/addtoab.gif (messenger/addtoab.gif)
messenger/skin/attach.gif (messenger/attach.gif)

View File

@@ -43,6 +43,7 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
*/
#back-button
{
margin-left : 0px;
list-style-image : url("chrome://navigator/skin/back.png");
}
@@ -179,11 +180,27 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
height : 31px;
}
.navbar-inner-groove-image-middle
/* 3px border on top and bottom of navbar-inner */
.navbar-inner-border-outer
{
background : url("chrome://navigator/skin/navbar-inner-groove-middle.png") repeat-x;
border-top : 1px solid #8191AA;
border-bottom : 1px solid #66799B;
height : 31px;
}
.navbar-inner-border-middle
{
border-top : 1px solid #9CACC7;
border-bottom : 1px solid #4E5F7A;
}
.navbar-inner-border-inner
{
border-top : 1px solid #AEBED6;
border-bottom : 1px solid #415171;
}
.navbar-inner-groove-image-right
{
background : url("chrome://navigator/skin/navbar-inner-groove-right.png") no-repeat;
@@ -194,7 +211,7 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
#urlbar-group
{
behavior : url("chrome://global/skin/globalBindings.xml#urlbar-group");
margin : 6px 8px 6px 8px;
margin : 3px 8px 4px 2px;
}
.urlbar-image-left
@@ -204,11 +221,16 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
height : 18px;
}
.urlbar-image-middle
.urlbar-border-outer
{
background : url("chrome://navigator/skin/urlbar-middle.png") repeat-x;
border-top : 1px solid #424242;
}
.urlbar-border-inner
{
border-top : 1px solid #CACAC9;
}
.urlbar-image-right
{
background : url("chrome://navigator/skin/urlbar-right.png") no-repeat;
@@ -218,12 +240,18 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
#page-proxy-button
{
margin-left : 4px;
margin-left : 0px;
margin-right : 2px;
margin-top : -1px;
list-style-image : url("chrome://communicator/skin/bookmarks/bookmark-item.png");
cursor : grab;
}
#urlbar
{
margin-top : -1px !important;
}
/* #ubhist-keyword-popup does not exist in Mozilla, only in Netscape. It gets overlayed in with
* navExtraOverlay.xul. Ideally, this styling should only exist in Netscape, but since it is
* in Mozilla right now, it should not be removed before we ship. Take this out and put it in
@@ -255,7 +283,7 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
#ubhist
{
margin : 3px 1px 3px 0px;
margin : 2px 1px 3px 0px;
width : 10px;
list-style-image : url("chrome://global/skin/scroll-down.gif");
border : none;
@@ -297,7 +325,7 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
#search-button
{
margin-right : 10px;
margin-right : 4px;
}
#home-button