resources/lib/oojs-ui/oojs-ui-windows-wikimediaui.css

   1 /*!
   2  * OOjs UI v0.24.3
   3  * https://www.mediawiki.org/wiki/OOjs_UI
   4  *
   5  * Copyright 2011–2017 OOjs UI Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: 2017-11-28T23:28:10Z
  10  */
  11 /**
  12  * WikimediaUI Base v0.10.0
  13  * Wikimedia Foundation user interface base variables
  14  */
  15 .oo-ui-window {
  16   background: transparent;
  17 }
  18 .oo-ui-window-frame {
  19   -webkit-box-sizing: border-box;
  20   -moz-box-sizing: border-box;
  21   box-sizing: border-box;
  22 }
  23 .oo-ui-window-content {
  24   position: absolute;
  25   top: 0;
  26   left: 0;
  27   right: 0;
  28   bottom: 0;
  29 }
  30 .oo-ui-window-content:focus {
  31   outline: 0;
  32 }
  33 .oo-ui-window-head,
  34 .oo-ui-window-foot {
  35   -webkit-touch-callout: none;
  36   -webkit-user-select: none;
  37   -moz-user-select: none;
  38   -ms-user-select: none;
  39   user-select: none;
  40 }
  41 .oo-ui-window-body {
  42   margin: 0;
  43   padding: 0;
  44   background: none;
  45 }
  46 .oo-ui-window-overlay {
  47   position: absolute;
  48   top: 0;
  49   /* @noflip */
  50   left: 0;
  51 }
  52 .oo-ui-dialog-content > .oo-ui-window-head,
  53 .oo-ui-dialog-content > .oo-ui-window-body,
  54 .oo-ui-dialog-content > .oo-ui-window-foot {
  55   position: absolute;
  56   left: 0;
  57   right: 0;
  58   -webkit-box-sizing: border-box;
  59   -moz-box-sizing: border-box;
  60   box-sizing: border-box;
  61 }
  62 .oo-ui-dialog-content > .oo-ui-window-head {
  63   overflow: hidden;
  64   z-index: 1;
  65   top: 0;
  66 }
  67 .oo-ui-dialog-content > .oo-ui-window-body {
  68   overflow: auto;
  69   z-index: 2;
  70   top: 0;
  71   bottom: 0;
  72 }
  73 .oo-ui-dialog-content > .oo-ui-window-foot {
  74   z-index: 3;
  75   bottom: 0;
  76 }
  77 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
  78   position: relative;
  79   text-align: center;
  80 }
  81 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonElement-button {
  82   display: block;
  83 }
  84 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labelElement-label {
  85   position: relative;
  86   top: auto;
  87   bottom: auto;
  88 }
  89 .oo-ui-messageDialog-actions-horizontal {
  90   display: table;
  91   table-layout: fixed;
  92   width: 100%;
  93 }
  94 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
  95   display: table-cell;
  96   width: 1%;
  97 }
  98 .oo-ui-messageDialog-actions-vertical {
  99   display: block;
 100 }
 101 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
 102   display: block;
 103   overflow: hidden;
 104   text-overflow: ellipsis;
 105 }
 106 .oo-ui-messageDialog-content > .oo-ui-window-foot {
 107   outline: 1px solid #a2a9b1;
 108 }
 109 .oo-ui-messageDialog-title,
 110 .oo-ui-messageDialog-message {
 111   display: block;
 112   text-align: center;
 113 }
 114 .oo-ui-messageDialog-title.oo-ui-labelElement,
 115 .oo-ui-messageDialog-message.oo-ui-labelElement {
 116   padding-top: 0.5em;
 117 }
 118 .oo-ui-messageDialog-title {
 119   font-size: 1.5em;
 120   line-height: 1;
 121   color: #000;
 122 }
 123 .oo-ui-messageDialog-message {
 124   font-size: 1.1em;
 125   line-height: 1.4;
 126   color: #222;
 127   text-align: left;
 128 }
 129 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
 130   border-right: 1px solid #a2a9b1;
 131   margin: 0;
 132 }
 133 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
 134   border-right-width: 0;
 135 }
 136 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
 137   border-bottom: 1px solid #a2a9b1;
 138   margin: 0;
 139 }
 140 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
 141   border-bottom-width: 0;
 142 }
 143 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
 144   min-height: 3.4375em;
 145   margin-right: 0;
 146 }
 147 .oo-ui-messageDialog-actions .oo-ui-actionWidget:last-child {
 148   margin-right: 0;
 149 }
 150 .oo-ui-messageDialog-actions .oo-ui-actionWidget:first-child {
 151   margin-left: 0;
 152 }
 153 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonElement-button {
 154   border: 0;
 155   border-radius: 0;
 156   padding: 0;
 157 }
 158 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-labelElement .oo-ui-labelElement-label {
 159   line-height: 3.4375em;
 160   text-align: center;
 161 }
 162 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
 163   background-color: #f8f9fa;
 164 }
 165 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
 166   background-color: #c8ccd1;
 167 }
 168 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:focus {
 169   box-shadow: inset 0 0 0 1px #36c, 0 0 0 1px #36c;
 170 }
 171 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:hover,
 172 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-buttonElement-button:hover {
 173   background-color: #eaf3ff;
 174 }
 175 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:active,
 176 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-buttonElement-button:active {
 177   background-color: rgba(8, 126, 204, 0.1);
 178 }
 179 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-labelElement-label,
 180 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-labelElement-label {
 181   font-weight: bold;
 182 }
 183 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:hover {
 184   background-color: #fee7e6;
 185 }
 186 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:active {
 187   background-color: rgba(212, 83, 83, 0.1);
 188 }
 189 .oo-ui-processDialog-location {
 190   overflow: hidden;
 191   text-overflow: ellipsis;
 192   white-space: nowrap;
 193 }
 194 .oo-ui-processDialog-title {
 195   display: inline;
 196   padding: 0;
 197 }
 198 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget,
 199 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget,
 200 .oo-ui-processDialog-actions-other .oo-ui-actionWidget {
 201   white-space: nowrap;
 202 }
 203 .oo-ui-processDialog-actions-safe,
 204 .oo-ui-processDialog-actions-primary {
 205   position: absolute;
 206   top: 0;
 207   bottom: 0;
 208 }
 209 .oo-ui-processDialog-actions-safe {
 210   left: 0;
 211 }
 212 .oo-ui-processDialog-actions-primary {
 213   right: 0;
 214 }
 215 .oo-ui-processDialog-errors {
 216   position: absolute;
 217   top: 0;
 218   left: 0;
 219   right: 0;
 220   bottom: 0;
 221   z-index: 4;
 222   overflow-x: hidden;
 223   overflow-y: auto;
 224 }
 225 .oo-ui-processDialog-content .oo-ui-window-head {
 226   height: 3.4375em;
 227 }
 228 .oo-ui-processDialog-content .oo-ui-window-body {
 229   top: 3.4375em;
 230   outline: 1px solid #c8ccd1;
 231 }
 232 .oo-ui-processDialog-navigation {
 233   position: relative;
 234   height: 3.4375em;
 235 }
 236 .oo-ui-processDialog-location {
 237   height: 3.4375em;
 238   cursor: default;
 239   text-align: center;
 240 }
 241 .oo-ui-processDialog-title {
 242   font-weight: bold;
 243   line-height: 3.4375em;
 244 }
 245 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-framed,
 246 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-framed,
 247 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-framed {
 248   margin: 0.46875em;
 249 }
 250 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child,
 251 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child,
 252 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child {
 253   margin-left: 0;
 254 }
 255 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button,
 256 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button,
 257 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
 258   padding-left: 2.875em;
 259   padding-top: 0;
 260   min-height: 3.4375em;
 261 }
 262 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
 263 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
 264 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
 265   left: 0.5em;
 266 }
 267 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child,
 268 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child,
 269 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
 270   margin-left: 0;
 271 }
 272 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button,
 273 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button,
 274 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button {
 275   padding: 0.75em 1em;
 276 }
 277 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button,
 278 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button,
 279 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
 280   padding-left: 2.625em;
 281 }
 282 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless .oo-ui-labelElement-label,
 283 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless .oo-ui-labelElement-label,
 284 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless .oo-ui-labelElement-label {
 285   line-height: 1.875em;
 286 }
 287 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless:hover,
 288 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless:hover {
 289   background-color: rgba(0, 0, 0, 0.05);
 290 }
 291 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless:active,
 292 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless:active {
 293   background-color: rgba(0, 0, 0, 0.1);
 294 }
 295 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive:hover,
 296 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive:hover,
 297 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:hover,
 298 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:hover {
 299   background-color: rgba(8, 126, 204, 0.05);
 300 }
 301 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive:active,
 302 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive:active,
 303 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:active,
 304 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:active {
 305   background-color: rgba(8, 126, 204, 0.1);
 306 }
 307 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive .oo-ui-labelElement-label,
 308 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive .oo-ui-labelElement-label,
 309 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive .oo-ui-labelElement-label,
 310 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive .oo-ui-labelElement-label {
 311   font-weight: bold;
 312 }
 313 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:hover,
 314 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:hover {
 315   background-color: rgba(212, 83, 83, 0.05);
 316 }
 317 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:active,
 318 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:active {
 319   background-color: rgba(212, 83, 83, 0.1);
 320 }
 321 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement {
 322   margin-right: 0;
 323 }
 324 .oo-ui-processDialog > .oo-ui-window-frame {
 325   min-height: 5em;
 326 }
 327 .oo-ui-processDialog-errors {
 328   background-color: rgba(255, 255, 255, 0.9);
 329   padding: 3em 3em 1.5em 3em;
 330   text-align: center;
 331 }
 332 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
 333   margin: 2em 1em 2em 1em;
 334 }
 335 .oo-ui-processDialog-errors-title {
 336   font-size: 1.5em;
 337   color: #000;
 338   margin-bottom: 2em;
 339 }
 340 .oo-ui-processDialog-error {
 341   text-align: left;
 342   margin: 1em;
 343   padding: 1em;
 344   border: 1px solid #d33;
 345   background-color: #fff7f7;
 346   border-radius: 2px;
 347 }
 348 .oo-ui-windowManager-modal > .oo-ui-dialog {
 349   position: fixed;
 350   width: 0;
 351   height: 0;
 352   overflow: hidden;
 353   z-index: 4;
 354 }
 355 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-active {
 356   width: auto;
 357   height: auto;
 358   top: 0;
 359   right: 0;
 360   bottom: 0;
 361   left: 0;
 362   padding: 1em;
 363 }
 364 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame {
 365   position: absolute;
 366   right: 0;
 367   left: 0;
 368   margin: auto;
 369   max-width: 100%;
 370   max-height: 100%;
 371 }
 372 .oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame {
 373   width: 100%;
 374   height: 100%;
 375   top: 0;
 376   bottom: 0;
 377 }
 378 .oo-ui-windowManager-modal > .oo-ui-dialog {
 379   background-color: rgba(255, 255, 255, 0.5);
 380   opacity: 0;
 381   -webkit-transition: opacity 250ms;
 382   -moz-transition: opacity 250ms;
 383   transition: opacity 250ms;
 384 }
 385 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
 386   background-color: #fff;
 387   opacity: 0;
 388   -webkit-transform: scale(0.5);
 389   -moz-transform: scale(0.5);
 390   -ms-transform: scale(0.5);
 391   transform: scale(0.5);
 392   -webkit-transition: all 250ms;
 393   -moz-transition: all 250ms;
 394   transition: all 250ms;
 395 }
 396 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
 397   opacity: 1;
 398 }
 399 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
 400   opacity: 1;
 401   -webkit-transform: scale(1);
 402   -moz-transform: scale(1);
 403   -ms-transform: scale(1);
 404   transform: scale(1);
 405 }
 406 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
 407   top: 1em;
 408   bottom: 1em;
 409   max-height: 100%;
 410   max-height: calc( 100% - 2em );
 411   border: 1px solid #a2a9b1;
 412   border-radius: 2px;
 413   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
 414 }