[themes.git] / EarlyBlue / global / tree.css

/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

/* ===== tree.css =======================================================
  == Styles used by the XUL tree element.
  ======================================================================= */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* ::::: tree ::::: */

tree {
  margin: 0px;
  border: 1px inset #CCD0DD;
  background-color: #FFFFFF;
  color: #000000;
}

/* ::::: tree focusring ::::: */

.focusring > .tree-stack > .tree-rows > .tree-bodybox {
  border: 1px solid transparent;
}

.focusring:-moz-focusring > .tree-stack > .tree-rows > .tree-bodybox {
  border: 1px solid #000000;
}

/* ::::: tree rows ::::: */

treechildren::-moz-tree-row {
  border: 1px solid transparent;
  background-color: transparent;
  min-height: 18px;
  height: 1.3em;
}

treechildren::-moz-tree-row(selected) {
  background-color: #808080;
}

treechildren::-moz-tree-row(selected, focus) {
  background-color: #336699;
}

treechildren::-moz-tree-row(current, focus) {
  border: 1px dotted #9999CC;
}

treechildren::-moz-tree-row(selected, current, focus) {
  border: 1px dotted #666699;
}

tree[seltype="cell"] > treechildren::-moz-tree-row,
tree[seltype="text"] > treechildren::-moz-tree-row {
  border: none;
  background-color: transparent;
}

/* ::::: tree cells ::::: */

treechildren::-moz-tree-cell {
  padding: 0px 2px;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell-text,
tree[seltype="text"] > treechildren::-moz-tree-cell-text,
treechildren::-moz-tree-cell-text {
  color: inherit;
}

treechildren::-moz-tree-cell-text(selected) {
  color: #FFFFFF;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell {
  border: 1px solid transparent;
  padding: 0px 1px;
}

tree[seltype="text"] > treechildren::-moz-tree-cell-text {
  border: 1px solid transparent;
  padding: 0px 1px 1px;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected) {
  background-color: #808080;
}
tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected) {
  color: #FFFFFF;
}

tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected) {
  background-color: #808080;
  color: #FFFFFF;
}

treechildren::-moz-tree-cell-text(selected, focus) {
  color: #FFFFFF;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, focus) {
  background-color: #336699;
}
tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
  color: #FFFFFF;
}

tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
  background-color: #336699;
  color: #FFFFFF;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell(active, current, focus) {
  border: 1px dotted #9999CC;
}

tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, current, focus) {
  border: 1px dotted #9999CC;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, current, focus) {
  border: 1px dotted #666699;
}

tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, current, focus) {
  border: 1px dotted #666699;
}

/* ::::: lines connecting cells ::::: */

tree[seltype="cell"] > treechildren::-moz-tree-line,
tree[seltype="text"] > treechildren::-moz-tree-line,
treechildren::-moz-tree-line {
  visibility: hidden;
}

tree[seltype="cell"] > treechildren::-moz-tree-line,
tree[seltype="text"] > treechildren::-moz-tree-line,
treechildren::-moz-tree-line {
  border: 1px dotted #CCD0DD;
}

tree[seltype="cell"] > treechildren::-moz-tree-line(active, selected, focus),
treechildren::-moz-tree-line(selected, focus) {
  border: 1px dotted #666699;
}

/* ::::: tree separator ::::: */

treechildren::-moz-tree-separator {
  margin-top: 1px;
  border: 1px outset #CCD0DD;
  height: 2px;
}

/* ::::: drop feedback ::::: */

treechildren::-moz-tree-row(dropOn) {
  background-color: #336699;
}

tree[seltype="cell"] > treechildren::-moz-tree-cell-text(primary, dropOn),
tree[seltype="text"] > treechildren::-moz-tree-cell-text(primary, dropOn),
treechildren::-moz-tree-cell-text(dropOn) {
  color: #FFFFFF;
}

treechildren::-moz-tree-drop-feedback {
  background-color: #336699;
  width: 50px;
  height: 2px;
  -moz-margin-start: 5px;
}

treechildren::-moz-tree-drop-feedback(selected) {
  background-color: #FFFFFF;
}

/* ::::: tree checkbox ::::: */

treechildren::-moz-tree-checkbox {
  list-style-image: url("chrome://global/skin/tree/checkbox.gif");
}

treechildren::-moz-tree-checkbox(checked) {
  list-style-image: url("chrome://global/skin/tree/checkbox-checked.gif");
}

/* ::::: tree progress meter ::::: */

treechildren::-moz-tree-progressmeter {
  margin: 0px 0px;
  border: 1px inset #CCD0DD;
  background-color: #999999;
  color: #6699CC;
}

