1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 2 * Use of this source code is governed by a BSD-style license that can be 3 * found in the LICENSE file. */ 4 5 html.loading * { 6 -webkit-transition-duration: 0 !important; 7 } 8 9 html:not(.focus-outline-visible) 10 :enabled:focus:-webkit-any(input[type='checkbox'], input[type='radio']) { 11 /* Cancel border-color for :focus specified in widgets.css. */ 12 border-color: rgba(0, 0, 0, 0.25); 13 } 14 15 .no-scroll { 16 overflow-y: hidden; 17 } 18 19 /* Developer mode */ 20 21 #dev-controls { 22 -webkit-margin-end: 20px; 23 -webkit-transition: padding 100ms, height 100ms, opacity 100ms; 24 border-bottom: 1px solid #eee; 25 height: 0; 26 opacity: 0; 27 overflow: hidden; 28 } 29 30 #dev-controls .buttons-container { 31 -webkit-padding-end: 3px; 32 -webkit-padding-start: 4px; 33 } 34 35 #dev-controls .buttons-container { 36 display: -webkit-box; 37 padding-top: 13px; 38 } 39 40 #dev-controls button { 41 white-space: nowrap; 42 } 43 44 #apps-developer-tools-promo { 45 -webkit-margin-before: 15px; 46 -webkit-padding-before: 5px; 47 -webkit-padding-end: 3px; 48 align-items: center; 49 border-top: 1px solid #eee; 50 display: flex; 51 font-size: 13px; 52 } 53 54 #apps-developer-tools-promo img { 55 content: url(apps_developer_tools_promo_48.png); 56 } 57 58 #apps-developer-tools-promo-text { 59 -webkit-margin-start: 5px; 60 } 61 62 #apps-developer-tools-promo-close-wrapper { 63 display: flex; 64 flex-grow: 1; 65 justify-content: flex-end; 66 } 67 68 #apps-developer-tools-promo .close-button { 69 background: url(chrome://theme/IDR_CLOSE_DIALOG) no-repeat center center; 70 border: 0; 71 height: 14px; 72 width: 14px; 73 z-index: 1; 74 } 75 76 #apps-developer-tools-promo .close-button:hover { 77 background-image: url(chrome://theme/IDR_CLOSE_DIALOG_H); 78 } 79 80 #apps-developer-tools-promo .close-button:active { 81 background-image: url(chrome://theme/IDR_CLOSE_DIALOG_P); 82 } 83 84 #extension-settings.dev-mode #dev-controls { 85 -webkit-transition-duration: 250ms; 86 height: 45px; 87 opacity: 1; 88 padding-bottom: 7px; 89 } 90 91 #extension-settings.dev-mode.adt-promo #dev-controls { 92 height: 105px; /* Allow more height for the Apps Developer Tools promo. */ 93 } 94 95 #dev-controls-spacer { 96 -webkit-box-flex: 1; 97 } 98 99 #dev-toggle { 100 margin-top: 0; 101 text-align: end; 102 } 103 104 .extension-code { 105 border: 1px solid #ccc; 106 display: flex; 107 font-family: monospace; 108 overflow: auto; 109 white-space: pre; 110 } 111 112 .extension-code > * { 113 padding: 3px; 114 } 115 116 .extension-code-line-numbers { 117 align-self: flex-start; 118 background-color: rgba(240, 240, 240, 1); 119 border-right: 1px solid #ccc; 120 color: rgba(128, 128, 128, 1); 121 flex-shrink: 0; 122 text-align: right; 123 } 124 125 #extension-settings:not(.dev-mode) .developer-extras { 126 display: none; 127 } 128 129 .developer-extras > div, 130 .permanent-warnings > div { 131 margin: 5px 0; 132 } 133 134 #extension-settings #page-header { 135 /* These values match the .page values. */ 136 -webkit-margin-end: 24px; 137 min-width: 576px; 138 } 139 140 /* Contents */ 141 142 #extension-settings { 143 max-width: 738px; 144 } 145 146 #no-extensions-message { 147 font-weight: bold; 148 } 149 150 #suggest-gallery { 151 -webkit-padding-start: 10px; 152 } 153 154 #footer-section { 155 background: url(chrome://theme/IDR_WEBSTORE_ICON_32) no-repeat left center; 156 background-size: 32px 32px; 157 font-size: 1.25em; 158 } 159 160 html[dir=rtl] #footer-section { 161 background: url(chrome://theme/IDR_WEBSTORE_ICON_32) no-repeat right center; 162 } 163 164 #footer-section > a { 165 -webkit-margin-start: 42px; 166 line-height: 32px; 167 } 168 169 .empty-extension-list { 170 height: 3em; 171 } 172 173 .loading #no-extensions, 174 .loading #footer-section, 175 #extension-settings-list:not(.empty-extension-list) ~ #no-extensions, 176 .empty-extension-list ~ #footer-section { 177 display: none; 178 } 179 180 .extension-list-item-wrapper { 181 margin: 23px 0; 182 } 183 184 .extension-list-item { 185 background-repeat: no-repeat; 186 display: -webkit-box; 187 min-height: 48px; 188 } 189 190 .extension-list-item a { 191 -webkit-margin-start: 0.5em; 192 display: inline-block; 193 } 194 195 html[dir='rtl'] .extension-list-item { 196 background-position: right; 197 } 198 199 .extension-title { 200 -webkit-padding-end: 20px; 201 color: rgb(48, 57, 66); 202 font-size: 14px; 203 font-weight: 500; 204 } 205 206 .inactive-extension .extension-title { 207 color: inherit; 208 } 209 210 .extension-version { 211 -webkit-padding-end: 7px; 212 font-size: 13px; 213 font-weight: 400; 214 } 215 216 .extension-description, 217 .corrupt-install-message { 218 -webkit-padding-end: 5px; 219 font-size: 13px; 220 margin: 5px 0; 221 white-space: normal; 222 } 223 224 .corrupt-install-message { 225 color: rgb(196, 42, 23); 226 } 227 228 .action-links { 229 -webkit-margin-after: 0.5em; 230 } 231 232 .action-links :-webkit-any(a, .link-button) { 233 -webkit-margin-end: 1em; 234 -webkit-margin-start: 0; 235 } 236 237 .extension-details { 238 -webkit-box-flex: 1; 239 -webkit-padding-end: 7px; 240 -webkit-padding-start: 55px; 241 } 242 243 .extension-description, 244 .extension-version, 245 .extension-list-item-wrapper.inactive-extension .extension-details, 246 .location-text, 247 .blacklist-text, 248 .enable-checkbox input:disabled + .enable-checkbox-text { 249 color: rgb(151, 156, 160); 250 } 251 252 .enable-controls { 253 /* Matches right: position of dev controls toggle. */ 254 -webkit-margin-end: 20px; 255 position: relative; 256 } 257 258 /* We use x.link-button here so that we get higher specifity than the 259 * link-button rules without resorting to the Dark Side (!IMPORTANT). */ 260 .terminated-reload-link.link-button, 261 .corrupted-repair-button.link-button { 262 /* Matches width of trash. */ 263 -webkit-margin-end: 30px; 264 } 265 266 .checkbox { 267 display: inline-block; 268 } 269 270 .enabled-text { 271 font-weight: bold; 272 } 273 274 .extension-list-item-wrapper.inactive-extension .enabled-text, 275 .extension-list-item-wrapper:not(.inactive-extension) .enable-text, 276 .extension-list-item-wrapper.inactive-extension .optional-controls, 277 .extension-list-item-wrapper.inactive-extension .butter-bar { 278 display: none; 279 } 280 281 .load-path > span { 282 word-wrap: break-word; 283 } 284 285 .terminated-reload-link, 286 .corrupted-repair-button { 287 display: inline-block; 288 padding-top: 7px; 289 } 290 291 .install-warnings a { 292 -webkit-margin-start: 0; 293 } 294 295 .butter-bar, 296 .install-warnings, 297 .extension-warnings { 298 border-radius: 3px; 299 margin-top: 5px; 300 padding: 2px 5px; 301 } 302 303 .butter-bar { 304 background: rgb(255, 242, 153); 305 } 306 307 .install-warnings, 308 .extension-warnings { 309 background: pink; 310 } 311 312 .install-warnings ul, 313 .extension-warnings ul { 314 margin: 0; 315 } 316 317 .error-collection-control { 318 -webkit-margin-start: 5px; 319 display: none; 320 } 321 322 #extension-settings.dev-mode .error-collection-control { 323 display: initial; 324 } 325 326 #font-measuring-div { 327 /* Remove from the flow and hide. */ 328 position: absolute; 329 visibility: hidden; 330 } 331 332 .extension-commands-config { 333 float: right; 334 } 335 336 html[dir=rtl] .extension-commands-config { 337 float: left; 338 } 339 340 /* Overlays */ 341 342 #overlay { 343 z-index: 5; 344 } 345 346 #overlay .page:not(.showing) { 347 display: none; 348 } 349 350 #drop-target-overlay { 351 color: rgb(48, 57, 66); 352 font-size: 18px; 353 text-align: center; 354 } 355 356 #drop-target-overlay div { 357 margin: 1em; 358 } 359 360 .location-text, 361 .blacklist-text { 362 display: block; 363 width: 100px; 364 } 365 366 /* Trash */ 367 368 #extension-settings .trash { 369 -webkit-transition: opacity 200ms; 370 height: 22px; 371 opacity: 0.8; 372 position: relative; 373 right: 0; 374 top: 6px; 375 } 376 377 html[dir='rtl'] #extension-settings .trash { 378 left: 0; 379 right: auto; 380 } 381 382 .extension-list-item:not(:hover) .trash:not(:focus) { 383 opacity: 0; 384 } 385 386 .extension-list-item-wrapper.may-not-remove .trash { 387 visibility: hidden; 388 } 389 390 .extension-highlight { 391 background: rgb(238, 238, 238); 392 background-position: auto; 393 background-repeat: auto; 394 border-radius: 3px; 395 padding: 5px 0 5px 5px; 396 } 397 398 /* Supervised users */ 399 400 .page:not(.profile-is-supervised) .profile-is-supervised-banner, 401 .profile-is-supervised .more-extensions-link { 402 display: none; 403 } 404 405 .profile-is-supervised-banner .page-banner-text { 406 background-image: url(chrome://theme/IDR_WARNING); 407 } 408 409 /* Sideload Wipeout */ 410 411 .sideload-wipeout-learn-more { 412 text-decoration: none; 413 } 414 415 .sideload-wipeout-banner .page-banner-text { 416 -webkit-padding-start: 8px; 417 background-image: none; 418 } 419