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