MediaWiki:Timeless.css: Difference between revisions

Revision as of 05:33, 23 September 2025

/* --- Make all buttons visibly dark in Timeless (OOUI + MWUI) --- */
.skin-timeless .mw-ui-button,
.skin-timeless .oo-ui-buttonElement .oo-ui-buttonElement-button,
.skin-timeless input[type="submit"],
.skin-timeless button[type="submit"] {
  background: #2b3036 !important;              /* use shorthand */
  color: #e6e6e6 !important;
  border: 1px solid #3b4046 !important;
  border-radius: 4px !important;
  padding: 0.35em 0.7em !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

/* Frameless/quiet OOUI buttons normally have no background—force one */
.skin-timeless .oo-ui-buttonElement-frameless .oo-ui-buttonElement-button,
.skin-timeless .oo-ui-flaggedElement-constructive .oo-ui-buttonElement-button,
.skin-timeless .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button {
  background: #2b3036 !important;
  border: 1px solid #3b4046 !important;
  color: #e6e6e6 !important;
}

/* Hover / focus / active states */
.skin-timeless .mw-ui-button:hover,
.skin-timeless .oo-ui-buttonElement .oo-ui-buttonElement-button:hover,
.skin-timeless input[type="submit"]:hover,
.skin-timeless button[type="submit"]:hover {
  background: #3a4047 !important;
  border-color: #4b5560 !important;
}

.skin-timeless .mw-ui-button:focus,
.skin-timeless .oo-ui-buttonElement .oo-ui-buttonElement-button:focus,
.skin-timeless input[type="submit"]:focus,
.skin-timeless button[type="submit"]:focus {
  outline: 2px solid #93c5fd !important;
  outline-offset: 2px !important;
}

/* If a control is actually disabled, keep it visible but slightly dim */
.skin-timeless .oo-ui-widget-disabled .oo-ui-buttonElement-button,
.skin-timeless .mw-ui-button[disabled],
.skin-timeless input[type="submit"][disabled],
.skin-timeless button[type="submit"][disabled] {
  background: #2b3036 !important;
  color: #9aa1a9 !important;
  border: 1px solid #3b4046 !important;
  opacity: .65 !important;             /* remove this line if you want full opacity */
  cursor: not-allowed !important;
}

/* Header search buttons (ids vary by page) */
.skin-timeless #searchButton,
.skin-timeless #mw-searchButton,
.skin-timeless #searchGoButton,
.skin-timeless #p-search input[type="submit"],
.skin-timeless #searchform input[type="submit"] {
  background: #2b3036 !important;
  color: #e6e6e6 !important;
  border: 1px solid #3b4046 !important;
  border-radius: 4px !important;
  padding: 0.25em 0.6em !important;
  box-shadow: none !important;
}