MediaWiki:Gadget-spriteEdit.css

position: relative; }
 * 1) spritedoc {

display: none; }
 * 1) spritedoc canvas {

.spriteedit-enabled { overflow-y: scroll; }

.spriteedit-smoothscroll { scroll-behavior: smooth; }

.spriteedit-sorting * { cursor: move !important; cursor: -webkit-grabbing !important; cursor: -moz-grabbing !important; cursor: grabbing !important; }

.spriteedit-elastic { transition-timing-function: cubic-bezier(0.46, 0, 0.19, 1.44) !important; }

.spriteedit-droptarget { outline: 1px dashed #000; }

.spriteedit-autoscroll { visibility: hidden; position: fixed; left: 0; right: 0; height: 50px; z-index: 999; } .spriteedit-autoscroll-up { top: 0; } .spriteedit-autoscroll-down { bottom: 0; } .spriteedit-sorting .spriteedit-autoscroll, .spriteedit-dragging .spriteedit-autoscroll { visibility: visible; }

.spriteedit-toolbar-container { position: sticky; top: 0; z-index: 91; } .spriteedit-toolbar { position: relative; background-color: #80b640; border-bottom: 4px solid #3c6a02; padding: 0.5em 0; overflow: hidden; transition: height 200ms; z-index: 91; } .spriteedit-toolbar-fixed { position: fixed; top: 0; right: 0; margin: 0 !important; } .spriteedit-toolbar > .mw-ui-button-group { margin-right: 1em; } .spriteedit-toolbar .mw-ui-button { float: none; } .spriteedit-tool-deprecate .spritedoc-name > code { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; }	position: absolute; right: 0; bottom: 0.5em; }	display: -webkit-flex; display: -ms-flex; display: flex; margin-top: 0.5em; }	margin-right: 0.5em; -webkit-flex: auto; -ms-flex: auto; flex: auto; }	margin-right: 0.5em; -webkit-flex: none; -ms-flex: none; flex: none; }
 * 1) spriteedit-save {
 * 1) spriteedit-saveform {
 * 1) spriteedit-summary {
 * 1) spriteedit-review-button {

.spritedoc-box:hover { z-index: 1; }

.spriteedit-handle { -webkit-flex: none; -ms-flex: none; flex: none; background: #AAA; background: linear-gradient(#AAA, #AAA 50%, #FFF 50%, #FFF) 0 0, linear-gradient(#AAA, #AAA 50%, #FFF 50%, #FFF) 2px 2px; background-repeat: repeat-y; background-size: 2px 4px; padding-right: 4px; margin-right: 0.3em; cursor: move; cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; visibility: hidden; opacity: 0; transition: opacity 200ms 300ms, visibility 0s linear 500ms; } .spritedoc-box > .spriteedit-handle { position: absolute; top: 0; left: 0; bottom: 0; }

html.spriteedit-imageeditingenabled .spritedoc-image { cursor: pointer; }

.spriteedit-add-name { bottom: -9px; left: 0; width: 100%; position: absolute; visibility: hidden; opacity: 0; transition: opacity 200ms 300ms, visibility 0s linear 500ms; z-index: 9; } .spriteedit-add-name > button { font-size: 60%; line-height: 1; padding: 1px 0 2px; width: 100%; } html.spriteedit-hidecontrols .spriteedit-handle, html.spriteedit-hidecontrols .spriteedit-add-name { visibility: hidden !important; opacity: 0 !important; transition: visibility, opacity !important; } .spritedoc-box:hover .spriteedit-handle, .spritedoc-box:hover > .spriteedit-add-name { visibility: visible; opacity: 1; transition-delay: 200ms; } .spritedoc-box:hover .spritedoc-name > .spriteedit-handle { opacity: 0.5; } .spritedoc-box .spritedoc-name:hover > .spriteedit-handle { opacity: 1; transition-delay: 0s; }
 * 1) spritedoc h3:hover > .spriteedit-handle,

content: "\A0"; /* Non-breaking space */ }	content: attr(data-placeholder); opacity: 0.54; font-style: italic; }	content: none !important; }
 * 1) spritedoc [contentEditable]:empty:after {
 * 1) spritedoc [contentEditable][data-placeholder]:empty:after {
 * 1) spritedoc [contentEditable][data-placeholder]:not(:empty):after {

.spriteedit-dupe { background-color: #FFC7CE !important; }

position: fixed !important; z-index: 999; opacity: 0.8; pointer-events: none; } .spriteedit-placeholder { opacity: 0.5; outline: 1px dashed #000; }
 * 1) spritedoc .spriteedit-ghost {

background-size: 1em 1em; background-image: linear-gradient(		45deg,		rgba(204, 204, 204, 0.4) 25%,		transparent 25%,		transparent 50%,		rgba(204, 204, 204, 0.4) 50%,		rgba(204, 204, 204, 0.4) 75%,		transparent 75%,		transparent	); animation: spriteedit-processing 1s infinite linear; /* Limit mw-ui-button transition to background-color */ transition: background-color .1s ease-in-out, color .1s ease-in-out, box-shadow .1s ease-in-out; } @keyframes spriteedit-processing { 0% { background-position: 0 0; } 100% { background-position: 1em 0; } }
 * 1) spritedoc .spriteedit-processing {

.spriteedit-tooltip { position: absolute; margin-left: -19px; padding: 9px; opacity: 0; transform: scale(0); transform-origin: 19px bottom; transition: transform 350ms, opacity 350ms; z-index: 121; white-space: nowrap; } .spriteedit-tooltip-horizontal { margin-left: 0; margin-top: -19px; transform-origin: right 19px; } .spriteedit-tooltip-text, .spriteedit-tooltip-arrow:before { border: 1px solid #CCC; background-color: #FFF; } .spriteedit-tooltip-arrow { position: absolute; bottom: 1px; left: 9px; height: 9px; width: 20px; overflow: hidden; } .spriteedit-tooltip-horizontal .spriteedit-tooltip-arrow { top: 14px; right: -4px; bottom: auto; left: auto; transform: rotate(-90deg); } .spriteedit-tooltip-arrow:before { content: ""; position: absolute; transform: rotate(45deg); height: 10px; width: 10px; left: 4px; top: -6px; padding: 0; }

.spriteedit-dialog-overlay { display: -webkit-flex; display: -ms-flex; display: flex; align-items: center; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.2); opacity: 0; transition: opacity 300ms; z-index: 9990 } .spriteedit-dialog { position: relative; background-color: #FFF; max-width: 90%; max-height: 80%; transform: scale(0); transition-property: transform, width, height; transition-duration: 400ms, 350ms, 350ms; /* Non-flex fallback */ margin: 1em auto; border-radius: 3px; overflow: hidden; }	border-radius: 0; border-width: 0; line-height: 1; position: absolute; right: 0; top: 0; min-width: 0; width: 42px; height: 42px; padding: 0; border-width: 0 0 0 1px; border-radius: 0; font-size: 21px; } .spriteedit-dialog-panel { box-sizing: border-box; height: 100%; } .spriteedit-dialog-panel > * { padding: 0.5em; } .spriteedit-dialog-title { text-align: center; font-size: 120%; height: 26px; white-space: nowrap; padding: 8px; margin: 0 42px; } .spriteedit-dialog-text { border: solid #CCC; border-width: 1px 0; box-sizing: border-box; max-height: 100%; overflow: auto; } .spriteedit-dialog-text textarea { min-width: 40em; /* TODO: Remove on update to MW1.25 */ min-height: 8em; resize: none; overflow: hidden; }
 * 1) spriteedit-dialog-close {

.spriteedit-dialog-actions { overflow: hidden; }

.spriteedit-sheet-diff { white-space: nowrap; } .spriteedit-old-sheet, .spriteedit-new-sheet { display: inline-block; padding: 1em; text-align: center; vertical-align: top; } .spriteedit-new-sheet { background-color: #D8ECFF; } .spriteedit-old-sheet { background-color: #FEEEC8; }