wikimedia/mediawiki-extensions-MobileFrontend

@import 'mediawiki.skin.variables.less';

// We want these transitions to only occur when entering the editor, but not when leaving it.
// Leaving uses browser back navigation and we shouldn't "delay" it.
.ve-loading {
    // Intentionally slower than most UI animations to make the transition obvious to the user
    // (and loading the editor is probably going to take >500ms anyway).
    @timing: 400ms 100ms;

    .content .section-heading .indicator {
        transition: width @timing, min-width @timing, margin @timing, opacity @timing;
        flex-basis: 0;
        min-width: 0;
        margin-right: 0;
        opacity: 0;
    }

    .mw-editsection {
        transition: opacity @timing;
        opacity: 0;
    }

    .page-actions-menu {
        transition: border-bottom-color @timing;
        border-bottom-color: transparent;
    }

    .mw-body {
        transition: padding-bottom @timing, margin-bottom @timing, transform @timing;
        // Values set dynamically in JS code
    }
}

.ve-loadbasiceditor {
    text-align: center;
    position: absolute;
    left: 0;
    top: 3em;
    width: 100%;
    padding: 1em;
    box-sizing: border-box;
    background: @background-color-base;
    border-bottom: 1px solid @border-color-subtle;
    box-shadow: 0 1px 1px rgba( 0, 0, 0, 0.1 );
    visibility: hidden;
    transform: translateY( -100% );
    transition: transform 400ms ease;
    pointer-events: none;

    > p {
        text-align: left;
        font-weight: bold;
        margin-bottom: 1em;
    }
}

.toolbar-shown-done + .ve-loadbasiceditor {
    visibility: visible;
}

.ve-loadbasiceditor-shown {
    transform: translateY( 0 );
    pointer-events: auto;
}

// Note that these classes are also used by VisualEditor code for the real toolbar:
.toolbar-hidden {
    transform: translateY( -100% );
}

.toolbar-shown {
    transition: transform 250ms ease;
    transform: translateY( 0 );
    opacity: 1;
}

.toolbar-shown-done {
    /* Turn off transforms when done to avoid Safari rendering bugs (T202935) */
    transform: none;
}