MediaWiki:Common.css/src/system/OOUI/widgets/TabOptionWidget.scss
This page is one of the SCSS pages which are the basis for MediaWiki:Common.css. After you edit this page, you will need to recompile them for your changes to take effect. See Terraria Wiki:CSS to learn more.
Ancestors: / src / system / OOUI / widgets / TabOptionWidget.scss
Siblings: ButtonGroupWidget.scss ButtonSelectWidget.scss CheckboxInputWidget.scss DropdownInputWidget.scss DropdownWidget.scss LabelWidget.scss MenuOptionWidget.scss MenuSectionOptionWidget.scss MenuSelectWidget.scss MessageWidget.scss MultioptionWidget.scss OptionWidget.scss OutlineOptionWidget.scss OutlineSelectWidget.scss PopupWidget.scss ProgressBarWidget.scss RadioInputWidget.scss RadioSelectWidget.scss SelectFileWidget.scss TabOptionWidget.scss TabSelectWidget.scss TagItemWidget.scss TagMultiselectWidget.scss TextInputWidget.scss ToggleButtonWidget.scss ToggleSwitchWidget.scss
Children: (none)
/********* OOUI: TabOptionWidget *********/
/* overwriting styles from here:
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/styles/widgets/TabOptionWidget.less
* https://gerrit.wikimedia.org/r/plugins/gitiles/oojs/ui/+/refs/heads/master/src/themes/wikimediaui/widgets.less */
.oo-ui-tabOptionWidget {
color: var(--ooui--taboption-color);
.oo-ui-tabSelectWidget-framed & {
&.oo-ui-optionWidget-selected {
background-color: var(--ooui--tabselect-selected-background-color);
color: var(--theme-text-color);
.oo-ui-labelElement-label {
border-bottom-color: var(--ooui--tabselect-selected-background-color);
}
}
&.oo-ui-widget-enabled {
&:hover {
background-color: var(--ooui--tabselect-highlighted-background-color);
color: var(--theme-text-color);
}
&:active {
background-color: var(--ooui--tabselect-selected-background-color);
color: var(--theme-text-color);
}
&.oo-ui-optionWidget-selected:hover {
background-color: var(--ooui--tabselect-selected-background-color);
}
}
}
.oo-ui-tabSelectWidget-framed.oo-ui-widget-enabled:focus &.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
border-bottom-color: var(--theme-text-color);
}
.oo-ui-tabSelectWidget-frameless & {
&.oo-ui-optionWidget-selected {
color: var(--ooui--tabselect-frameless-selected-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-selected-box-shadow-color);
}
&.oo-ui-widget-enabled:not( .oo-ui-optionWidget-selected ) {
&:hover {
color: var(--ooui--tabselect-frameless-highlighted-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-highlighted-color);
}
&:active {
color: var(--ooui--tabselect-frameless-selected-color);
box-shadow: inset 0 -2px 0 0 var(--ooui--tabselect-frameless-selected-color);
}
}
}
.oo-ui-tabSelectWidget-frameless.oo-ui-widget-enabled:focus &.oo-ui-optionWidget-selected {
box-shadow: inset 0 0 0 2px var(--ooui--tabselect-frameless-selected-box-shadow-color);
}
}