MediaWiki:Common.less/visualeditor.less

/* ==========================

         VisualEditor
  ========================== */

// copy of MediaWiki:Vector-darkmode.less/visualeditor.less @ooui-text: var(--ooui-text); @ooui-interface: var(--ooui-interface); @ooui-interface-border: var(--body-border); @ve-toolbar-border: var(--body-mid);

// may look into https://www.mediawiki.org/wiki/VisualEditor/Gadgets#Gadget_-_Registering_VE_plugin // so ve-specific stuff will be all lazy loaded .ve-activated & {

// bad thumbnails figure[typeof~='mw:Image/Thumb'], figure[typeof~='mw:Video/Thumb'], figure[typeof~='mw:Audio/Thumb'], figure[typeof~='mw:Image/Frame'], figure[typeof~='mw:Video/Frame'], figure[typeof~='mw:Audio/Frame'] { border: none; background: none; > *:first-child > img { background: none; border: none; margin: 0; } }

figure[typeof~='mw:Image/Thumb'] > figcaption, figure[typeof~='mw:Video/Thumb'] > figcaption, figure[typeof~='mw:Audio/Thumb'] > figcaption, figure[typeof~='mw:Image/Frame'] > figcaption, figure[typeof~='mw:Video/Frame'] > figcaption, figure[typeof~='mw:Audio/Frame'] > figcaption { // same as .thumbcaption border: none; background-color: var(--thumb-caption-background); padding: 4px 6px; }

#catlinks:hover { background: var(--ooui-normal--hover); } }

// border atop special character menu .oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above { border-top-color: @ve-toolbar-border; }

// "Insert paragraph" button, maybe other things .ve-ce-branchNode-blockSlug, .ve-ce-branchNode-newSlug { outline-color: @ooui-interface-border; background-color: @ooui-interface; }

// special characters menu buttons // same as source editor .ve-ui-specialCharacterPage-character { border-color: var(--body-mid); &:hover { border-color: var(--body-dark); } }

// when a link is selected .ve-ce-linkAnnotation.ve-ce-annotation-active { box-shadow: 0 0 0 1px var(--body-mid); background: none; }

// inside link annotation box .ve-ui-desktopContext .ve-ui-linkContextItem .ve-ui-linkContextItem-label { border-color: @ooui-interface-border; }

// ve version number .ve-ui-mwHelpPopupTool-version-label, .ve-ui-mwHelpPopupTool-version-link, .ve-ui-mwHelpPopupTool-version-date { color: var(--byline-color); }

// unstyled tables .ve-ce-tableCellableNode { border-color: @ve-toolbar-border; }

// "There are no references on this page to include in this list." // even though there is, just because it doesnt recognise cites templates // with <ref> tags embeded inside them .ve-ce-mwReferencesListNode-muted { color: var(--byline-color); }

/* ------------------

        modals
  ------------------ */

// template editor modal .ve-ui-mwTemplatePage-description, .ve-ui-mwParameterPage-label, .ve-ui-mwParameterPage-description-required, .ve-ui-mwParameterPage-description-deprecated { color: var(--byline-color); }

// gallery modal .ve-ui-mwGalleryDialog-menuLayout > .oo-ui-menuLayout-menu, .ve-ui-mwGalleryDialog-innerMenuLayout > .oo-ui-menuLayout-menu, .ve-ui-mwGalleryDialog .ve-ui-mwGalleryDialog-image-container, .ve-ui-targetWidget { border-color: @ooui-interface-border; }

.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) { background-color: var(--body-main); }

// "Save your changes" modal .ve-ui-mwSaveDialog { color: var(--ooui-text); }

// box below edit summary box .ve-ui-mwSaveDialog-options { background-color: @ooui-interface; border-color: @ooui-interface-border; }

// char count remaining .ve-ui-mwSaveDialog-editSummary-count { border-color: @ooui-interface-border; }

.ve-ui-mwSaveDialog-license { color: var(--byline-color); }

.ve-ui-mwReferenceContextItem-muted { color: var(--byline-color); }

// borders inside edit notices .ve-ui-mwNoticesPopupTool-items > div:not(:first-child), .ve-ui-mwHelpPopupTool-item:not(:first-child) { border-color: @ooui-interface-border; }

// Templates config window .ve-ui-mwTemplateDialog {

.oo-ui-outlineControlsWidget { background: none; }

.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget, .ve-ui-mwTransclusionDialog-addParameterFieldset .ve-ui-mwParameterSearchWidget, .oo-ui-searchWidget-query { border-color: @ooui-interface-border; } }

// adding new parameters .ve-ui-mwParameterResultWidget { // parameter description &-description { color: inherit; }

&.oo-ui-optionWidget-highlighted { background-color: var(--ooui-normal--hover); } }

/* ------------------

     initialisation
  ------------------ */

.ve-init-mw-desktopArticleTarget-toolbarPlaceholder-floating .ve-init-mw-desktopArticleTarget-toolbarPlaceholder-bar { background: var(--ooui-interface); // based on `.oo-ui-toolbar-bar` }

.ve-init-mw-desktopArticleTarget-toolbarPlaceholder-bar { border-bottom-color: var(--body-mid); // `.oo-ui-toolbar-position-top > .oo-ui-toolbar-bar` }