mediawiki-extensions-Visual.../modules/ve-mw/preinit/styles/ve.init.mw.DesktopArticleTarget.init.less
Ed Sanders 6f5fe8cdb0 Position VE desktop loading bar with position:fixed
This doesn't change the position of the loading bar, but it keeps it
still if any scrolling happens. Previously we expected the user probably
wouldn't scroll while VE is loading, but in subsequent commits we
will trigger automatic scrolling in section editing mode.

Change-Id: I1404ccd77583d808ef79291c6cb4f561e76bd41c
2022-01-25 16:04:12 +00:00

142 lines
3.1 KiB
Plaintext

/*!
* VisualEditor MediaWiki DesktopArticleTarget init styles.
*
* @copyright 2011-2020 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/* stylelint-disable selector-max-id */
/*!
* State | <html> classes
* - mw.DesktopArticleTarget.init.css is loaded
* Reading | ve-available
* Loading editor | ve-available ve-activated ve-loading
* - mw.DesktopArticleTarget.css is loaded
* Activate editor | ve-available ve-activated ve-loading ve-activating
* Active | ve-available ve-activated ve-active
* Deactivate editor | ve-available ve-deactivating
* Deactivated | ve-available
*/
/* Only hide the #toc inside the original article, not generated ones in VE (T187636) */
.ve-active {
.ve-init-mw-desktopArticleTarget-editableContent #toc,
#siteNotice,
.mw-indicators,
#t-print,
#t-permalink,
#p-coll-print_export,
#t-cite,
.ve-init-mw-desktopArticleTarget-editableContent,
.ve-init-mw-tempWikitextEditorWidget {
display: none;
}
}
.ve-deactivating .ve-ui-surface {
display: none;
}
/* The surface needs to be measurable but not visible while
being setup as some nodes render based on their dimensions,
e.g. ve.ce.FocusableNode#updateInvisibleIcon */
.ve-activating .ve-ui-surface {
height: 0;
padding: 0 !important; /* stylelint-disable-line declaration-no-important */
overflow: hidden;
}
/* While loading, everything except the progress bar */
.ve-loading #content > :not( .ve-init-mw-desktopArticleTarget-loading-overlay ),
/* Once activated, all uneditable content except catlinks */
.ve-activated .ve-init-mw-desktopArticleTarget-uneditableContent {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
opacity: 0.5;
}
.ve-activated {
#firstHeading {
/* Override the styles above to allow the heading to be selected, for copy-pasting */
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
pointer-events: auto;
cursor: text;
a {
/* Re-disable any gadget-added links inside the heading, e.g. section 0 edit links */
pointer-events: none;
}
}
#catlinks {
cursor: pointer;
&:hover {
/* focusableNode highlight equivalent styling */
background: #e9f2fd;
}
a {
opacity: 1;
}
}
#content {
position: relative;
}
}
/* stylelint-enable selector-max-id */
.ve-init-mw-desktopArticleTarget-loading-overlay {
z-index: 1;
&-visual {
position: fixed;
}
&-source {
position: absolute;
width: 100%;
top: 0.875em;
}
}
.ve-init-mw-desktopArticleTarget-toolbarPlaceholder {
transition: height 250ms ease;
height: 0;
/* Toolbar placeholder is styled in theme files */
}
/* OOUI may not have loaded yet */
.oo-ui-element-hidden {
display: none !important; /* stylelint-disable-line declaration-no-important */
}
/* Section edit links */
.mw-editsection {
/* bidi isolation: */
unicode-bidi: -moz-isolate;
unicode-bidi: -webkit-isolate;
unicode-bidi: isolate;
&:before {
content: '\200B';
}
a {
white-space: nowrap;
}
}
.mw-editsection-divider {
color: #54595d;
}