/*! * VisualEditor user interface Widget styles. * * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt * @license The MIT License (MIT); see LICENSE.txt */ /* ve.ui.ButtonWidget */ .ve-ui-buttonWidget { display: inline-block; height: 1.8em; margin: 0.1em 0.25em; padding: 0.25em 0.75em; border-radius: 0.3em; vertical-align: top; color: #555; text-shadow: 0 1px 1px rgba(255, 255, 255, 1); box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1); text-align: center; font-size: 1em; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* Animation */ transition: border-color 100ms; -moz-transition: border-color 100ms; -webkit-transition: border-color 100ms; -o-transition: border-color 100ms; /* Gray */ border: 1px #c9c9c9 solid; background-color: #ffffff; filter: progid:DXImageTransform.Microsoft.gradient( GradientType=0,startColorstr=#ffffff, endColorstr=#f0f0f0 ); background-image: -webkit-gradient( linear, right top, right bottom, color-stop(0%,#ffffff), color-stop(100%,#f0f0f0) ); background-image: -webkit-linear-gradient(top, #ffffff 0%, #f0f0f0 100%); background-image: -moz-linear-gradient(top, #ffffff 0%, #f0f0f0 100%); background-image: -ms-linear-gradient(top, #ffffff 0%, #f0f0f0 100%); background-image: -o-linear-gradient(top, #ffffff 0%, #f0f0f0 100%); background-image: linear-gradient(top, #ffffff 0%, #f0f0f0 100%); } .ve-ui-buttonWidget:hover { border-color: #aaa; } .ve-ui-buttonWidget:active { border-color: #ddd; box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07); } .ve-ui-buttonWidget-disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default; } .ve-ui-buttonWidget-disabled:hover { border-color: #ccc; box-shadow: none; } .ve-ui-buttonWidget-label { display: inline-block; vertical-align: middle; line-height: 1.9em; } .ve-ui-buttonWidget-destructive { /* Red text */ color: #d45353; } .ve-ui-buttonWidget-constructive { /* Green */ border: solid 1px #c3e59a; background-color: #f0fbe1; filter: progid:DXImageTransform.Microsoft.gradient( GradientType=0,startColorstr=#f0fbe1, endColorstr=#c3e59a ); background-image: -webkit-gradient( linear, right top, right bottom, color-stop(0%,#f0fbe1), color-stop(100%,#c3e59a) ); background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); } .ve-ui-buttonWidget-primary { /* Blue */ border: solid 1px #b0d9ee; background-color: #eaf4fa; filter: progid:DXImageTransform.Microsoft.gradient( GradientType=0,startColorstr=#eaf4fa, endColorstr=#b0d9ee ); background-image: -webkit-gradient( linear, right top, right bottom, color-stop(0%,#eaf4fa), color-stop(100%,#b0d9ee) ); background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); } /* ve.ui.MenuWidget */ .ve-ui-menuWidget { display: none; position: absolute; border: solid 1px #ccc; border-radius: 0.25em; background-color: #fff; box-shadow: 0 0.25em 1em 0 rgba(0, 0, 0, 0.25); z-index: 3; } .ve-ui-menuWidget-item { padding: 0.6em 0.8em; cursor: pointer; white-space: nowrap; } .ve-ui-menuWidget-item:hover { background-color: #b3d6f6; } .ve-ui-menuWidget-break { margin: 0.33em 0; border-top: solid 1px #ddd; } /* ve.ui.TextInputWidget */ .ve-ui-textInputWidget input { display: inline-block; font-size: 1em; font-family: sans-serif; background-color: #f7f7f7; border: solid 1px #ccc; box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd; padding: 0.5em; border-radius: 0.25em; /* Animation */ transition: border-color 200ms, box-shadow 200ms, background-color 200ms; -moz-transition: border-color 200ms, box-shadow 200ms, background-color 200ms; -webkit-transition: border-color 200ms, box-shadow 200ms, background-color 200ms; -o-transition: border-color 200ms, box-shadow 200ms, background-color 200ms; } .ve-ui-textInputWidget input:focus { outline: none; border-color: #a7dcff; box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white; background-color: #fff; } /* ve.ui.TextInputMenuWidget */ .ve-ui-textInputMenuWidget { position: absolute; background: #FFFFFF; width: 20em; margin-top: -1px; font-size: 0.8em; z-index: 101; border: solid 1px #ccc; border-radius: 0 0 0.25em 0.25em; box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2); } .ve-ui-textInputMenuWidget-groups { margin: 0.5em 0; padding: 0; list-style: none; } .ve-ui-textInputMenuWidget-group { margin: 0; padding: 0; } .ve-ui-textInputMenuWidget-group-label { padding: 0.33em 0.75em; color: #888; } .ve-ui-textInputMenuWidget-items { margin: 0; padding: 0; list-style: none; } .ve-ui-textInputMenuWidget-item { padding: 0.33em 1.25em; margin: 0; cursor: pointer; color: #0645AD; } .ve-ui-textInputMenuWidget-item-label { white-space: nowrap; } .ve-ui-textInputMenuWidget-item:hover { background: #E5F3FF; } .ve-ui-textInputMenuWidget-item-selected, .ve-ui-textInputMenuWidget-item-selected:hover { background-color: #b3d6f6; } .ve-ui-textInputMenuWidget-group[rel=newPage] .ve-ui-textInputMenuWidget-item-label { color: #BA0000; } .ve-ui-textInputMenuWidget-group[rel=existingPage] .ve-ui-textInputMenuWidget-item-label, .ve-ui-textInputMenuWidget-group[rel=matchingPage] .ve-ui-textInputMenuWidget-item-label, .ve-ui-textInputMenuWidget-group[rel=externalLink] .ve-ui-textInputMenuWidget-item-label { color: #0645AD; } .ve-ui-mwLinkTargetInputWidget-pending input { background-image: url(images/pending.gif); }