treechildren::-moz-tree-progressmeter(progressUndetermined) {
  list-style-image: url("chrome://global/skin/progressmeter/progressmeter-busy.gif");
  background-color: #CCD0DD;
}

treechildren::-moz-tree-cell-text(progressmeter) {
  margin: 2px 4px;
}

/* ::::: tree columns ::::: */

treecol {
  -moz-box-align: center;
  -moz-box-pack: center;
  border: 1px outset #CCD0DD;
  background-color: #CCD0DD;
  color: #000000;
  padding: 1px 4px;
}

treecolpicker {
  -moz-box-align: center;
  -moz-box-pack: center;
  border: 1px solid transparent;
  background-color: #CCD0DD;
  padding: 1px 0px;
}

.treecol-image {
  padding: 0 1px;
}

.treecol-text {
  margin: 0px !important;
  padding: 0px !important;
}

treecol[hideheader="true"] {
  border: none;
  padding: 0;
}

/* ..... internal box ..... */

treecol:hover:active {
  border: 1px solid #666699;
  padding-top: 2px;
  padding-bottom: 0px;
  -moz-padding-start: 5px;
  -moz-padding-end: 3px;
}

treecolpicker:hover:active {
  border: 1px solid #666699;
}

.treecol-image:hover:active {
  padding-top: 2px;
  padding-bottom: 0px;
  -moz-padding-start: 2px;
  -moz-padding-end: 0px;
}

/* ::::: column drag and drop styles ::::: */

treecol[dragging="true"] {
  border: 1px solid transparent;
  background-color: #336699;
  color: #000000;
}

treecol[insertafter="true"]:-moz-locale-dir(ltr),
treecol[insertbefore="true"]:-moz-locale-dir(rtl) {
  border-right: 1px solid #000000;
}

treecol[insertafter="true"]:-moz-locale-dir(rtl),
treecol[insertbefore="true"]:-moz-locale-dir(ltr) {
  border-left: 1px solid #000000;
}

treechildren::-moz-tree-column(insertbefore) {
  -moz-border-start: 1px solid #000000;
}

treechildren::-moz-tree-column(insertafter) {
  -moz-border-end: 1px solid #000000;
}

/* ::::: sort direction indicator :::::  */

.treecol-sortdirection {
  list-style-image: none;
  width: 8px;  /* The image's width is 7 pixels */
}

treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="ascending"] {
  list-style-image: url("chrome://global/skin/tree/sort-asc.gif");
}

treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="descending"] {
  list-style-image: url("chrome://global/skin/tree/sort-desc.gif");
}

/* ::::: column picker :::::  */

.tree-columnpicker-icon {
  list-style-image: url("chrome://global/skin/tree/columnpicker.gif");
}

/* ::::: twisty :::::  */

treechildren::-moz-tree-twisty {
  -moz-padding-end: 2px;
  padding-top: 1px;
  width: 11px; /* The image's width is 11 pixels */
  list-style-image: url("chrome://global/skin/tree/twisty-closed.gif");
}

treechildren::-moz-tree-twisty(open) {
  width: 11px; /* The image's width is 11 pixels */
  list-style-image: url("chrome://global/skin/tree/twisty-open.gif");
}

treechildren::-moz-tree-indentation {
  width: 11px;
}

/* ::::: gridline style ::::: */

treechildren.gridlines::-moz-tree-cell {
  border-right: 1px solid green;
  border-bottom: 1px solid green;
}

treechildren.gridlines::-moz-tree-row {
  border: none;
}

/* ::::: alternating background ::::: */

treechildren[alternatingbackground="true"]::-moz-tree-row(odd) {
  background-color: #F5F7FF;
}

treechildren[alternatingbackground="true"]::-moz-tree-row(odd, selected) {
  background-color: #A0A0A0;
}

treechildren[alternatingbackground="true"]::-moz-tree-row(odd, selected, focus) {
  background-color: #6699CC;
}

/* ::::: editable tree ::::: */

treechildren::-moz-tree-row(selected, editing) {
  background-color: transparent;
  border: none;
}

treechildren::-moz-tree-cell-text(selected, editing) {
  color: inherit;
}

.tree-input {
  border: 1px solid #336699;
  margin: 0;
  -moz-margin-start: -4px;
  padding: 1px;
}
Commit	Line	Data
9099c61d RK	1	/* This Source Code Form is subject to the terms of the Mozilla Public
	2	* License, v. 2.0. If a copy of the MPL was not distributed with this
	3	* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
128000f4	4
e1597424	5	/* ===== tree.css =======================================================
	6	== Styles used by the XUL tree element.
	7	======================================================================= */
