MediaWiki:Vector-darkmode.less/visualeditor.less
Jump to navigation
Jump to search
//
/* ==========================
VisualEditor
========================== */
/* ------------------
editing area
------------------ */
.ve-activated & {
// toolbar
.oo-ui-toolbar-bar {
background-color: @ooui-interface;
}
// undo invert from /ooui.less on certain icons
.oo-ui-iconElement-icon.oo-ui-icon-cancel,
// image preview when link is clicked
.ve-ui-mwInternalLinkContextItem-withImage .oo-ui-iconElement-icon {
filter: invert(0%);
}
// toolbar cite icon when link is selected
.oo-ui-tool:not(.oo-ui-toolGroupTool).oo-ui-tool-active {
background: @ooui-normal;
}
// hovering over toolbar buttons
.oo-ui-popupToolGroup-handle:hover,
.oo-ui-tool:not(.oo-ui-toolGroupTool).oo-ui-widget-enabled:hover,
.oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
background: @ooui-normal--hover;
border-color: @ooui-normal--hover; // border is the same as background in light mode
}
// toolbar button when dropdown is open
.oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
background: @ooui-normal;
}
// selected option in dropdown
.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-tool-active,
.oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
background: @ooui-normal--hover;
}
// dropdown
.oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
background: @ooui-interface;
border-color: @ooui-interface-border;
}
// dropdown option text
.oo-ui-tool-title {
color: @ooui-text;
}
// dropdown shortcut info on right
.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel {
color: fade( @ooui-text, 50% );
}
// toolbar borders
.oo-ui-toolbar-position-top > .oo-ui-toolbar-bar {
border-bottom-color: @ooui-interface-border;
}
// left-hand tool group
.oo-ui-menuToolGroup {
border-right-color: @ooui-interface-border;
border-left-color: @ooui-interface-border;
}
// right-hand tool group
.oo-ui-toolbar-actions .oo-ui-toolGroup {
border-left-color: @ooui-interface-border;
}
// border between right-hand tool group and save button
.oo-ui-toolbar-actions > .oo-ui-toolbar:not(:last-child) {
border-right-color: @ooui-interface-border;
}
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
background-color: #384766;
}
// more menus
.ve-ui-toolbar .oo-ui-toolbar-popups .oo-ui-toolGroup-tools {
background-color: @ooui-normal;
border: none;
.oo-ui-widget-disabled {
opacity: 0.34;
}
.oo-ui-tool-active .oo-ui-tool-link {
background-color: @ooui-normal;
}
}
.oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above,
.oo-ui-bookletLayout > .oo-ui-menuLayout-menu {
border-color: @ooui-interface-border;
}
// probably all disabled buttons
.oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link,
.oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
background-color: @ooui-disabled;
border-color: @ooui-disabled;
}
.oo-ui-widget-disabled .oo-ui-tool > .oo-ui-tool-link span.oo-ui-tool-title {
color: rgba(203,217,244,0.5);
}
// 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'] {
background: none;
border: none;
}
}
// "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
.ve-ui-specialCharacterPage-character {
border-color: @ooui-interface-border;
color: @ooui-text;
}
// when a link is selected
.ve-ce-linkAnnotation.ve-ce-annotation-active {
background: @cloud-burst;
box-shadow: 0 0 0 1px @pickled-bluewood;
}
/* ------------------
modals
------------------ */
// template editor modal
.ve-ui-mwTemplatePage-description,
.ve-ui-mwParameterPage-label,
.ve-ui-mwParameterPage-description-required,
.ve-ui-mwParameterPage-description-deprecated {
color: @ooui-text;
}
// 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;
}
// large thumbnail preview
.ve-ui-mwGalleryDialog-highlighted-image {
background-color: @ooui-interface;
}
// "Save your changes" modal
.ve-ui-mwSaveDialog {
color: @ooui-text;
}
.ve-ui-mwSaveDialog-options {
background-color: @ooui-interface;
border-color: @ooui-interface-border;
}
.ve-ui-mwSaveDialog-editSummary-count {
border-color: @ooui-interface-border;
}
.ve-ui-mwSaveDialog-license {
color: @ooui-text;
}
.ve-ui-mwReferenceContextItem-muted {
color: @ooui-text;
}
[data-diff-action='remove'],
table[data-diff-action='remove'] > caption,
figure[data-diff-action='remove'] > figcaption {
color: @white;
background: @old-brick !important;
box-shadow: 0 0 0 1px @old-brick;
}
[data-diff-action='insert'],
table[data-diff-action='insert'] > caption,
figure[data-diff-action='insert'] > figcaption {
color: @white;
background: @la-palma !important;
box-shadow: 0 0 0 1px @la-palma;
}
.ve-ui-mwLatexPage-symbol {
filter: invert(1);
}
.ve-ce-mwBlockImageNode {
figcaption {
background-color: @ooui-interface;
border-color: @ooui-interface-border;
}
.image,
.ve-ce-mwBlockImageNode-thumbimage {
background-color: @ooui-interface;
}
}
.ve-ui-overlay {
color: @ooui-text;
}
// 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-mwTransclusionDialog-multiple {
.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;
}
}