2 /******** Tree widget **********/
4 /** basic tree ****************************************************
5 * basic tree widget for use in main windows where no decoration
9 background-color: white;
14 /** class="inset" *************************************************
15 * this is the tree class used by dialogs to create treeviews with
16 * inset borders, and default dialog spacing.
19 border: 1px inset #CCD0DD;
20 margin: 1px 3px 2px 3px;
23 treeitem[selected="true"] > treerow,
24 treeitem[dd-dropon="true"] > treerow
27 background-color: #336699;
32 vertical-align: middle;
33 padding: 1px 0px 1px 2px;
36 .treecell-header-image
38 list-style-image : inherit;
42 .treecell-header-image,
43 .treecell-inset-header {
44 background-color: #CCD0DD;
46 border: 1px outset #CCD0DD;
47 vertical-align: middle;
52 .treecell-header-image-box {
56 .treecell-header:hover:active > .treecell-header-box,
57 .treecell-inset-header:hover:active > .treecell-header-box,
58 .treecell-header-image:hover:active > .treecell-header-image-box {
59 padding: 2px 0px 0px 2px;
62 .treecell-header:hover:active,
63 .treecell-inset-header:hover:active,
64 .treecell-header-image:hover:active {
65 border: 1px inset #CCD0DD;
73 /** class="propertylist" ******************************************
74 * class for cells in grid-formatted property lists.
76 treecell.propertylist {
78 border-right: 1px solid #CCD0DD;
79 border-bottom: 1px solid #CCD0DD;
82 .tree-cell-primary-icon {
83 list-style-image: inherit;
88 list-style-image: inherit;
92 .treecell-indent > .tree-cell-primary-icon {
96 treeitem[container="true"] > treerow > .treecell-indent > .tree-cell-primary-icon {
101 list-style-image: url("chrome://global/skin/closedtwisty.gif");
106 treeitem[container="true"] > treerow > .treecell-indent > .tree-cell-primary-icon {
110 treeitem[selected="true"] > treerow > treecell > .tree-cell-twisty {
111 list-style-image: url("chrome://global/skin/closedtwisty-selected.gif");
114 .tree-cell-twisty:hover {
115 text-decoration: none;
118 .tree-cell-twisty:active {
119 text-decoration: none;
122 .tree-cell-twisty[disabled="true"] {
123 list-style-image: none;
126 treeitem[container="true"][open="true"] > treerow > treecell > .tree-cell-twisty {
127 list-style-image: url("chrome://global/skin/opentwisty.gif");
130 treeitem[selected="true"][container="true"][open="true"] > treerow > treecell > .tree-cell-twisty {
131 list-style-image: url("chrome://global/skin/opentwisty-selected.gif");
135 /* tree header with sort direction indicators */
136 .tree-header-sortdirection {
137 list-style-image : none;
140 .sortDirectionIndicator[sortDirection="ascending"] > .treecell-header-box > .tree-header-sortdirection {
141 list-style-image: url("chrome://global/skin/sortAscending.gif");
144 .sortDirectionIndicator[sortDirection="descending"] > .treecell-header-box > .tree-header-sortdirection {
145 list-style-image: url("chrome://global/skin/sortDescending.gif");
148 treecol[sortDirection="true"],
149 treecol[sortActive="true"]
151 background-color : #DFDFDF;
156 list-style-image : url("chrome://global/skin/columnselect.gif");
159 .inline-edit-cell-box
164 /* Inline Editable Treecells */
165 .textfield-inline-edit
167 border : 1px solid #666699 !important;
168 margin : 0px !important;
171 .textfield-inline-edit > .textfield-internal-box > .textfield-input
173 border : 0px !important;
174 padding : 1px !important;
175 margin : 0px !important;
178 .textfield-inline-edit > .textfield-internal-box
180 border : 0px !important;
181 padding : 0px !important;
182 margin : 0px !important;
185 treerow[mode="inline-edit"]
187 background : transparent;