f6e0a33f	8
e181d49e RK	9	@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
e181d49e RK	10
e1597424	11	/* ::::: tree ::::: */
	12
	13	tree {
e181d49e	14	margin: 0px;
e1597424	15	border: 1px inset #CCD0DD;
e1597424	16	background-color: #FFFFFF;
76983f4c	17	color: #000000;
e1597424	18	}
e1597424	19
b618d1fd	20	/* ::::: tree focusring ::::: */
b618d1fd	21
1d4ddf30	22	.focusring > .tree-stack > .tree-rows > .tree-bodybox {
b618d1fd	23	border: 1px solid transparent;
	24	}
	25
024ec655	26	.focusring:-moz-focusring > .tree-stack > .tree-rows > .tree-bodybox {
b618d1fd	27	border: 1px solid #000000;
b618d1fd	28	}
b618d1fd	29
e1597424	30	/* ::::: tree rows ::::: */
e1597424	31
a1f525f0	32	treechildren::-moz-tree-row {
e1597424	33	border: 1px solid transparent;
b618d1fd	34	background-color: transparent;
f2450795	35	min-height: 18px;
f2450795	36	height: 1.3em;
e1597424	37	}
e1597424	38
a1f525f0	39	treechildren::-moz-tree-row(selected) {
e1597424	40	background-color: #808080;
	41	}
	42
a1f525f0	43	treechildren::-moz-tree-row(selected, focus) {
e1597424	44	background-color: #336699;
	45	}
	46
a1f525f0	47	treechildren::-moz-tree-row(current, focus) {
e1597424	48	border: 1px dotted #9999CC;
	49	}
	50
a1f525f0	51	treechildren::-moz-tree-row(selected, current, focus) {
459f2165	52	border: 1px dotted #666699;
	53	}
	54
1d4ddf30	55	tree[seltype="cell"] > treechildren::-moz-tree-row,
1d4ddf30	56	tree[seltype="text"] > treechildren::-moz-tree-row {
aa277310	57	border: none;
	58	background-color: transparent;
	59	}
	60
e1597424	61	/* ::::: tree cells ::::: */
e1597424	62
a1f525f0	63	treechildren::-moz-tree-cell {
e181d49e	64	padding: 0px 2px;
e1597424	65	}
e1597424	66
1d4ddf30	67	tree[seltype="cell"] > treechildren::-moz-tree-cell-text,
1d4ddf30	68	tree[seltype="text"] > treechildren::-moz-tree-cell-text,
a1f525f0	69	treechildren::-moz-tree-cell-text {
e1597424	70	color: inherit;
e1597424	71	}
e1597424	72
a1f525f0	73	treechildren::-moz-tree-cell-text(selected) {
e1597424	74	color: #FFFFFF;
	75	}
	76
1d4ddf30	77	tree[seltype="cell"] > treechildren::-moz-tree-cell {
1d4ddf30	78	border: 1px solid transparent;
02920d2b	79	padding: 0px 1px;
1d4ddf30	80	}
	81
	82	tree[seltype="text"] > treechildren::-moz-tree-cell-text {
f2d09376	83	border: 1px solid transparent;
02920d2b	84	padding: 0px 1px 1px;
aa277310	85	}
aa277310	86
1d4ddf30	87	tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected) {
	88	background-color: #808080;
	89	}
	90	tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected) {
	91	color: #FFFFFF;
	92	}
	93
	94	tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected) {
b618d1fd	95	background-color: #808080;
	96	color: #FFFFFF;
	97	}
	98
a1f525f0	99	treechildren::-moz-tree-cell-text(selected, focus) {
e1597424	100	color: #FFFFFF;
	101	}
	102
1d4ddf30	103	tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, focus) {
b618d1fd	104	background-color: #336699;
1d4ddf30	105	}
1d4ddf30	106	tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
b618d1fd	107	color: #FFFFFF;
	108	}
	109
1d4ddf30	110	tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
	111	background-color: #336699;
	112	color: #FFFFFF;
	113	}
	114
	115	tree[seltype="cell"] > treechildren::-moz-tree-cell(active, current, focus) {
	116	border: 1px dotted #9999CC;
	117	}
	118
	119	tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, current, focus) {
b618d1fd	120	border: 1px dotted #9999CC;
	121	}
	122
1d4ddf30	123	tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, current, focus) {
	124	border: 1px dotted #666699;
	125	}
	126
	127	tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, current, focus) {
b618d1fd	128	border: 1px dotted #666699;
	129	}
	130
