resources/lib/oojs-ui/oojs-ui-toolbars-mediawiki.css

   1 /*!
   2  * OOjs UI v0.18.2
   3  * https://www.mediawiki.org/wiki/OOjs_UI
   4  *
   5  * Copyright 2011–2016 OOjs UI Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: 2016-12-06T23:32:57Z
  10  */
  11 .oo-ui-tool.oo-ui-widget-enabled {
  12   -webkit-transition: background-color 100ms;
  13      -moz-transition: background-color 100ms;
  14           transition: background-color 100ms;
  15 }
  16 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
  17   -webkit-transition: color 100ms;
  18      -moz-transition: color 100ms;
  19           transition: color 100ms;
  20 }
  21 .oo-ui-popupTool .oo-ui-popupWidget-popup,
  22 .oo-ui-popupTool .oo-ui-popupWidget-anchor {
  23   z-index: 4;
  24 }
  25 .oo-ui-popupTool .oo-ui-popupWidget {
  26   /* @noflip */
  27   margin-left: 1.25em;
  28 }
  29 .oo-ui-toolGroupTool > .oo-ui-toolGroup {
  30   border-right: 0;
  31 }
  32 .oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle {
  33   height: 2.5em;
  34   padding: 0.3125em;
  35 }
  36 .oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
  37   height: 2.5em;
  38   width: 1.875em;
  39 }
  40 .oo-ui-toolGroupTool > .oo-ui-popupToolGroup.oo-ui-labelElement > .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
  41   line-height: 2.1;
  42 }
  43 .oo-ui-toolGroup {
  44   display: inline-block;
  45   vertical-align: middle;
  46   border-right: 1px solid #c8ccd1;
  47 }
  48 .oo-ui-toolGroup-empty {
  49   display: none;
  50 }
  51 .oo-ui-toolGroup .oo-ui-tool-link {
  52   text-decoration: none;
  53   cursor: pointer;
  54 }
  55 .oo-ui-toolGroup.oo-ui-widget-disabled .oo-ui-tool-link,
  56 .oo-ui-toolGroup .oo-ui-widget-disabled > .oo-ui-tool-link {
  57   outline: 0;
  58   cursor: default;
  59 }
  60 .oo-ui-toolbar-actions .oo-ui-toolGroup {
  61   border-right: 0;
  62   border-left: 1px solid #c8ccd1;
  63 }
  64 .oo-ui-toolbar-narrow .oo-ui-toolGroup + .oo-ui-toolGroup {
  65   margin-left: 0;
  66 }
  67 .oo-ui-barToolGroup > .oo-ui-iconElement-icon,
  68 .oo-ui-barToolGroup > .oo-ui-labelElement-label {
  69   display: none;
  70 }
  71 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool {
  72   display: inline-block;
  73   position: relative;
  74   vertical-align: top;
  75 }
  76 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link {
  77   display: block;
  78 }
  79 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel {
  80   display: none;
  81 }
  82 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-iconElement-icon {
  83   display: inline-block;
  84   vertical-align: top;
  85 }
  86 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title {
  87   display: none;
  88 }
  89 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title {
  90   display: inline;
  91 }
  92 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link {
  93   height: 1.875em;
  94   padding: 0.625em;
  95 }
  96 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon {
  97   height: 1.875em;
  98   width: 1.875em;
  99 }
 100 .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title {
 101   line-height: 2.1;
 102   padding: 0 0.4em;
 103 }
 104 .oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover {
 105   background-color: #eaecf0;
 106 }
 107 .oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link .oo-ui-tool-title {
 108   color: #222;
 109   -webkit-transition: color 100ms;
 110      -moz-transition: color 100ms;
 111           transition: color 100ms;
 112 }
 113 .oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active {
 114   background-color: #eaf3ff;
 115   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 116 }
 117 .oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active:hover {
 118   background-color: rgba(41, 98, 204, 0.1);
 119 }
 120 .oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link .oo-ui-tool-title {
 121   color: #36c;
 122 }
 123 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title,
 124 .oo-ui-barToolGroup.oo-ui-widget-disabled .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title {
 125   color: #72777d;
 126 }
 127 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-iconElement-icon,
 128 .oo-ui-barToolGroup.oo-ui-widget-disabled .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon {
 129   opacity: 0.3;
 130 }
 131 .oo-ui-popupToolGroup {
 132   position: relative;
 133   height: 3.125em;
 134   min-width: 2em;
 135 }
 136 .oo-ui-popupToolGroup-handle {
 137   display: block;
 138   cursor: pointer;
 139 }
 140 .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator,
 141 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
 142   position: absolute;
 143 }
 144 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
 145   outline: 0;
 146   cursor: default;
 147 }
 148 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 149   display: none;
 150   position: absolute;
 151   z-index: 4;
 152 }
 153 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools {
 154   display: block;
 155 }
 156 .oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools {
 157   left: 0;
 158 }
 159 .oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools {
 160   right: 0;
 161 }
 162 .oo-ui-popupToolGroup .oo-ui-tool-link {
 163   display: table;
 164   width: 100%;
 165   vertical-align: middle;
 166   white-space: nowrap;
 167 }
 168 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon,
 169 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel,
 170 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 171   display: table-cell;
 172   vertical-align: middle;
 173 }
 174 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel {
 175   text-align: right;
 176 }
 177 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel:not( :empty ) {
 178   padding-left: 3em;
 179 }
 180 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup {
 181   min-width: 1.875em;
 182 }
 183 .oo-ui-popupToolGroup.oo-ui-iconElement {
 184   min-width: 3.125em;
 185 }
 186 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement {
 187   min-width: 2.5em;
 188 }
 189 .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement {
 190   min-width: 4.375em;
 191 }
 192 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement {
 193   min-width: 3.75em;
 194 }
 195 .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 196   line-height: 2.6;
 197   margin: 0 1em;
 198 }
 199 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 200   margin: 0 0.5em;
 201 }
 202 .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 203   margin-left: 3em;
 204 }
 205 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 206   margin-left: 2.5em;
 207 }
 208 .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 209   margin-right: 2em;
 210 }
 211 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 212   margin-right: 1.75em;
 213 }
 214 .oo-ui-popupToolGroup-header {
 215   line-height: 2.6;
 216   margin: 0 0.6em;
 217   font-weight: bold;
 218 }
 219 .oo-ui-popupToolGroup-handle {
 220   padding: 0.3125em;
 221   height: 2.5em;
 222 }
 223 .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
 224   width: 0.9375em;
 225   height: 1.625em;
 226   margin: 0.78125em 0.5em;
 227   top: 0;
 228   right: 0;
 229   opacity: 0.3;
 230 }
 231 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
 232   right: -0.3125em;
 233 }
 234 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
 235   width: 1.875em;
 236   height: 2.6em;
 237   margin: 0.25em;
 238   top: 0;
 239   left: 0.3125em;
 240   opacity: 0.7;
 241 }
 242 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
 243   left: 0;
 244 }
 245 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 246   top: 3.125em;
 247   margin: 0 -1px;
 248   border: 1px solid #c8ccd1;
 249   background-color: #fff;
 250   box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
 251   min-width: 16em;
 252 }
 253 .oo-ui-popupToolGroup .oo-ui-tool-link {
 254   padding: 0.4em 0.625em;
 255   -webkit-box-sizing: border-box;
 256      -moz-box-sizing: border-box;
 257           box-sizing: border-box;
 258 }
 259 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
 260   height: 2.5em;
 261   width: 1.875em;
 262   min-width: 1.875em;
 263 }
 264 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title,
 265 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel {
 266   line-height: 2;
 267 }
 268 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 269   padding-left: 0.5em;
 270   color: #222;
 271 }
 272 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel {
 273   color: #72777d;
 274 }
 275 .oo-ui-popupToolGroup.oo-ui-widget-enabled {
 276   -webkit-transition: background-color 100ms, box-shadow 100ms;
 277      -moz-transition: background-color 100ms, box-shadow 100ms;
 278           transition: background-color 100ms, box-shadow 100ms;
 279 }
 280 .oo-ui-popupToolGroup.oo-ui-widget-enabled.oo-ui-popupToolGroup-active {
 281   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 282   background-color: #eaecf0;
 283 }
 284 .oo-ui-popupToolGroup.oo-ui-widget-enabled.oo-ui-popupToolGroup-active .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
 285   color: #36c;
 286 }
 287 .oo-ui-popupToolGroup.oo-ui-widget-enabled-handle:hover {
 288   background-color: #eaecf0;
 289 }
 290 .oo-ui-popupToolGroup.oo-ui-widget-enabled-handle:active {
 291   background-color: #eaf3ff;
 292 }
 293 .oo-ui-listToolGroup .oo-ui-tool {
 294   display: block;
 295   -webkit-box-sizing: border-box;
 296      -moz-box-sizing: border-box;
 297           box-sizing: border-box;
 298 }
 299 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 300   background-color: #eaecf0;
 301 }
 302 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon {
 303   opacity: 0.9;
 304 }
 305 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
 306   background-color: #eaf3ff;
 307 }
 308 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:first-child {
 309   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 310 }
 311 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover {
 312   background-color: rgba(41, 98, 204, 0.1);
 313 }
 314 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
 315   color: #36c;
 316 }
 317 .oo-ui-listToolGroup.oo-ui-widget-disabled,
 318 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
 319   color: #72777d;
 320 }
 321 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator,
 322 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon,
 323 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconElement-icon {
 324   opacity: 0.3;
 325 }
 326 .oo-ui-menuToolGroup .oo-ui-tool {
 327   display: block;
 328 }
 329 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 330   min-width: 10em;
 331 }
 332 .oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 333   min-width: 8.125em;
 334 }
 335 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
 336   background-image: none;
 337 }
 338 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon {
 339   background-image: url('themes/mediawiki/images/icons/check-progressive.png');
 340   background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url('themes/mediawiki/images/icons/check-progressive.svg');
 341   background-image:         linear-gradient(transparent, transparent), /* @embed */ url('themes/mediawiki/images/icons/check-progressive.svg');
 342   background-image:      -o-linear-gradient(transparent, transparent), url('themes/mediawiki/images/icons/check-progressive.png');
 343   background-size: contain;
 344   background-position: center center;
 345   background-repeat: no-repeat;
 346 }
 347 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 348   background-color: rgba(41, 98, 204, 0.1);
 349 }
 350 .oo-ui-menuToolGroup .oo-ui-tool-name-menuTool.oo-ui-tool-active {
 351   background-color: #eaf3ff;
 352 }
 353 .oo-ui-menuToolGroup.oo-ui-widget-disabled,
 354 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
 355   color: #72777d;
 356 }
 357 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator,
 358 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon,
 359 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconElement-icon {
 360   opacity: 0.3;
 361 }
 362 .oo-ui-toolbar {
 363   clear: both;
 364 }
 365 .oo-ui-toolbar-bar {
 366   line-height: 1;
 367   position: relative;
 368 }
 369 .oo-ui-toolbar-tools,
 370 .oo-ui-toolbar-actions,
 371 .oo-ui-toolbar-shadow {
 372   -webkit-touch-callout: none;
 373   -webkit-user-select: none;
 374      -moz-user-select: none;
 375       -ms-user-select: none;
 376           user-select: none;
 377 }
 378 .oo-ui-toolbar-tools {
 379   display: inline;
 380   white-space: nowrap;
 381 }
 382 .oo-ui-toolbar-narrow .oo-ui-toolbar-tools {
 383   white-space: normal;
 384 }
 385 .oo-ui-toolbar-tools .oo-ui-tool {
 386   white-space: normal;
 387 }
 388 .oo-ui-toolbar-actions {
 389   float: right;
 390 }
 391 .oo-ui-toolbar-actions .oo-ui-toolbar {
 392   display: inline-block;
 393 }
 394 .oo-ui-toolbar-actions .oo-ui-popupWidget {
 395   -webkit-touch-callout: default;
 396   -webkit-user-select: all;
 397      -moz-user-select: all;
 398       -ms-user-select: all;
 399           user-select: all;
 400 }
 401 .oo-ui-toolbar-shadow {
 402   background-position: left top;
 403   background-repeat: repeat-x;
 404   position: absolute;
 405   width: 100%;
 406   pointer-events: none;
 407 }
 408 .oo-ui-toolbar-bar {
 409   border-bottom: 1px solid #c8ccd1;
 410   background-color: #fff;
 411   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
 412   font-weight: 500;
 413   color: #222;
 414 }
 415 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
 416   border-bottom: 0;
 417   background-color: transparent;
 418   box-shadow: none;
 419 }
 420 .oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement {
 421   margin: 0;
 422 }
 423 .oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button {
 424   border: 0;
 425   border-radius: 0;
 426   padding: 0 0.3125em;
 427 }
 428 .oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
 429   margin: 0 1em;
 430   line-height: 3.125em;
 431 }
 432 .oo-ui-toolbar-actions > .oo-ui-toolbar:not( :last-child ) {
 433   border-right: 1px solid #c8ccd1;
 434 }