chrome/browser/resources/extensions/extensions.css

   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 #apps-dev-tool-banner {
  32   -webkit-padding-end: 3px;
  33   -webkit-padding-start: 4px;
  34 }
  35
  36 #dev-controls .buttons-container {
  37   display: -webkit-box;
  38   padding-top: 13px;
  39 }
  40
  41 #dev-controls button {
  42   white-space: nowrap;
  43 }
  44
  45 #extension-settings.dev-mode #dev-controls {
  46   -webkit-transition-duration: 250ms;
  47   height: 45px;
  48   opacity: 1;
  49   padding-bottom: 7px;
  50 }
  51
  52 #extension-settings.dev-mode.apps-dev-tools-mode #dev-controls {
  53   height: 100px;
  54 }
  55
  56 #apps-dev-tool-banner {
  57   border-bottom: 1px solid #eee;
  58   display: none;
  59   padding-bottom: 13px;
  60   padding-top: 13px;
  61 }
  62
  63 #extension-settings.dev-mode.apps-dev-tools-mode #apps-dev-tool-banner {
  64   display: -webkit-box;
  65 }
  66
  67 .apps-dev-tool-banner-text {
  68   -webkit-box-flex: 1;
  69 }
  70
  71 #dev-controls-spacer {
  72   -webkit-box-flex: 1;
  73 }
  74
  75 #dev-toggle {
  76   margin-top: 0;
  77   text-align: end;
  78 }
  79
  80 #extension-settings:not(.dev-mode) .developer-extras {
  81   display: none;
  82 }
  83
  84 .developer-extras > div,
  85 .permanent-warnings > div {
  86   margin: 5px 0;
  87 }
  88
  89 #extension-settings #page-header {
  90   /* These values match the .page values. */
  91   -webkit-margin-end: 24px;
  92   min-width: 576px;
  93 }
  94
  95 /* Contents */
  96
  97 #extension-settings {
  98   max-width: 738px;
  99 }
 100
 101 #no-extensions-message {
 102   font-weight: bold;
 103 }
 104
 105 #suggest-gallery {
 106   -webkit-padding-start: 10px;
 107 }
 108
 109 #footer-section {
 110   background: url('chrome://theme/IDR_WEBSTORE_ICON_32') no-repeat left center;
 111   font-size: 1.25em;
 112 }
 113
 114 html[dir=rtl] #footer-section {
 115   background: url('chrome://theme/IDR_WEBSTORE_ICON_32') no-repeat right center;
 116 }
 117
 118 #footer-section > a {
 119   -webkit-margin-start: 42px;
 120   line-height: 32px;
 121 }
 122
 123 .empty-extension-list {
 124   height: 3em;
 125 }
 126
 127 .loading #no-extensions,
 128 .loading #footer-section,
 129 #extension-settings-list:not(.empty-extension-list) ~ #no-extensions,
 130 .empty-extension-list ~ #footer-section {
 131   display: none;
 132 }
 133
 134 .extension-list-item-wrapper {
 135   margin: 23px 0;
 136 }
 137
 138 .extension-list-item {
 139   background-repeat: no-repeat;
 140   display: -webkit-box;
 141   min-height: 48px;
 142 }
 143
 144 html[dir='rtl'] .extension-list-item {
 145   background-position: right;
 146 }
 147
 148 .extension-title {
 149   -webkit-padding-end: 20px;
 150   color: rgb(48, 57, 66);
 151   font-size: 14px;
 152   font-weight: 500;
 153 }
 154
 155 .inactive-extension .extension-title {
 156   color: inherit;
 157 }
 158
 159 .extension-version {
 160   -webkit-padding-end: 7px;
 161   font-size: 13px;
 162   font-weight: 400;
 163 }
 164
 165 .extension-description {
 166   -webkit-padding-end: 5px;
 167   font-size: 13px;
 168   margin: 5px 0;
 169   white-space: normal;
 170 }
 171
 172 .extension-details {
 173   -webkit-box-flex: 1;
 174   -webkit-padding-start: 55px;
 175 }
 176
 177 .extension-description,
 178 .extension-list-item-wrapper.inactive-extension .extension-details,
 179 .location-text,
 180 .enable-checkbox input:disabled + .enable-checkbox-text {
 181   color: rgb(151, 156, 160);
 182 }
 183
 184 .enable-controls {
 185   /* Matches right: position of dev controls toggle. */
 186   -webkit-margin-end: 20px;
 187   position: relative;
 188 }
 189
 190 .enable-checkbox-text {
 191   /* Matches width of trash. */
 192   -webkit-margin-end: 30px;
 193 }
 194
 195 .checkbox {
 196   display: inline-block;
 197 }
 198
 199 .enabled-text {
 200   font-weight: bold;
 201 }
 202
 203 .extension-list-item-wrapper.inactive-extension .enabled-text,
 204 .extension-list-item-wrapper:not(.inactive-extension) .enable-text,
 205 .extension-list-item-wrapper.inactive-extension .optional-controls,
 206 .extension-list-item-wrapper.inactive-extension .butter-bar {
 207   display: none;
 208 }
 209
 210 .load-path > span {
 211   word-wrap: break-word;
 212 }
 213
 214 .terminated-reload-link {
 215   -webkit-margin-end: 2.5em;
 216   padding-top: 7px;
 217 }
 218
 219 .extension-list-item a {
 220   -webkit-margin-start: 0.5em;
 221   display: inline-block;
 222 }
 223
 224 .install-warnings a {
 225   -webkit-margin-start: 0;
 226 }
 227
 228 .butter-bar,
 229 .install-warnings,
 230 .extension-warnings {
 231   border-radius: 3px;
 232   margin-top: 5px;
 233   padding: 2px 5px;
 234 }
 235
 236 .butter-bar {
 237   background: rgb(255, 242, 153);
 238 }
 239
 240 .install-warnings,
 241 .extension-warnings {
 242   background: pink;
 243 }
 244
 245 .install-warnings ul,
 246 .extension-warnings ul {
 247   margin: 0;
 248 }
 249
 250 #font-measuring-div {
 251   /* Remove from the flow and hide. */
 252   position: absolute;
 253   visibility: hidden;
 254 }
 255
 256 .extension-commands-config {
 257   float: right;
 258 }
 259
 260 html[dir=rtl] .extension-commands-config {
 261   float: left;
 262 }
 263
 264 /* Overlays */
 265
 266 #overlay {
 267   z-index: 5;
 268 }
 269
 270 #overlay .page:not(.showing) {
 271   display: none;
 272 }
 273
 274 #drop-target-overlay {
 275   color: rgb(48, 57, 66);
 276   font-size: 18px;
 277   text-align: center;
 278 }
 279
 280 #drop-target-overlay div {
 281   margin: 1em;
 282 }
 283
 284 .location-text {
 285   display: block;
 286   width: 100px;
 287 }
 288
 289 /* Trash */
 290
 291 #extension-settings .trash {
 292   -webkit-transition: opacity 200ms;
 293   height: 22px;
 294   opacity: 0.8;
 295   position: absolute;
 296   right: 0;
 297   top: 3px;
 298   vertical-align: middle;
 299 }
 300
 301 html[dir='rtl'] #extension-settings .trash {
 302   left: 0;
 303   right: auto;
 304 }
 305
 306 .extension-list-item:not(:hover) .trash:not(:focus) {
 307   opacity: 0;
 308 }
 309
 310 .extension-list-item-wrapper.may-not-remove .trash {
 311   visibility: hidden;
 312 }
 313
 314 .extension-highlight {
 315   background: rgb(238, 238, 238);
 316   background-position: auto;
 317   background-repeat: auto;
 318   border-radius: 3px;
 319   padding: 5px 0 5px 5px;
 320 }
 321
 322 .may-not-modify .optional-controls .optional-controls-disableable {
 323   display: none;
 324 }
 325
 326 /* Managed mode */
 327
 328 .page:not(.profile-is-managed) .profile-is-managed-banner,
 329 .profile-is-managed .more-extensions-link {
 330   display: none;
 331 }
 332
 333 .profile-is-managed-banner .page-banner-text {
 334   background-image: url('chrome://theme/IDR_WARNING');
 335 }
 336
 337 /* Sideload Wipeout */
 338
 339 .sideload-wipeout-learn-more {
 340   text-decoration: none;
 341 }
 342
 343 .sideload-wipeout-banner .page-banner-text {
 344   -webkit-padding-start: 8px;
 345   background-image: none;
 346 }