browser/themes/windows/browser-aero.css

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

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

mercurial