MediaWiki:Vector-darkmode.less/rc.less

// [[Special:RecentChanges]]

// Filter colors
@filter-icon-color-1: @venice-blue;
@filter-color-1: @filter-icon-color-1;
@filter-text-color1: @tropical-blue;
@filter-icon-color-2: @la-palma;
@filter-color-2: @filter-icon-color-2;
@filter-text-color2: @frost;
@filter-icon-color-3: @olive;
@filter-color-3: @filter-icon-color-3;
@filter-text-color3: @half-dutch;
@filter-icon-color-4: @korma;
@filter-color-4: @filter-icon-color-4;
@filter-text-color4: @lace;
@filter-icon-color-5: @old-brick;
@filter-color-5: @filter-icon-color-5;
@filter-text-color5: @bridesmaid;

// Date popup widget subtitle text color
.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {
    color: @dark-links;
}

// Make all search filter indicators have the same font color
.mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-labelElement-label {
    color: @dark-text;
}

// Namespaces and Tags buttons
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {
    background-color: @dark-wikitable-background;
    border-color: lighten( @dark-wikitable-background, 8% );
}

// Filter popup
// Make saved Filters popup text more readable
.mw-rcfilters-ui-savedLinksListWidget-placeholder.oo-ui-optionWidget .oo-ui-labelElement-label {
    color: @dark-text;
}
// Filters popup header
.mw-rcfilters-ui-filterMenuHeaderWidget-header {
	border-color: @dark-infobox-border;
	background-color: @dark-infobox-header;
}
// Filters popup subheaders
.mw-rcfilters-ui-filterMenuSectionOptionWidget {
	background-color: @dark-infobox-subheader;
}
// Filters popup entries with checkboxes
.mw-rcfilters-ui-filterMenuOptionWidget {
    border-color: @dark-infobox-border;
    // Muted entries
    &.oo-ui-flaggedElement-muted {
        background-color: @dark-wikitable-background;
    }
    // Entry label descriptions
	.mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
		color: @dark-links;
	}
}

// Filters popup footer
.mw-rcfilters-ui-menuSelectWidget-footer {
    background-color: @dark-wikitable-header;
    border-color: @dark-infobox-border;
}

// Saved filters menu item hover
.mw-rcfilters-ui-savedLinksListItemWidget:hover {
    // Yoinked from .oo-ui-buttonElement-framed.oo-ui-widget-enabled:not(.oo-ui-buttonElement-active) > .oo-ui-buttonElement-button:hover
    background-color: #384766;
    border-color: #475980;
}

// Currently/last selected filter when using the filter menu
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
    // Yoinked from .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button
    background-color: #2a4b8d;
    border-color: #2a4b8d;
    color: white;
}

// List of abbreviations float
.mw-changeslist-legend,
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
    background-color: @dark-wikitable-background;
    border-color: @dark-infobox-border;
    color: @dark-text;
}

// Highlight colors for recent changes
// Mixins
.filter-color( @filter-number, @filter-icon-color, @filter-color, @filter-text-color ) {
	.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey td:not(:nth-child(-n+2)),
    .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c@{filter-number} tr:first-child,
    .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c@{filter-number}.mw-rcfilters-ui-changesListWrapperWidget-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),
    .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c@{filter-number}.mw-rcfilters-ui-changesListWrapperWidget-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {
        background-color: transparent;
        .mw-title {
            background-color: @filter-color;
            a {
                color: @filter-text-color;
            }
        }
    }
    .mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color-c@{filter-number}.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
    .mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color-c@{filter-number}.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
    .mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color-c@{filter-number}.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
    .mw-rcfilters-ui-changesListWrapperWidget-highlights-color-c@{filter-number},
    .mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color-c@{filter-number},
    .oo-ui-buttonWidget.oo-ui-popupButtonWidget .oo-ui-buttonElement-button > .mw-rcfilters-ui-filterItemHighlightButton-circle-color-c@{filter-number},
    .mw-rcfilters-ui-tagItemWidget-highlight[data-color='c@{filter-number}']:before {
        background-color: @filter-icon-color;
    }
}
// Define filter color coding
.filter-color( 1, @filter-icon-color-1, @filter-color-1, @filter-text-color1 );
.filter-color( 2, @filter-icon-color-2, @filter-color-2, @filter-text-color2 );
.filter-color( 3, @filter-icon-color-3, @filter-color-3, @filter-text-color3 );
.filter-color( 4, @filter-icon-color-4, @filter-color-4, @filter-text-color4 );
.filter-color( 5, @filter-icon-color-5, @filter-color-5, @filter-text-color5 );


// Other review tools expandable menu at top
.client-js & .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
    border: 1px solid @dark-interface-border;
    background-color: @pickled-bluewood;
}

// legend
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
    background-color: @pickled-bluewood;
    border: 1px solid @dark-interface-border;
}

// Various icons
.mw-rcfilters-ui-filterWrapperWidget-top .oo-ui-iconElement-icon.oo-ui-image-invert,
.mw-rcfilters-ui-filterTagMultiselectWidget .oo-ui-iconElement-icon.oo-ui-image-invert,
.mw-rcfilters-ui-liveUpdateButtonWidget .oo-ui-iconElement-icon.oo-ui-image-invert,
.mw-rcfilters-ui-changesLimitAndDateButtonWidget .oo-ui-iconElement-icon.oo-ui-image-invert,
.mw-rcfilters-ui-filterMenuHeaderWidget-header .oo-ui-iconElement-icon.oo-ui-image-invert,
.mw-rcfilters-ui-itemMenuOptionWidget-highlightButton .mw-rcfilters-ui-filterItemHighlightButton-circle {
    filter: none !important;
}