MediaWiki:Gadget-GreenUI.css

/* Style the UI elements green */

/* CategoryTree */
.CategoryTreeToggle {
	color: #080;
}

/* Buttons */
.createboxButton,
.bodySearchWrap .mw-ui-button {
	padding-top: 6px;
	padding-bottom: 7px;
}
.mw-ui-button.mw-ui-progressive:not(:disabled) {
	background-color: #080;
	border-color: #080;
}
.mw-ui-button.mw-ui-progressive:not(:disabled):hover {
	background-color: #0a0;
	border-color: #0a0;
}
.mw-ui-button.mw-ui-progressive:not(:disabled):focus {
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.mw-ui-button.mw-ui-progressive:not(:disabled).is-on,
.mw-ui-button.mw-ui-progressive:not(:disabled):active,
.mw-ui-button.mw-ui-progressive:not(:disabled).mw-ui-checked {
	background-color: #060;
	border-color: #060;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet {
	color: #080;
	background-color: transparent;
	border-color: transparent;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet:hover,
input[type="checkbox"]:hover + .mw-ui-button.mw-ui-progressive.mw-ui-quiet {
	color: #0a0;
	background-color: rgba(52,255,123,0.1);
}
.mw-ui-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet:focus,
input[type="checkbox"]:focus + .mw-ui-button.mw-ui-progressive.mw-ui-quiet {
	color: #080;
	border-color: #080;
}
.mw-ui-button.mw-ui-quiet:focus,
.mw-ui-button.mw-ui-quiet.mw-ui-progressive:focus,
.mw-ui-button.mw-ui-quiet.mw-ui-destructive:focus,
input[type="checkbox"]:focus + .mw-ui-button.mw-ui-quiet,
input[type="checkbox"]:focus + .mw-ui-button.mw-ui-quiet.mw-ui-progressive,
input[type="checkbox"]:focus + .mw-ui-button.mw-ui-quiet.mw-ui-destructive {
	color: #080;
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.mw-ui-input:focus, .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
	outline: 0;
}

/* Radio buttons */
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span {
	border-color: #080;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:hover + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked:hover + span {
	border-color: #0a0;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked:active + span {
	border-color: #060;
	box-shadow: #060;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:active + span {
	background-color: #060;
	border-color: #060;
}
:focus {
	outline-color: #080;
}

/* Checkboxes */
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:hover + label::before {
	border-color: #080;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:focus + label::before {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:active + label::before {
	background-color: #060;
	border-color: #060;
	box-shadow: inset 0 0 0 1px #060,inset 0 0 0 2px #fff;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked + label::before {
	background-color: #080;
	border-color: #080;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked:hover + label::before {
	background-color: #0a0;
	border-color: #0a0;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked:focus + label::before {
	background-color: #080;
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.client-js .mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked:active + label::before {
	background-color: #060;
	border-color: #060;
}

/* Calendar widget */
.mw-widget-calendarWidget-item:hover {
	background-color: #080;
}
.mw-widget-calendarWidget-day-today {
	box-shadow: inset 0 0 0 1px #080;
}
.mw-widget-calendarWidget-item-selected {
	background-color: #060;
}

/* Text input */
.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover input:focus,
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover textarea:focus {
	border-color: #080;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled textarea.oo-ui-inputWidget-input:focus {
	outline: 1px solid #080;
}

/* WikiEditor */
.wikiEditor-ui-toolbar .tabs span.tab a {
	color: #080;
}
.wikiEditor-ui-toolbar .booklet > .index > .current {
	color: #080;
	background-color: #eafff3;
}

/* LinkSuggest */
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover,
.ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
	color: #060;
	border-color: #0a0;
	background: linear-gradient(to top, rgba(0,255,0,0.25), transparent);
}

/* Edit page */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
	background-color: #080;
	border-color: #080;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
	background-color: #0a0;
	border-color: #0a0;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
	background-color: #060;
	border-color: #060;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked + span {
	background-color: #080;
	border-color: #080;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:hover + span {
	border-color: #080;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:focus + span {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:hover + span {
	background-color: #0a0;
	border-color: #0a0;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:active + span {
	background-color: #060;
	border-color: #060;
	box-shadow: inset 0 0 0 1px #060;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:focus + span {
	border-color: #080;
	background-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}

/* Mobile */
.oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:focus {
	box-shadow: inset 0 0 0 1px #080,0 0 0 1px #080;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-iconElement > .oo-ui-buttonElement-button:focus,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-labelElement > .oo-ui-buttonElement-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
	border-color: #0a0;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus {
	background-color: #060;
	border-color: #060;
	box-shadow: inset 0 0 0 1px #060;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
	background-color: #080;
	border-color: #080;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {
	background-color: #060;
	border-color: #060;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus {
	border-color: #080;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active:hover {
	background-color: #0a0;
	border-color: #0a0;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
	background-color: #060;
	border-color: #060;
}

/* Create account */
body.skin-timeless:not(.mobile) #mw-createaccount-join,
body:not(.skin-minerva):not(.skin-timeless) #mw-createaccount-join {
	color: #080;
}
body.skin-timeless:not(.mobile) #mw-createaccount-join:hover,
body:not(.skin-minerva):not(.skin-timeless) #mw-createaccount-join:hover {
	border-color: #0b0;
}
body.skin-timeless:not(.mobile) #mw-createaccount-join:active,
body:not(.skin-minerva):not(.skin-timeless) #mw-createaccount-join:active {
	background-color: #d8f0db;
	border-color: #080;
	color: #060;
}
body.skin-timeless:not(.mobile) #mw-createaccount-join:focus,
body:not(.skin-minerva):not(.skin-timeless) #mw-createaccount-join:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}

/* Window manager */
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
	background-color: #eafff3;
	color: #080;
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
.oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
	background-color: rgba(41,204,98,0.1);
	color: #080;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
	color: #080;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
	border-color: #080;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
	background-color: #eff3fa;
	border-color: #2a8d4b;
	color: #2a8d4b;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {
	border-color: #080;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080;
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
	color: #080;
	box-shadow: inset 0 -2px 0 0 #080;
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
	color: #0a0;
	box-shadow: inset 0 -2px 0 0 #0a0;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
	border-color: #d33;
}
.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:focus {
	border-color: #080;
}

/* Visual editor */
.ve-init-mw-progressBarWidget {
	border-color: #080;
}
.ve-init-mw-progressBarWidget-bar,
.oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {
	background: #080;
}
.mw-pulsating-dot::before, .mw-pulsating-dot::after {
	background-color: #080;
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
	background-color: #080;
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
	background-color: #0a0;
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active:focus, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link {
	background-color: #060;
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:focus {
	outline: 1px solid #080;
}

/* JavaScript recent changes */
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
	color: #080;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
	color: #0a0;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
	color: #060;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus, .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
	border-color: #080;
	box-shadow: inset 0 0 0 1px #080,inset 0 0 0 2px #fff;
}