MediaWiki:InEditorHelp.css

cursor: pointer; }
 * 1) helpPanelCTA {

background-color: var(--helpPanel-bgcolor); border: 1px solid gray; bottom: 20px; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25); margin: 1em; position: fixed; right: 0; transition: transform 0.8s cubic-bezier(0.42, 0, 0.15, 1.4); width: 22.5em; }
 * 1) helpPanel {

.showHelpPanel { animation-duration: 400ms; animation-name: slidePanel; bottom: 0; opacity: 1; z-index: 10; }

.hideHelpPanel { bottom: -2em; display: none; opacity: 0; z-index: 0; }

.hideCTA { display: none; opacity: 0; }

/* START toggle help pane contents */ .helpPanel-contents > div { display: none; }

.helpPanel-contents > div.showHP-step { animation-duration: 200ms; animation-name: fadeHPstep; display: block; opacity: 1; z-index: 10; } /* END toggle help pane contents */

.helpPanel-close { cursor: pointer; position: absolute; right: 1em; top: 0.5em; z-index: 100; }

.helpPanel-close svg { /* TODO: Update for wikis with a light header color */ fill: white; }

.helpPanel-close svg, .helpPanel-contents svg { height: 20px; width: 20px; min-width: 20px; }

.message-icon svg { height: 12px; width: 12px; min-width: 14px; vertical-align: middle; }

background-color: var(--helpPanel-header-bgcolor); color: white; font-family: Helvetica, Arial, sans-serif; font-weight: bold; height: 2em; line-height: 1; margin: 0; padding: 1em 1em 0 3.5em; width: calc(100% - 4.5em); }
 * 1) helpPanelHead {

.helpPanel-question { position: absolute; left: 1em; top: 0.5em; }

margin: 0 1em; padding: 1em 0; }
 * 1) helpPanel-main {

padding-top: 1em; }
 * 1) helpPanel-main + div {

.helpPanel-contents strong { font-weight: bold; }


 * 1) helpPanel p + h4 { margin-top: 0.5em; }

color: var(--helpPanel-color); font-family: Helvetica, Arial, sans-serif; font-size: 1.1em; font-weight: bold; line-height: 1; margin: 0; padding: 0 0 0.75em; }
 * 1) helpPanel h4 {

list-style-type: disc; margin: 0; padding: 0 0 0 2em; }
 * 1) helpPanel ul {

display: list-item; }
 * 1) helpPanel ul li {

color: var(--helpPanel-color); line-height: 1.5; margin: 0; padding: 0 0 0.25em 0; }
 * 1) helpPanel p, #helpPanel li {

list-style-type: none; margin-bottom: 6em; margin-top: 1em; padding: 0; }
 * 1) hp-step3 #helpPanel-main ul {

border-top: 1px inset gray; padding: 1em 1em 0; }
 * 1) helpPanel-forum {

margin: 1em 0; }
 * 1) helpPanel-buttons {

margin-left: 0.5em; }
 * 1) helpPanel-buttons button + button {

width: 100% }
 * 1) helpPanel-forum textarea {

display: none; }
 * 1) helpPanel-spinner {

top: 5px; position: relative; }
 * 1) hp-step3 h4 span {

margin-top: 0.75em; }
 * 1) hp-step3 p + p {

padding: 0 1em; }
 * 1) hp-step3 #helpPanel-forum {

color: red; font-size: 12px; padding: 0 0 5px 0; font-weight: bold; text-align: center; display: none; }
 * 1) helpPanel-forum .error-msg {

background-color: gray; background-color: rgba(255, 255, 255, 0.5); bottom: 0; display: block; left: 0; position: absolute; right: 0; text-align: center; top: 0; }
 * 1) helpPanel-spinner.show {

/* fix for VisualEditor */ body.ve .WikiaSiteWrapper #WikiaNotifications { pointer-events: auto; }

/* animations */ @-moz-keyframes slidePanel { from { bottom: -2em; -webkit-opacity: 0; opacity: 0; }   to { bottom: 0; -webkit-opacity: 1; opacity: 1; } }

@-webkit-keyframes slidePanel { from { bottom: -2em; -webkit-opacity: 0; opacity: 0; }   to { bottom: 0; -webkit-opacity: 1; opacity: 1; } }

@-ms-keyframes slidePanel { from { bottom: -2em; -webkit-opacity: 0; opacity: 0; }   to { bottom: 0; -webkit-opacity: 1; opacity: 1; } }

@-o-keyframes slidePanel { from { bottom: -2em; -webkit-opacity: 0; opacity: 0; }   to { bottom: 0; -webkit-opacity: 1; opacity: 1; } }

@keyframes slidePanel { from { bottom: -2em; -webkit-opacity: 0; opacity: 0; }   to { bottom: 0; -webkit-opacity: 1; opacity: 1; } }

@-moz-keyframes fadeHPstep { from { -webkit-opacity: 0; opacity: 0; }   to { -webkit-opacity: 1; opacity: 1; } }

@-webkit-keyframes fadeHPstep { from { -webkit-opacity: 0; opacity: 0; }   to { -webkit-opacity: 1; opacity: 1; } }

@-ms-keyframes fadeHPstep { from { -webkit-opacity: 0; opacity: 0; }   to { -webkit-opacity: 1; opacity: 1; } }

@-o-keyframes fadeHPstep { from { -webkit-opacity: 0; opacity: 0; }   to { -webkit-opacity: 1; opacity: 1; } }

@keyframes fadeHPstep { from { -webkit-opacity: 0; opacity: 0; }   to { -webkit-opacity: 1; opacity: 1; } }