зеркало из https://github.com/mozilla/pjs.git
some more style rules for the new widgets, checkmark images, etc.
This commit is contained in:
Родитель
4068500118
Коммит
4a32d7819f
|
@ -2,7 +2,7 @@
|
|||
button {
|
||||
border: 1px solid #CCCCCC;
|
||||
-moz-border-radius: 3px 2px 2px 3px;
|
||||
margin: 1px 5px 2px 5px;
|
||||
margin: 3px 5px 3px 5px;
|
||||
min-width: 5em;
|
||||
}
|
||||
|
||||
|
@ -48,7 +48,7 @@ button[disabled]:hover > .internal-box,
|
|||
button[disabled]:active > .internal-box {
|
||||
border: 1px solid #999999;
|
||||
color: #999999;
|
||||
padding: 2px;
|
||||
padding: 2px 10px 2px 10px;
|
||||
}
|
||||
|
||||
/* align text in standard buttons to center in the available space */
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
@import url(chrome://global/skin/button.css);
|
||||
@import url(chrome://global/skin/checkbox.css);
|
||||
@import url(chrome://global/skin/radio.css);
|
||||
@import url(chrome://global/skin/tree.css);
|
||||
@import url(chrome://global/skin/menubutton.css);
|
||||
@import url(chrome://global/skin/menulist.css);
|
||||
|
||||
|
@ -123,7 +124,6 @@ toolbar.decorated {
|
|||
background-position: 0% 0%;
|
||||
background-color: #CCCCCC;
|
||||
padding: 0px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
toolbar.decorated > #toolbar_throbber_box {
|
||||
|
@ -729,7 +729,7 @@ titledbox
|
|||
border: 2px groove white;
|
||||
padding: 5px;
|
||||
padding-bottom: 2px;
|
||||
margin: 2px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
title
|
||||
|
@ -1247,142 +1247,7 @@ titledbutton.borderless[disabled]:active {
|
|||
padding: 2px;
|
||||
}
|
||||
|
||||
/******** Tree widget **********/
|
||||
|
||||
tree {
|
||||
background-color: white;
|
||||
border: none;
|
||||
border-spacing: 0px;
|
||||
}
|
||||
|
||||
tree.inset {
|
||||
border-top: 1px solid #666666;
|
||||
border-bottom: 1px solid white;
|
||||
border-left: 1px solid #666666;
|
||||
border-right: 1px solid white;
|
||||
}
|
||||
|
||||
treeitem[selected="true"] > treerow {
|
||||
color: white;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
treecell {
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
padding: 1px 0px 1px 2px;
|
||||
}
|
||||
|
||||
treehead > treerow > treecell {
|
||||
background-color: #CCCCCC;
|
||||
color: black;
|
||||
border-right: 1px solid white;
|
||||
vertical-align: middle;
|
||||
padding: 0px 0px 0px 5px;
|
||||
}
|
||||
|
||||
tree.inset > treehead > treerow > treecell {
|
||||
border-top: 1px solid white;
|
||||
border-bottom: 1px solid #666666;
|
||||
border-left: 1px solid white;
|
||||
border-right: 1px solid #666666;
|
||||
}
|
||||
|
||||
tree.inset > treehead > treerow > treecell.sortable:active {
|
||||
border-top: 1px solid #666666;
|
||||
border-bottom: 1px solid white;
|
||||
border-left: 1px solid #666666;
|
||||
border-right: 1px solid white;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton:hover {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton:active {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.tree-icon {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tree-button {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
border: none;
|
||||
list-style-image: inherit;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* BEN: make rule for property list cells */
|
||||
treecell.propertylist {
|
||||
padding-left: 5px;
|
||||
border-right: 1px solid #CCCCCC;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
treeitem > treerow > treecell > .twisty {
|
||||
border: none;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
width: 16px;
|
||||
list-style-image: url("chrome://global/skin/closedtwisty.gif");
|
||||
user-focus:ignore;
|
||||
}
|
||||
|
||||
treeitem[selected="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/closedtwisty-selected.gif");
|
||||
}
|
||||
|
||||
.twisty:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.twisty:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
treeitem[empty="true"] > treerow > treecell > titledbutton.twisty {
|
||||
list-style-image: none;
|
||||
}
|
||||
|
||||
treeitem > treerow > treecell > .twisty[disabled="true"] {
|
||||
list-style-image: none;
|
||||
}
|
||||
|
||||
treeitem[container="true"][open="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/opentwisty.gif");
|
||||
}
|
||||
|
||||
treeitem[selected="true"][container="true"][open="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/opentwisty-selected.gif");
|
||||
}
|
||||
|
||||
|
||||
/* tree header with sort direction indicators */
|
||||
treecell.sortDirectionIndicator[sortDirection="ascending"] > .treeheader-sortdirection {
|
||||
list-style-image: url("chrome://global/skin/sortAscending.gif");
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
treecell.sortDirectionIndicator[sortDirection="descending"] > .treeheader-sortdirection {
|
||||
list-style-image: url("chrome://global/skin/sortDescending.gif");
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
/********** Tab widget *********/
|
||||
|
||||
tab {
|
||||
border-top: 1px solid white;
|
||||
border-bottom: 1px solid #666666;
|
||||
|
@ -2044,7 +1909,7 @@ separator[type="groove"][orient="vertical"] {
|
|||
}
|
||||
|
||||
html {
|
||||
padding: 5px 3px 5px 4px;
|
||||
margin: 5px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
|
@ -2063,10 +1928,20 @@ box[autostretch="never"], box[autostretch="never"][orient="horizontal"] {
|
|||
|
||||
/* NEW WIDGET LANDING: <text> rules */
|
||||
text.label {
|
||||
margin: 0px;
|
||||
padding: 5px 3px 5px 4px;
|
||||
margin: 1px 5px 2px 5px;
|
||||
}
|
||||
|
||||
progressmeter {
|
||||
margin: 0px 4px 0px 4px;
|
||||
}
|
||||
|
||||
/* NEW WIDGETS <box> formatting */
|
||||
box[autostretch="never"] {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
box[autostretch="never"][orient="vertical"] {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -37,6 +37,7 @@ install::
|
|||
$(MAKE_INSTALL) menubutton.css $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) menulist.css $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) radio.css $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) tree.css $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) scrollbars.css $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) htmlBindings.xml $(DISTXUL)
|
||||
$(MAKE_INSTALL) xulBindings.xml $(DISTXUL)
|
||||
|
@ -134,6 +135,8 @@ install::
|
|||
$(MAKE_INSTALL) tab-rightedge.gif $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) sortAscending.gif $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) sortDescending.gif $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) check-check.gif $(DISTBROWSER)
|
||||
$(MAKE_INSTALL) check-radio.gif $(DISTBROWSER)
|
||||
|
||||
clobber::
|
||||
rm -f $(DIST)\bin\chrome\global\skin\default\*.*
|
||||
|
|
|
@ -0,0 +1,145 @@
|
|||
|
||||
/******** Tree widget **********/
|
||||
|
||||
/** basic tree ****************************************************
|
||||
* basic tree widget for use in main windows where no decoration
|
||||
* is required.
|
||||
**/
|
||||
tree {
|
||||
background-color: white;
|
||||
border: none;
|
||||
border-spacing: 0px;
|
||||
}
|
||||
|
||||
/** class="inset" *************************************************
|
||||
* this is the tree class used by dialogs to create treeviews with
|
||||
* inset borders, and default dialog spacing.
|
||||
**/
|
||||
tree.inset {
|
||||
border-top: 1px solid #666666;
|
||||
border-bottom: 1px solid white;
|
||||
border-left: 1px solid #666666;
|
||||
border-right: 1px solid white;
|
||||
margin: 1px 5px 2px 5px;
|
||||
}
|
||||
|
||||
treeitem[selected="true"] > treerow {
|
||||
color: white;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
treecell {
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
padding: 1px 0px 1px 2px;
|
||||
}
|
||||
|
||||
treehead > treerow > treecell {
|
||||
background-color: #CCCCCC;
|
||||
color: black;
|
||||
border-right: 1px solid white;
|
||||
vertical-align: middle;
|
||||
padding: 0px 0px 0px 5px;
|
||||
}
|
||||
|
||||
tree.inset > treehead > treerow > treecell {
|
||||
border-top: 1px solid white;
|
||||
border-bottom: 1px solid #666666;
|
||||
border-left: 1px solid white;
|
||||
border-right: 1px solid #666666;
|
||||
}
|
||||
|
||||
tree.inset > treehead > treerow > treecell.sortable:active {
|
||||
border-top: 1px solid #666666;
|
||||
border-bottom: 1px solid white;
|
||||
border-left: 1px solid #666666;
|
||||
border-right: 1px solid white;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton:hover {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
treecell.image > titledbutton:active {
|
||||
text-decoration: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.tree-icon {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tree-button {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
border: none;
|
||||
list-style-image: inherit;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/** class="propertylist" ******************************************
|
||||
* class for cells in grid-formatted property lists.
|
||||
**/
|
||||
treecell.propertylist {
|
||||
padding-left: 5px;
|
||||
border-right: 1px solid #CCCCCC;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
treeitem > treerow > treecell > .twisty {
|
||||
border: none;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
width: 16px;
|
||||
list-style-image: url("chrome://global/skin/closedtwisty.gif");
|
||||
user-focus:ignore;
|
||||
}
|
||||
|
||||
treeitem[selected="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/closedtwisty-selected.gif");
|
||||
}
|
||||
|
||||
.twisty:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.twisty:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
treeitem[empty="true"] > treerow > treecell > titledbutton.twisty {
|
||||
list-style-image: none;
|
||||
}
|
||||
|
||||
treeitem > treerow > treecell > .twisty[disabled="true"] {
|
||||
list-style-image: none;
|
||||
}
|
||||
|
||||
treeitem[container="true"][open="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/opentwisty.gif");
|
||||
}
|
||||
|
||||
treeitem[selected="true"][container="true"][open="true"] > treerow > treecell > .twisty {
|
||||
list-style-image: url("chrome://global/skin/opentwisty-selected.gif");
|
||||
}
|
||||
|
||||
|
||||
/* tree header with sort direction indicators */
|
||||
treecell.sortDirectionIndicator[sortDirection="ascending"] > .treeheader-sortdirection {
|
||||
list-style-image: url("chrome://global/skin/sortAscending.gif");
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
treecell.sortDirectionIndicator[sortDirection="descending"] > .treeheader-sortdirection {
|
||||
list-style-image: url("chrome://global/skin/sortDescending.gif");
|
||||
margin-right: 3px;
|
||||
}
|
Загрузка…
Ссылка в новой задаче