The Tor Browser / file comparison
comparison: toolkit/themes/linux/global/tree.css
toolkit/themes/linux/global/tree.css
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:4665991f672f |
|---|---|
| 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/. */ | |
| 4 | |
| 5 /* ===== tree.css =================================================== | |
| 6 == Styles used by the XUL outline element. | |
| 7 ======================================================================= */ | |
| 8 | |
| 9 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); | |
| 10 | |
| 11 /* ::::: tree ::::: */ | |
| 12 | |
| 13 tree { | |
| 14 margin: 0px 4px; | |
| 15 border: 2px solid; | |
| 16 -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow; | |
| 17 -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow; | |
| 18 -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow; | |
| 19 -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow; | |
| 20 background-color: -moz-Field; | |
| 21 color: -moz-FieldText; | |
| 22 -moz-appearance: listbox; | |
| 23 } | |
| 24 | |
| 25 /* ::::: tree focusring ::::: */ | |
| 26 | |
| 27 .focusring > .tree-stack > .tree-rows > .tree-bodybox { | |
| 28 border: 1px solid transparent; | |
| 29 } | |
| 30 | |
| 31 .focusring:focus > .tree-stack > .tree-rows > .tree-bodybox { | |
| 32 border: 1px solid #000000; | |
| 33 } | |
| 34 | |
| 35 | |
| 36 /* ::::: tree rows ::::: */ | |
| 37 | |
| 38 treechildren::-moz-tree-row { | |
| 39 border: 1px solid transparent; | |
| 40 min-height: 18px; | |
| 41 height: 1.3em; | |
| 42 } | |
| 43 | |
| 44 treechildren:not(.autocomplete-treebody)::-moz-tree-row(multicol, odd) { | |
| 45 background-color: -moz-oddtreerow; | |
| 46 } | |
| 47 | |
| 48 treechildren:not(.autocomplete-treebody)::-moz-tree-row(selected) { | |
| 49 background-color: -moz-cellhighlight; | |
| 50 } | |
| 51 | |
| 52 treechildren:not(.autocomplete-treebody)::-moz-tree-row(selected, focus) { | |
| 53 background-color: Highlight; | |
| 54 } | |
| 55 | |
| 56 treechildren::-moz-tree-row(current, focus) { | |
| 57 border: 1px dotted Highlight; | |
| 58 } | |
| 59 | |
| 60 treechildren::-moz-tree-row(selected, current, focus) { | |
| 61 border: 1px dotted #F3D982; | |
| 62 } | |
| 63 | |
| 64 tree[seltype="cell"] > treechildren::-moz-tree-row, | |
| 65 tree[seltype="text"] > treechildren::-moz-tree-row { | |
| 66 border: none; | |
| 67 background-color: transparent; | |
| 68 } | |
| 69 | |
| 70 /* ::::: tree cells ::::: */ | |
| 71 | |
| 72 treechildren::-moz-tree-cell { | |
| 73 padding: 0px 2px 0px 2px; | |
| 74 } | |
| 75 | |
| 76 tree[seltype="cell"] > treechildren::-moz-tree-cell-text, | |
| 77 tree[seltype="text"] > treechildren::-moz-tree-cell-text, | |
| 78 treechildren::-moz-tree-cell-text { | |
| 79 color: inherit; | |
| 80 } | |
| 81 | |
| 82 treechildren::-moz-tree-cell-text(selected) { | |
| 83 color: -moz-cellhighlighttext; | |
| 84 } | |
| 85 | |
| 86 tree[seltype="cell"] > treechildren::-moz-tree-cell { | |
| 87 border: 1px solid transparent; | |
| 88 padding: 0px 1px 0px 1px; | |
| 89 } | |
| 90 | |
| 91 tree[seltype="text"] > treechildren::-moz-tree-cell-text { | |
| 92 border: 1px solid transparent; | |
| 93 padding: 0px 1px 1px 1px; | |
| 94 } | |
| 95 | |
| 96 tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected) { | |
| 97 background-color: -moz-cellhighlight; | |
| 98 } | |
| 99 tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected) { | |
| 100 color: -moz-cellhighlighttext; | |
| 101 } | |
| 102 | |
| 103 tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected) { | |
| 104 background-color: -moz-cellhighlight; | |
| 105 color: -moz-cellhighlighttext; | |
| 106 } | |
| 107 | |
| 108 treechildren::-moz-tree-cell-text(selected, focus) { | |
| 109 color: HighlightText; | |
| 110 } | |
| 111 | |
| 112 tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, focus) { | |
| 113 background-color: Highlight; | |
| 114 } | |
| 115 | |
| 116 tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) { | |
| 117 background-color: Highlight; | |
| 118 } | |
| 119 | |
| 120 tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected, focus) { | |
| 121 color: HighlightText; | |
| 122 } | |
| 123 | |
| 124 tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) { | |
| 125 color: HighlightText; | |
| 126 } | |
| 127 | |
| 128 tree[seltype="cell"] > treechildren::-moz-tree-cell(active, current, focus) { | |
| 129 border: 1px dotted #000000; | |
| 130 } | |
| 131 | |
| 132 tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, current, focus) { | |
| 133 border: 1px dotted #000000; | |
| 134 } | |
| 135 | |
| 136 tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, current, focus) { | |
| 137 border: 1px dotted #C0C0C0; | |
| 138 } | |
| 139 | |
| 140 tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, current, focus) { | |
| 141 border: 1px dotted #C0C0C0; | |
| 142 } | |
| 143 | |
| 144 /* ::::: lines connecting cells ::::: */ | |
| 145 | |
| 146 tree[seltype="cell"] > treechildren::-moz-tree-line, | |
| 147 tree[seltype="text"] > treechildren::-moz-tree-line, | |
| 148 treechildren::-moz-tree-line { | |
| 149 border: 1px dotted ThreeDShadow; | |
| 150 } | |
| 151 | |
| 152 tree[seltype="cell"] > treechildren::-moz-tree-line(active, selected, focus), | |
| 153 treechildren::-moz-tree-line(selected, focus) { | |
| 154 border: 1px dotted HighlightText; | |
| 155 } | |
| 156 | |
| 157 | |
| 158 /* ::::: tree separator ::::: */ | |
| 159 | |
| 160 treechildren::-moz-tree-separator { | |
| 161 border-top: 1px solid ThreeDShadow; | |
| 162 border-bottom: 1px solid ThreeDHighlight; | |
| 163 } | |
| 164 | |
| 165 | |
| 166 /* ::::: drop feedback ::::: */ | |
| 167 | |
| 168 tree[seltype="cell"] > treechildren::-moz-tree-cell-text(primary, dropOn), | |
| 169 tree[seltype="text"] > treechildren::-moz-tree-cell-text(primary, dropOn), | |
| 170 treechildren::-moz-tree-cell-text(primary, dropOn) { | |
| 171 background-color: Highlight; | |
| 172 color: HighlightText; | |
| 173 } | |
| 174 | |
| 175 treechildren::-moz-tree-drop-feedback { | |
| 176 background-color: Highlight; | |
| 177 width: 50px; | |
| 178 height: 2px; | |
| 179 -moz-margin-start: 5px; | |
| 180 } | |
| 181 | |
| 182 /* ::::: tree progress meter ::::: */ | |
| 183 | |
| 184 treechildren::-moz-tree-progressmeter { | |
| 185 margin: 2px 4px; | |
| 186 padding: 1px; | |
| 187 border: 1px solid; | |
| 188 border-top-color: ThreeDShadow; | |
| 189 border-right-color: ThreeDHighlight; | |
| 190 border-bottom-color: ThreeDHighlight; | |
| 191 border-left-color: ThreeDShadow; | |
| 192 background-color: -moz-Dialog; | |
| 193 color: ThreeDShadow; | |
| 194 } | |
| 195 | |
| 196 treechildren::-moz-tree-progressmeter(progressUndetermined) { | |
| 197 list-style-image: url("chrome://global/skin/progressmeter/progressmeter-busy.gif"); | |
| 198 } | |
| 199 | |
| 200 treechildren::-moz-tree-cell-text(progressmeter) { | |
| 201 margin: 2px 4px; | |
| 202 } | |
| 203 | |
| 204 /* ::::: tree columns ::::: */ | |
| 205 | |
| 206 treecol, | |
| 207 treecolpicker { | |
| 208 -moz-appearance: treeheadercell; | |
| 209 -moz-box-align: center; | |
| 210 -moz-box-pack: center; | |
| 211 border: 2px solid; | |
| 212 -moz-border-top-colors: ThreeDHighlight ThreeDLightShadow; | |
| 213 -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow; | |
| 214 -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow; | |
| 215 -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow; | |
| 216 background-color: -moz-Dialog; | |
| 217 color: -moz-DialogText; | |
| 218 padding: 0px 2px; | |
| 219 } | |
| 220 | |
| 221 treecol:hover, | |
| 222 treecolpicker:hover { | |
| 223 color: -moz-buttonhovertext; | |
| 224 } | |
| 225 | |
| 226 .treecol-image { | |
| 227 padding: 0px 1px; | |
| 228 } | |
| 229 | |
| 230 .treecol-text { | |
| 231 margin: 0px !important; | |
| 232 } | |
| 233 | |
| 234 treecol[hideheader="true"] { | |
| 235 -moz-appearance: none; | |
| 236 border: none; | |
| 237 padding: 0; | |
| 238 } | |
| 239 | |
| 240 /* ..... internal box ..... */ | |
| 241 | |
| 242 treecol:hover:active, | |
| 243 treecolpicker:hover:active { | |
| 244 color: ButtonText; | |
| 245 border: 2px solid; | |
| 246 -moz-border-top-colors: ThreeDShadow -moz-Dialog; | |
| 247 -moz-border-right-colors: ThreeDShadow transparent; | |
| 248 -moz-border-bottom-colors: ThreeDShadow transparent; | |
| 249 -moz-border-left-colors: ThreeDShadow -moz-Dialog; | |
| 250 padding-top: 0px; | |
| 251 padding-bottom: 0px; | |
| 252 -moz-padding-start: 3px; | |
| 253 -moz-padding-end: 1px; | |
| 254 } | |
| 255 | |
| 256 .treecol-image:hover:active { | |
| 257 padding: 0px; | |
| 258 -moz-padding-start: 2px; | |
| 259 } | |
| 260 | |
| 261 treecol:hover:active .treecol-text { | |
| 262 margin: 1px 0px -1px 0px !important; | |
| 263 } | |
| 264 | |
| 265 /* ::::: column drag and drop styles ::::: */ | |
| 266 | |
| 267 treecol[dragging="true"] { | |
| 268 -moz-border-top-colors: ThreeDDarkShadow transparent !important; | |
| 269 -moz-border-right-colors: ThreeDDarkShadow transparent!important; | |
| 270 -moz-border-bottom-colors: ThreeDDarkShadow transparent !important; | |
| 271 -moz-border-left-colors: ThreeDDarkShadow transparent !important; | |
| 272 background-color: ThreeDShadow !important; | |
| 273 color: ThreeDHighlight !important; | |
| 274 } | |
| 275 | |
| 276 treecol[insertafter="true"]:-moz-locale-dir(ltr), | |
| 277 treecol[insertbefore="true"]:-moz-locale-dir(rtl) { | |
| 278 -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow; | |
| 279 } | |
| 280 | |
| 281 treecol[insertafter="true"]:-moz-locale-dir(rtl), | |
| 282 treecol[insertbefore="true"]:-moz-locale-dir(ltr) { | |
| 283 -moz-border-left-colors: ThreeDDarkShadow ThreeDShadow; | |
| 284 } | |
| 285 | |
| 286 treechildren::-moz-tree-column(insertbefore) { | |
| 287 -moz-border-start: 1px solid ThreeDShadow; | |
| 288 } | |
| 289 | |
| 290 treechildren::-moz-tree-column(insertafter) { | |
| 291 -moz-border-end: 1px solid ThreeDShadow; | |
| 292 } | |
| 293 | |
| 294 /* ::::: sort direction indicator ::::: */ | |
| 295 | |
| 296 .treecol-sortdirection { | |
| 297 -moz-appearance: treeheadersortarrow; | |
| 298 } | |
| 299 | |
| 300 /* ::::: column picker ::::: */ | |
| 301 | |
| 302 .tree-columnpicker-icon { | |
| 303 list-style-image: url("chrome://global/skin/tree/columnpicker.gif"); | |
| 304 } | |
| 305 | |
| 306 /* ::::: twisty ::::: */ | |
| 307 | |
| 308 treechildren::-moz-tree-twisty { | |
| 309 -moz-appearance: treetwisty; | |
| 310 -moz-padding-end: 4px; | |
| 311 padding-top: 1px; | |
| 312 width: 9px; /* The image's width is 9 pixels */ | |
| 313 list-style-image: url("chrome://global/skin/tree/twisty-clsd.png"); | |
| 314 } | |
| 315 | |
| 316 treechildren::-moz-tree-twisty(open) { | |
| 317 -moz-appearance: treetwistyopen; | |
| 318 width: 9px; /* The image's width is 9 pixels */ | |
| 319 list-style-image: url("chrome://global/skin/tree/twisty-open.png"); | |
| 320 } | |
| 321 | |
| 322 treechildren::-moz-tree-indentation { | |
| 323 width: 18px; | |
| 324 } | |
| 325 | |
| 326 /* ::::: gridline style ::::: */ | |
| 327 | |
| 328 treechildren.gridlines::-moz-tree-cell { | |
| 329 border-right: 1px solid transparent !important; | |
| 330 border-bottom: 1px solid transparent !important; | |
| 331 } | |
| 332 | |
| 333 treechildren.gridlines::-moz-tree-row { | |
| 334 border: none; | |
| 335 } | |
| 336 | |
| 337 /* ::::: editable tree ::::: */ | |
| 338 | |
| 339 treechildren::-moz-tree-row(selected, editing) { | |
| 340 background-color: transparent; | |
| 341 border: none; | |
| 342 } | |
| 343 | |
| 344 treechildren::-moz-tree-cell-text(selected, editing) { | |
| 345 color: inherit; | |
| 346 } | |
| 347 | |
| 348 .tree-input { | |
| 349 -moz-appearance: none; | |
| 350 border: 1px solid Highlight; | |
| 351 -moz-border-top-colors: Highlight; | |
| 352 -moz-border-bottom-colors: Highlight; | |
| 353 -moz-border-left-colors: Highlight; | |
| 354 -moz-border-right-colors: Highlight; | |
| 355 margin: 0; | |
| 356 -moz-margin-start: -4px; | |
| 357 padding: 1px; | |
| 358 } |
