The Tor Browser / annotate

browser/themes/windows/downloads/indicator.css@6474c204b198 (annotated)

browser/themes/windows/downloads/indicator.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 /*** Status and progress indicator ***/
michael@0 6
michael@0 7 #downloads-animation-container {
michael@0 8 min-height: 1px;
michael@0 9 min-width: 1px;
michael@0 10 height: 1px;
michael@0 11 margin-bottom: -1px;
michael@0 12 /* Makes the outermost animation container element positioned, so that its
michael@0 13 contents are rendered over the main browser window in the Z order.
michael@0 14 This is required by the animated event notification. */
michael@0 15 position: relative;
michael@0 16 /* The selected tab may overlap #downloads-indicator-notification */
michael@0 17 z-index: 5;
michael@0 18 }
michael@0 19
michael@0 20 /*** Main indicator icon ***/
michael@0 21
michael@0 22 #downloads-indicator-icon {
michael@0 23 background: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"),
michael@0 24 0, 198, 18, 180) center no-repeat;
michael@0 25 min-width: 18px;
michael@0 26 min-height: 18px;
michael@0 27 }
michael@0 28
michael@0 29 toolbar[brighttext] #downloads-button:not([attention]) > #downloads-indicator-anchor > #downloads-indicator-icon {
michael@0 30 background: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"),
michael@0 31 0, 198, 18, 180) center no-repeat;
michael@0 32 }
michael@0 33
michael@0 34 #downloads-button[attention] > #downloads-indicator-anchor > #downloads-indicator-icon {
michael@0 35 background-image: url("chrome://browser/skin/downloads/download-glow.png");
michael@0 36 }
michael@0 37
michael@0 38 #downloads-button[cui-areatype="menu-panel"][attention] {
michael@0 39 list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png");
michael@0 40 -moz-image-region: auto;
michael@0 41 }
michael@0 42
michael@0 43 %ifdef WINDOWS_AERO
michael@0 44 @media (-moz-os-version: windows-vista),
michael@0 45 (-moz-os-version: windows-win7) {
michael@0 46 %endif
michael@0 47 #downloads-button[attention] > #downloads-indicator-anchor > #downloads-indicator-icon {
michael@0 48 background-image: url("chrome://browser/skin/downloads/download-glow-XPVista7.png");
michael@0 49 }
michael@0 50
michael@0 51 #downloads-button[cui-areatype="menu-panel"][attention] {
michael@0 52 list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel-XPVista7.png");
michael@0 53 }
michael@0 54 %ifdef WINDOWS_AERO
michael@0 55 }
michael@0 56 %endif
michael@0 57
michael@0 58 /* In the next few rules, we use :not([counter]) as a shortcut that is
michael@0 59 equivalent to -moz-any([progress], [paused]). */
michael@0 60
michael@0 61 #downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
michael@0 62 background: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"),
michael@0 63 0, 198, 18, 180) center no-repeat;
michael@0 64 background-size: 12px;
michael@0 65 }
michael@0 66
michael@0 67 toolbar[brighttext] #downloads-button:not([counter]):not([attention]) > #downloads-indicator-anchor > #downloads-button-progress-area > #downloads-indicator-counter {
michael@0 68 background-image: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 0, 198, 18, 180);
michael@0 69 }
michael@0 70
michael@0 71 #downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
michael@0 72 background-image: url("chrome://browser/skin/downloads/download-glow.png");
michael@0 73 }
michael@0 74
michael@0 75 /*** Download notifications ***/
michael@0 76
michael@0 77 #downloads-indicator-notification {
michael@0 78 opacity: 0;
michael@0 79 background-size: 16px;
michael@0 80 background-position: center;
michael@0 81 background-repeat: no-repeat;
michael@0 82 width: 16px;
michael@0 83 height: 16px;
michael@0 84 }
michael@0 85
michael@0 86 @keyframes downloadsIndicatorNotificationStartRight {
michael@0 87 from { opacity: 0; transform: translate(-128px, 128px) scale(8); }
michael@0 88 20% { opacity: .85; animation-timing-function: ease-out; }
michael@0 89 to { opacity: 0; transform: translate(0) scale(1); }
michael@0 90 }
michael@0 91
michael@0 92 @keyframes downloadsIndicatorNotificationStartLeft {
michael@0 93 from { opacity: 0; transform: translate(128px, 128px) scale(8); }
michael@0 94 20% { opacity: .85; animation-timing-function: ease-out; }
michael@0 95 to { opacity: 0; transform: translate(0) scale(1); }
michael@0 96 }
michael@0 97
michael@0 98 #downloads-notification-anchor[notification="start"] > #downloads-indicator-notification {
michael@0 99 background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
michael@0 100 animation-name: downloadsIndicatorNotificationStartRight;
michael@0 101 animation-duration: 1s;
michael@0 102 }
michael@0 103
michael@0 104 #downloads-notification-anchor[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-notification {
michael@0 105 animation-name: downloadsIndicatorNotificationStartLeft;
michael@0 106 }
michael@0 107
michael@0 108 @keyframes downloadsIndicatorNotificationFinish {
michael@0 109 from { opacity: 0; transform: scale(1); }
michael@0 110 20% { opacity: .65; animation-timing-function: ease-in; }
michael@0 111 to { opacity: 0; transform: scale(8); }
michael@0 112 }
michael@0 113
michael@0 114 #downloads-notification-anchor[notification="finish"] > #downloads-indicator-notification {
michael@0 115 background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
michael@0 116 animation-name: downloadsIndicatorNotificationFinish;
michael@0 117 animation-duration: 1s;
michael@0 118 }
michael@0 119
michael@0 120 /*** Progress bar and text ***/
michael@0 121
michael@0 122 #downloads-indicator-counter {
michael@0 123 height: 9px;
michael@0 124 margin: -3px 0px 0px 0px;
michael@0 125 color: hsl(0,0%,30%);
michael@0 126 text-shadow: hsla(0,0%,100%,.5) 0 1px;
michael@0 127 font-size: 9px;
michael@0 128 line-height: 9px;
michael@0 129 text-align: center;
michael@0 130 }
michael@0 131
michael@0 132 toolbar[brighttext] #downloads-indicator-counter {
michael@0 133 color: white;
michael@0 134 text-shadow: 0 0 1px rgba(0,0,0,.7),
michael@0 135 0 1px 1.5px rgba(0,0,0,.5);
michael@0 136 }
michael@0 137
michael@0 138 #downloads-indicator-progress {
michael@0 139 width: 16px;
michael@0 140 height: 5px;
michael@0 141 min-width: 0;
michael@0 142 min-height: 0;
michael@0 143 margin-top: 1px;
michael@0 144 margin-bottom: 2px;
michael@0 145 border-radius: 2px;
michael@0 146 box-shadow: 0 1px 0 hsla(0,0%,100%,.4);
michael@0 147 }
michael@0 148
michael@0 149 #downloads-indicator-progress > .progress-bar {
michael@0 150 -moz-appearance: none;
michael@0 151 min-width: 0;
michael@0 152 min-height: 0;
michael@0 153 /* The background-clip: border-box; and background-image: none; are there to expand the background-color behind the border */
michael@0 154 background-clip: padding-box, border-box;
michael@0 155 background-color: rgb(90, 201, 66);
michael@0 156 background-image: linear-gradient(transparent 1px, rgba(255, 255, 255, 0.4) 1px, rgba(255, 255, 255, 0.4) 2px, transparent 2px), none;
michael@0 157 border: 1px solid;
michael@0 158 border-color: rgba(0,43,86,.6) rgba(0,43,86,.4) rgba(0,43,86,.4);
michael@0 159 border-radius: 2px 0 0 2px;
michael@0 160 }
michael@0 161
michael@0 162 #downloads-indicator-progress > .progress-remainder {
michael@0 163 -moz-appearance: none;
michael@0 164 min-width: 0;
michael@0 165 min-height: 0;
michael@0 166 background-image: linear-gradient(#505050, #575757);
michael@0 167 border: 1px solid;
michael@0 168 border-color: hsla(0,0%,0%,.6) hsla(0,0%,0%,.4) hsla(0,0%,0%,.4);
michael@0 169 -moz-border-start: none;
michael@0 170 border-radius: 0 2px 2px 0;
michael@0 171 }
michael@0 172
michael@0 173 #downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-bar {
michael@0 174 background-color: rgb(220, 230, 81);
michael@0 175 }
michael@0 176
michael@0 177 #downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-remainder {
michael@0 178 background-image: linear-gradient(#4b5000, #515700);
michael@0 179 }

Mercurial Repository: The Tor Browser

Europalab SCM Repository Server

mercurial