Page MenuHomeWickedGov Phorge
Files F4173422

mw.rcfilters.ui.HighlightColorPickerWidget.less
No OneTemporary
Actions

Size
3 KB
Referenced Files
None
Subscribers
None

mw.rcfilters.ui.HighlightColorPickerWidget.less
View Options

@import 'mediawiki.skin.variables.less';
@import 'mw.rcfilters.variables.less';
@import 'mw.rcfilters.mixins.less';
/* forced night mode */
// stylelint-disable-next-line selector-class-pattern
html.skin-theme-clientpref-night.client-js {
.mw-rcfilters-ui-highlightColorPickerWidget {
&-buttonSelect {
&-color {
&-none {
&.oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon.oo-ui-icon-check {
// Force check to be black for white background in night mode
filter: invert( 0 ) hue-rotate( 180deg );
}
}
}
}
}
}
.mw-rcfilters-ui-highlightColorPickerWidget {
&-label {
display: block;
font-weight: bold;
font-size: 1.1425em;
}
&-buttonSelect {
&-color {
.mw-rcfilters-circle( @min-size-circle-colorpicker, @size-circle-colorpicker, @margin-circle );
// Override OOUI rule from padded popup;
// We set margin-top as ≈0.357em≈5px for all circles so we get
// a consistent result
&.oo-ui-buttonElement {
margin-top: @margin-circle;
// Override OOUI rule on frameless :first-child buttons
&:first-child {
margin-left: 0;
}
}
// Make the rule much more specific to override OOUI
&.oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon.oo-ui-icon-check {
// Align centered horizontally within the color circle
top: -2px;
margin: auto;
left: (4 / @font-size-system-ui / @font-size-vector);
// Override OOUI rule on frameless icons
opacity: 1;
}
&-none {
.mw-rcfilters-circle-color( @highlight-none, true );
// Override `border-style` to `dashed`
border-style: dashed;
&.oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon.oo-ui-icon-check {
// Align centered horizontally in the dashed white circle with 1px border-width
top: -2px;
left: (3 / @font-size-system-ui / @font-size-vector);
margin: auto;
}
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-none;
}
}
&-c1 {
.mw-rcfilters-circle-color( @highlight-c1, false );
border-color: @highlight-c1;
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-c1;
}
}
&-c2 {
.mw-rcfilters-circle-color( @highlight-c2, true );
border-color: @highlight-c2;
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-c2;
}
}
&-c3 {
.mw-rcfilters-circle-color( @highlight-c3, true );
border-color: @highlight-c3;
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-c3;
}
}
&-c4 {
.mw-rcfilters-circle-color( @highlight-c4, true );
border-color: @highlight-c4;
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-c4;
}
}
&-c5 {
.mw-rcfilters-circle-color( @highlight-c5, true );
border-color: @highlight-c5;
&.oo-ui-buttonOptionWidget.oo-ui-buttonElement-active,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
&.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected {
background-color: @highlight-c5;
}
}
}
}
}

File Metadata

Mime Type
text/plain
Expires
Aug 20 2026, 07:17 (11 w, 3 d ago)
Storage Engine
local-disk
Storage Format
Raw Data
Storage Handle
61/a1/8d3928e1c5fbd249526a226fde2c
Default Alt Text
mw.rcfilters.ui.HighlightColorPickerWidget.less (3 KB)

Event Timeline