The Tor Browser / file comparison
comparison: browser/themes/windows/browser-aero.css
browser/themes/windows/browser-aero.css
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:62bc0711ac92 |
|---|---|
| 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 %define WINDOWS_AERO | |
| 6 %include browser.css | |
| 7 %undef WINDOWS_AERO | |
| 8 | |
| 9 %define glassActiveBorderColor rgb(37, 44, 51) | |
| 10 %define glassInactiveBorderColor rgb(102, 102, 102) | |
| 11 | |
| 12 %include downloads/indicator-aero.css | |
| 13 | |
| 14 @media not all and (-moz-windows-classic) { | |
| 15 #main-window[sizemode="normal"] > #tab-view-deck > #browser-panel > #navigator-toolbox > #toolbar-menubar { | |
| 16 margin-top: 1px; | |
| 17 } | |
| 18 | |
| 19 .panel-promo-message { | |
| 20 font-style: italic; | |
| 21 } | |
| 22 } | |
| 23 | |
| 24 @media (-moz-windows-default-theme) { | |
| 25 .sidebar-header, | |
| 26 #sidebar-header { | |
| 27 -moz-appearance: none; | |
| 28 color: black; | |
| 29 background-color: #EEF3FA; | |
| 30 border-bottom: none; | |
| 31 text-shadow: none; | |
| 32 } | |
| 33 | |
| 34 .sidebar-title, | |
| 35 #sidebar-title { | |
| 36 font-weight: bold; | |
| 37 } | |
| 38 | |
| 39 .sidebar-splitter { | |
| 40 border: 0; | |
| 41 -moz-border-end: 1px solid #A9B7C9; | |
| 42 min-width: 0; | |
| 43 width: 3px; | |
| 44 background-color: transparent; | |
| 45 -moz-margin-start: -3px; | |
| 46 position: relative; | |
| 47 } | |
| 48 | |
| 49 #appcontent ~ .sidebar-splitter { | |
| 50 -moz-border-start: 1px solid #A9B7C9; | |
| 51 -moz-border-end: none; | |
| 52 -moz-margin-start: 0; | |
| 53 -moz-margin-end: -3px; | |
| 54 } | |
| 55 | |
| 56 #urlbar:not(:-moz-lwtheme), | |
| 57 .searchbar-textbox:not(:-moz-lwtheme) { | |
| 58 border-color: hsla(210,54%,20%,.25) hsla(210,54%,20%,.27) hsla(210,54%,20%,.3); | |
| 59 box-shadow: 0 1px 0 hsla(0,0%,0%,.01) inset, | |
| 60 0 1px 0 hsla(0,0%,100%,.1); | |
| 61 } | |
| 62 | |
| 63 #urlbar:not(:-moz-lwtheme)[focused], | |
| 64 .searchbar-textbox:not(:-moz-lwtheme)[focused] { | |
| 65 border-color: Highlight; | |
| 66 } | |
| 67 | |
| 68 .menu-accel, | |
| 69 .menu-iconic-accel { | |
| 70 color: graytext; | |
| 71 } | |
| 72 | |
| 73 .chatbar-button, | |
| 74 chatbar > chatbox { | |
| 75 border-color: #A9B7C9; | |
| 76 } | |
| 77 | |
| 78 @media (-moz-os-version: windows-vista), | |
| 79 (-moz-os-version: windows-win7) { | |
| 80 #navigator-toolbox > toolbar:not(:-moz-lwtheme), | |
| 81 #browser-bottombox:not(:-moz-lwtheme), | |
| 82 .browserContainer > findbar { | |
| 83 background-color: @customToolbarColor@; | |
| 84 } | |
| 85 | |
| 86 .tab-background-middle[selected=true]:not(:-moz-lwtheme) { | |
| 87 background-color: @customToolbarColor@; | |
| 88 } | |
| 89 | |
| 90 #navigator-toolbox:not(:-moz-lwtheme)::after { | |
| 91 background-color: #aabccf; | |
| 92 } | |
| 93 | |
| 94 #urlbar:not(:-moz-lwtheme):not([focused]):hover, | |
| 95 .searchbar-textbox:not(:-moz-lwtheme):not([focused]):hover { | |
| 96 border-color: hsla(210,54%,20%,.35) hsla(210,54%,20%,.37) hsla(210,54%,20%,.4); | |
| 97 } | |
| 98 | |
| 99 #urlbar:not(:-moz-lwtheme)[focused], | |
| 100 .searchbar-textbox:not(:-moz-lwtheme)[focused] { | |
| 101 border-color: hsla(206,100%,60%,.65) hsla(206,100%,55%,.65) hsla(206,100%,50%,.65); | |
| 102 } | |
| 103 } | |
| 104 } | |
| 105 | |
| 106 @media (-moz-windows-compositor) { | |
| 107 /* These should be hidden w/ glass enabled. Windows draws its own buttons. */ | |
| 108 .titlebar-button { | |
| 109 display: none; | |
| 110 } | |
| 111 | |
| 112 #main-window[sizemode="maximized"] #titlebar-buttonbox { | |
| 113 -moz-margin-end: 3px; | |
| 114 } | |
| 115 | |
| 116 #main-window { | |
| 117 -moz-appearance: -moz-win-borderless-glass; | |
| 118 background: transparent; | |
| 119 } | |
| 120 | |
| 121 #appcontent { | |
| 122 -moz-appearance: -moz-win-exclude-glass; | |
| 123 } | |
| 124 | |
| 125 /* Artificially draw window borders that are covered by lwtheme, see bug 591930. */ | |
| 126 #main-window[sizemode="normal"] > #titlebar > #titlebar-content:-moz-lwtheme { | |
| 127 border-top: 2px solid; | |
| 128 -moz-border-top-colors: @glassActiveBorderColor@ rgba(255,255,255,.6); | |
| 129 } | |
| 130 | |
| 131 #main-window[sizemode="normal"] > #titlebar > #titlebar-content:-moz-lwtheme:-moz-window-inactive { | |
| 132 -moz-border-top-colors: @glassInactiveBorderColor@ rgba(255,255,255,.6); | |
| 133 } | |
| 134 | |
| 135 #main-window[sizemode="normal"] #titlebar-buttonbox:-moz-lwtheme { | |
| 136 margin-top: -2px; | |
| 137 } | |
| 138 | |
| 139 @media (-moz-windows-default-theme) { | |
| 140 #toolbar-menubar:not(:-moz-lwtheme), | |
| 141 #TabsToolbar:not(:-moz-lwtheme) { | |
| 142 background-color: transparent !important; | |
| 143 color: black; | |
| 144 } | |
| 145 | |
| 146 #main-menubar > menu:not(:-moz-lwtheme) { | |
| 147 color: inherit; | |
| 148 } | |
| 149 | |
| 150 /* Use a different color only on Windows 8 and higher for inactive windows. | |
| 151 * On aero, the menubar fog disappears for inactive windows, and renders gray | |
| 152 * illegible. | |
| 153 */ | |
| 154 @media not all and (-moz-os-version: windows-vista) { | |
| 155 @media not all and (-moz-os-version: windows-win7) { | |
| 156 #toolbar-menubar:not(:-moz-lwtheme):-moz-window-inactive { | |
| 157 color: ThreeDShadow; | |
| 158 } | |
| 159 } | |
| 160 } | |
| 161 } | |
| 162 | |
| 163 #main-window[darkwindowframe="true"] #toolbar-menubar:not(:-moz-lwtheme):not(:-moz-window-inactive), | |
| 164 #main-window[darkwindowframe="true"] #TabsToolbar:not(:-moz-lwtheme):not(:-moz-window-inactive) { | |
| 165 color: white; | |
| 166 } | |
| 167 | |
| 168 #toolbar-menubar:not(:-moz-lwtheme) { | |
| 169 text-shadow: 0 0 .5em white, 0 0 .5em white, 0 1px 0 rgba(255,255,255,.4); | |
| 170 } | |
| 171 | |
| 172 /* Vertical toolbar border */ | |
| 173 #main-window[sizemode=normal] #navigator-toolbox::after, | |
| 174 #main-window[sizemode=normal] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) { | |
| 175 border-left: 1px solid @toolbarShadowColor@; | |
| 176 border-right: 1px solid @toolbarShadowColor@; | |
| 177 background-clip: padding-box; | |
| 178 } | |
| 179 #main-window[sizemode=normal] #browser-border-start, | |
| 180 #main-window[sizemode=normal] #browser-border-end { | |
| 181 display: -moz-box; | |
| 182 background-color: @toolbarShadowColor@; | |
| 183 width: 1px; | |
| 184 } | |
| 185 #main-window[sizemode=normal] #browser-bottombox { | |
| 186 border: 1px solid @toolbarShadowColor@; | |
| 187 border-top-style: none; | |
| 188 background-clip: padding-box; | |
| 189 } | |
| 190 | |
| 191 /* Toolbar shadow behind tabs */ | |
| 192 #nav-bar { | |
| 193 border-top: 1px solid @toolbarShadowColor@ !important; | |
| 194 background-clip: padding-box; | |
| 195 } | |
| 196 | |
| 197 /* This code is only needed for restored windows (i.e. sizemode=normal) | |
| 198 because of the border radius on the toolbar below the tab bar. */ | |
| 199 #main-window[sizemode=normal] #nav-bar { | |
| 200 border-top: 1px solid @toolbarShadowColor@; | |
| 201 background-clip: padding-box; | |
| 202 } | |
| 203 | |
| 204 /* Cover the top border of the adjacent toolbar */ | |
| 205 #TabsToolbar { | |
| 206 margin-bottom: -1px; | |
| 207 } | |
| 208 | |
| 209 #main-window[sizemode=normal] #TabsToolbar { | |
| 210 padding-left: 1px; | |
| 211 padding-right: 1px; | |
| 212 } | |
| 213 | |
| 214 /* Make the window draggable by glassed toolbars (bug 555081) */ | |
| 215 #toolbar-menubar:not([autohide="true"]), | |
| 216 #TabsToolbar, | |
| 217 #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#addon-bar):-moz-lwtheme { | |
| 218 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar-drag"); | |
| 219 } | |
| 220 | |
| 221 #appcontent:not(:-moz-lwtheme) { | |
| 222 background-color: -moz-dialog; | |
| 223 } | |
| 224 | |
| 225 #main-menubar:not(:-moz-lwtheme):not(:-moz-window-inactive) { | |
| 226 background-color: rgba(255,255,255,.5); | |
| 227 color: black; | |
| 228 } | |
| 229 | |
| 230 @media (-moz-os-version: windows-vista), | |
| 231 (-moz-os-version: windows-win7) { | |
| 232 #main-window[sizemode=normal] #nav-bar { | |
| 233 border-top-left-radius: 2.5px; | |
| 234 border-top-right-radius: 2.5px; | |
| 235 } | |
| 236 | |
| 237 #main-menubar:not(:-moz-lwtheme):not(:-moz-window-inactive) { | |
| 238 border-radius: 4px; | |
| 239 } | |
| 240 } | |
| 241 | |
| 242 #ctrlTab-panel { | |
| 243 background: transparent; | |
| 244 -moz-appearance: -moz-win-glass; | |
| 245 border-radius: 0; | |
| 246 border: none; | |
| 247 font: normal 1.2em "Segoe UI"; | |
| 248 color: black; | |
| 249 text-shadow: white -1px -1px .35em, white -1px 1px .35em, white 1px 1px .35em, white 1px -1px .35em; | |
| 250 } | |
| 251 | |
| 252 #tab-view:-moz-lwtheme { | |
| 253 background-image: url("chrome://browser/skin/tabview/grain.png"), | |
| 254 linear-gradient(rgba(255,255,255,0), #CCD9EA 200px, #C7D5E7); | |
| 255 background-attachment: fixed; | |
| 256 } | |
| 257 } | |
| 258 | |
| 259 @media (-moz-windows-glass) { | |
| 260 #main-window[sizemode=fullscreen]:not(:-moz-lwtheme) { | |
| 261 -moz-appearance: none; | |
| 262 background-color: #556; | |
| 263 } | |
| 264 | |
| 265 /* Glass Fog */ | |
| 266 | |
| 267 #TabsToolbar:not(:-moz-lwtheme) { | |
| 268 background-image: none; | |
| 269 position: relative; | |
| 270 } | |
| 271 | |
| 272 #TabsToolbar:not(:-moz-lwtheme)::after { | |
| 273 /* Because we use placeholders for window controls etc. in the tabstrip, | |
| 274 * and position those with ordinal attributes, and because our layout code | |
| 275 * expects :before/:after nodes to come first/last in the frame list, | |
| 276 * we have to reorder this element to come last, hence the | |
| 277 * ordinal group value (see bug 853415). */ | |
| 278 -moz-box-ordinal-group: 1001; | |
| 279 box-shadow: 0 0 30px 30px rgba(174,189,204,0.85); | |
| 280 content: ""; | |
| 281 display: -moz-box; | |
| 282 height: 0; | |
| 283 margin: 0 60px; /* (30px + 30px) from box-shadow */ | |
| 284 position: absolute; | |
| 285 pointer-events: none; | |
| 286 top: 50%; | |
| 287 width: -moz-available; | |
| 288 z-index: -1; | |
| 289 } | |
| 290 | |
| 291 /* Need to constrain the glass fog to avoid overlapping layers, see bug 886281. */ | |
| 292 #navigator-toolbox:not(:-moz-lwtheme) { | |
| 293 overflow: -moz-hidden-unscrollable; | |
| 294 } | |
| 295 | |
| 296 #main-window[sizemode=normal] .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox > .scrollbox-innerbox:not(:-moz-lwtheme) { | |
| 297 position: relative; | |
| 298 } | |
| 299 | |
| 300 /* End Glass Fog */ | |
| 301 } | |
| 302 | |
| 303 | |
| 304 @media not all and (-moz-windows-compositor) { | |
| 305 @media (-moz-windows-default-theme) { | |
| 306 #main-window { | |
| 307 background-color: rgb(185,209,234); | |
| 308 } | |
| 309 #main-window:-moz-window-inactive { | |
| 310 background-color: rgb(215,228,242); | |
| 311 } | |
| 312 | |
| 313 #toolbar-menubar:not([autohide=true]):not(:-moz-lwtheme), | |
| 314 #TabsToolbar:not(:-moz-lwtheme) { | |
| 315 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar-drag"); | |
| 316 background-color: transparent; | |
| 317 } | |
| 318 #toolbar-menubar[autohide=true] { | |
| 319 background-color: transparent !important; | |
| 320 } | |
| 321 | |
| 322 /* Render a window top border for lwthemes: */ | |
| 323 #main-window[tabsintitlebar][sizemode="normal"] #titlebar-content:-moz-lwtheme { | |
| 324 background-image: linear-gradient(to bottom, | |
| 325 @glassActiveBorderColor@ 0, @glassActiveBorderColor@ 1px, | |
| 326 rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px); | |
| 327 } | |
| 328 | |
| 329 #main-window[tabsintitlebar][sizemode="normal"] #titlebar-content:-moz-lwtheme:-moz-window-inactive { | |
| 330 background-image: linear-gradient(to bottom, | |
| 331 @glassInactiveBorderColor@ 0, @glassInactiveBorderColor@ 1px, | |
| 332 rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px); | |
| 333 } | |
| 334 } | |
| 335 | |
| 336 #print-preview-toolbar:not(:-moz-lwtheme) { | |
| 337 -moz-appearance: -moz-win-browsertabbar-toolbox; | |
| 338 } | |
| 339 } | |
| 340 | |
| 341 /* Win8 and beyond. */ | |
| 342 @media not all and (-moz-os-version: windows-vista) { | |
| 343 @media not all and (-moz-os-version: windows-win7) { | |
| 344 /* Introducing an additional hover state for the Bookmark button */ | |
| 345 #nav-bar .toolbarbutton-1[buttonover] > .toolbarbutton-menubutton-button:hover > .toolbarbutton-icon { | |
| 346 background-color: hsla(210,4%,10%,.08); | |
| 347 border-color: hsla(210,4%,10%,.1); | |
| 348 } | |
| 349 } | |
| 350 } | |
| 351 | |
| 352 /* ::::: fullscreen window controls ::::: */ | |
| 353 | |
| 354 #window-controls { | |
| 355 -moz-box-align: start; | |
| 356 } | |
| 357 | |
| 358 #minimize-button, | |
| 359 #restore-button, | |
| 360 #close-button { | |
| 361 -moz-appearance: none; | |
| 362 border-style: none; | |
| 363 margin: 0; | |
| 364 } | |
| 365 #close-button { | |
| 366 -moz-image-region: rect(0, 49px, 16px, 32px); | |
| 367 } | |
| 368 #close-button:hover { | |
| 369 -moz-image-region: rect(16px, 49px, 32px, 32px); | |
| 370 } | |
| 371 #close-button:hover:active { | |
| 372 -moz-image-region: rect(32px, 49px, 48px, 32px); | |
| 373 } | |
| 374 | |
| 375 #minimize-button:-moz-locale-dir(rtl), | |
| 376 #restore-button:-moz-locale-dir(rtl), | |
| 377 #close-button:-moz-locale-dir(rtl) { | |
| 378 transform: scaleX(-1); | |
| 379 } | |
| 380 | |
| 381 /* ::::: private browsing indicator ::::: */ | |
| 382 | |
| 383 @media (-moz-os-version: windows-vista), | |
| 384 (-moz-os-version: windows-win7) { | |
| 385 #TabsToolbar > .private-browsing-indicator { | |
| 386 background-image: url("chrome://browser/skin/privatebrowsing-mask-tabstrip-XPVista7.png"); | |
| 387 } | |
| 388 | |
| 389 /* We're intentionally using the titlebar asset here for fullscreen mode. | |
| 390 * See bug 1008183. | |
| 391 */ | |
| 392 #private-browsing-indicator-titlebar > .private-browsing-indicator, | |
| 393 #main-window[inFullscreen] #TabsToolbar > .private-browsing-indicator { | |
| 394 background-image: url("chrome://browser/skin/privatebrowsing-mask-titlebar-XPVista7.png"); | |
| 395 } | |
| 396 } | |
| 397 | |
| 398 @media (-moz-windows-glass) { | |
| 399 #main-window[sizemode="normal"] > #titlebar > #titlebar-content > #titlebar-buttonbox-container > #private-browsing-indicator-titlebar > .private-browsing-indicator { | |
| 400 top: 1px; | |
| 401 } | |
| 402 #main-window[sizemode="maximized"] > #titlebar > #titlebar-content > #titlebar-buttonbox-container > #private-browsing-indicator-titlebar > .private-browsing-indicator { | |
| 403 top: -1px; | |
| 404 } | |
| 405 } | |
| 406 | |
| 407 /** | |
| 408 * This next block targets Aero Basic, which has different positioning for the | |
| 409 * window caption buttons, and therefore needs to be special-cased. | |
| 410 */ | |
| 411 @media (-moz-windows-default-theme) { | |
| 412 @media not all and (-moz-windows-compositor) { | |
| 413 #main-window[sizemode="normal"] > #titlebar > #titlebar-content > #titlebar-buttonbox-container > #private-browsing-indicator-titlebar > .private-browsing-indicator { | |
| 414 background-image: url("chrome://browser/skin/privatebrowsing-mask-titlebar-XPVista7-tall.png"); | |
| 415 height: 28px; | |
| 416 } | |
| 417 } | |
| 418 } |