e1597424	131	/* ::::: lines connecting cells ::::: */
e1597424	132
1d4ddf30	133	tree[seltype="cell"] > treechildren::-moz-tree-line,
1d4ddf30	134	tree[seltype="text"] > treechildren::-moz-tree-line,
a1f525f0	135	treechildren::-moz-tree-line {
e1597424	136	visibility: hidden;
	137	}
	138
1d4ddf30	139	tree[seltype="cell"] > treechildren::-moz-tree-line,
1d4ddf30	140	tree[seltype="text"] > treechildren::-moz-tree-line,
a1f525f0	141	treechildren::-moz-tree-line {
726e083d	142	border: 1px dotted #CCD0DD;
e1597424	143	}
e1597424	144
1d4ddf30	145	tree[seltype="cell"] > treechildren::-moz-tree-line(active, selected, focus),
a1f525f0	146	treechildren::-moz-tree-line(selected, focus) {
726e083d	147	border: 1px dotted #666699;
e1597424	148	}
e1597424	149
	150	/* ::::: tree separator ::::: */
	151
a1f525f0	152	treechildren::-moz-tree-separator {
76983f4c	153	margin-top: 1px;
e1597424	154	border: 1px outset #CCD0DD;
76983f4c	155	height: 2px;
e1597424	156	}
	157
	158	/* ::::: drop feedback ::::: */
	159
f128e38f RK	160	treechildren::-moz-tree-row(dropOn) {
	161	background-color: #336699;
	162	}
	163
1d4ddf30	164	tree[seltype="cell"] > treechildren::-moz-tree-cell-text(primary, dropOn),
1d4ddf30	165	tree[seltype="text"] > treechildren::-moz-tree-cell-text(primary, dropOn),
a1f525f0	166	treechildren::-moz-tree-cell-text(dropOn) {
e1597424	167	color: #FFFFFF;
	168	}
	169
a1f525f0	170	treechildren::-moz-tree-drop-feedback {
e1597424	171	background-color: #336699;
	172	width: 50px;
	173	height: 2px;
6daee013	174	-moz-margin-start: 5px;
e1597424	175	}
e1597424	176
a1f525f0	177	treechildren::-moz-tree-drop-feedback(selected) {
e1597424	178	background-color: #FFFFFF;
	179	}
	180
76983f4c	181	/* ::::: tree checkbox ::::: */
	182
	183	treechildren::-moz-tree-checkbox {
	184	list-style-image: url("chrome://global/skin/tree/checkbox.gif");
	185	}
	186
	187	treechildren::-moz-tree-checkbox(checked) {
	188	list-style-image: url("chrome://global/skin/tree/checkbox-checked.gif");
	189	}
	190
f2450795	191	/* ::::: tree progress meter ::::: */
f2450795	192
a1f525f0	193	treechildren::-moz-tree-progressmeter {
f2450795	194	margin: 0px 0px;
	195	border: 1px inset #CCD0DD;
	196	background-color: #999999;
	197	color: #6699CC;
	198	}
	199
a1f525f0	200	treechildren::-moz-tree-progressmeter(progressUndetermined) {
f2450795	201	list-style-image: url("chrome://global/skin/progressmeter/progressmeter-busy.gif");
	202	background-color: #CCD0DD;
	203	}
	204
a1f525f0	205	treechildren::-moz-tree-cell-text(progressmeter) {
f2450795	206	margin: 2px 4px;
	207	}
	208
e1597424	209	/* ::::: tree columns ::::: */
e1597424	210
76983f4c	211	treecol {
e1597424	212	-moz-box-align: center;
	213	-moz-box-pack: center;
	214	border: 1px outset #CCD0DD;
	215	background-color: #CCD0DD;
	216	color: #000000;
	217	padding: 1px 4px;
	218	}
	219
76983f4c	220	treecolpicker {
e1597424	221	-moz-box-align: center;
	222	-moz-box-pack: center;
	223	border: 1px solid transparent;
	224	background-color: #CCD0DD;
	225	padding: 1px 0px;
	226	}
	227
	228	.treecol-image {
e181d49e	229	padding: 0 1px;
e1597424	230	}
76983f4c	231
e1597424	232	.treecol-text {
	233	margin: 0px !important;
	234	padding: 0px !important;
	235	}
	236
cc973dd9	237	treecol[hideheader="true"] {
	238	border: none;
	239	padding: 0;
	240	}
	241
