resources/lib/oojs-ui/oojs-ui-agora.css

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