e1597424	242	/* ..... internal box ..... */
	243
	244	treecol:hover:active {
	245	border: 1px solid #666699;
6daee013 RK	246	padding-top: 2px;
	247	padding-bottom: 0px;
	248	-moz-padding-start: 5px;
	249	-moz-padding-end: 3px;
e1597424	250	}
	251
	252	treecolpicker:hover:active {
	253	border: 1px solid #666699;
	254	}
	255
	256	.treecol-image:hover:active {
6daee013 RK	257	padding-top: 2px;
	258	padding-bottom: 0px;
	259	-moz-padding-start: 2px;
	260	-moz-padding-end: 0px;
e1597424	261	}
	262
	263	/* ::::: column drag and drop styles ::::: */
	264
	265	treecol[dragging="true"] {
	266	border: 1px solid transparent;
	267	background-color: #336699;
	268	color: #000000;
	269	}
	270
3b1530c2 RK	271	treecol[insertafter="true"]:-moz-locale-dir(ltr),
3b1530c2 RK	272	treecol[insertbefore="true"]:-moz-locale-dir(rtl) {
e1597424	273	border-right: 1px solid #000000;
	274	}
	275
3b1530c2 RK	276	treecol[insertafter="true"]:-moz-locale-dir(rtl),
3b1530c2 RK	277	treecol[insertbefore="true"]:-moz-locale-dir(ltr) {
e1597424	278	border-left: 1px solid #000000;
	279	}
	280
a1f525f0	281	treechildren::-moz-tree-column(insertbefore) {
18f5421a	282	-moz-border-start: 1px solid #000000;
e1597424	283	}
e1597424	284
a1f525f0	285	treechildren::-moz-tree-column(insertafter) {
18f5421a	286	-moz-border-end: 1px solid #000000;
e1597424	287	}
	288
	289	/* ::::: sort direction indicator ::::: */
	290
	291	.treecol-sortdirection {
	292	list-style-image: none;
76983f4c	293	width: 8px; /* The image's width is 7 pixels */
e1597424	294	}
e1597424	295
e181d49e	296	treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="ascending"] {
e1597424	297	list-style-image: url("chrome://global/skin/tree/sort-asc.gif");
	298	}
	299
e181d49e RK	300	treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="descending"] {
e181d49e RK	301	list-style-image: url("chrome://global/skin/tree/sort-desc.gif");
e1597424	302	}
	303
	304	/* ::::: column picker ::::: */
	305
	306	.tree-columnpicker-icon {
	307	list-style-image: url("chrome://global/skin/tree/columnpicker.gif");
	308	}
	309
	310	/* ::::: twisty ::::: */
	311
a1f525f0	312	treechildren::-moz-tree-twisty {
6daee013	313	-moz-padding-end: 2px;
f2450795	314	padding-top: 1px;
f2450795	315	width: 11px; /* The image's width is 11 pixels */
e1597424	316	list-style-image: url("chrome://global/skin/tree/twisty-closed.gif");
e1597424	317	}
76983f4c	318
a1f525f0	319	treechildren::-moz-tree-twisty(open) {
f2450795	320	width: 11px; /* The image's width is 11 pixels */
e1597424	321	list-style-image: url("chrome://global/skin/tree/twisty-open.gif");
	322	}
	323
a1f525f0	324	treechildren::-moz-tree-indentation {
f2450795	325	width: 11px;
e1597424	326	}
	327
	328	/* ::::: gridline style ::::: */
	329
a1f525f0	330	treechildren.gridlines::-moz-tree-cell {
e1597424	331	border-right: 1px solid green;
	332	border-bottom: 1px solid green;
	333	}
	334
a1f525f0	335	treechildren.gridlines::-moz-tree-row {
e1597424	336	border: none;
b618d1fd	337	}
76983f4c	338
	339	/* ::::: alternating background ::::: */
	340
	341	treechildren[alternatingbackground="true"]::-moz-tree-row(odd) {
	342	background-color: #F5F7FF;
	343	}
	344
	345	treechildren[alternatingbackground="true"]::-moz-tree-row(odd, selected) {
	346	background-color: #A0A0A0;
	347	}
	348
	349	treechildren[alternatingbackground="true"]::-moz-tree-row(odd, selected, focus) {
	350	background-color: #6699CC;
	351	}
1d4ddf30	352
	353	/* ::::: editable tree ::::: */
	354
	355	treechildren::-moz-tree-row(selected, editing) {
	356	background-color: transparent;
	357	border: none;
	358	}
	359
	360	treechildren::-moz-tree-cell-text(selected, editing) {
	361	color: inherit;
	362	}
	363
	364	.tree-input {
1d4ddf30	365	border: 1px solid #336699;
6daee013 RK	366	margin: 0;
6daee013 RK	367	-moz-margin-start: -4px;
1d4ddf30	368	padding: 1px;
1d4ddf30	369	}