MediaWiki:Vector.css: Difference between revisions

Revision as of 10:40, 22 September 2024

	:root {
		--translucent-background: rgba(25, 25, 25, 0.8);
		--search-background: rgba(75, 75, 75, 0.8);
		--infobox-background: rgba(75, 75, 75, 0.8);
		--fancyinfobox-background: linear-gradient(180deg, rgba(75,75,75,0.8) 0%, rgba(75,75,75,0.8) 96%, rgba(130,130,130,0.9) 100%);
		--menu-background: rgba(75, 75, 75, 0.96);
		--hatnote-background: rgba(75, 75, 75, 0.5);
		--body-background: #333;
		--text-color: #fff;
		--link-color: #ff7700;
		--visited-link-color: #c95e00;
		--filter: brightness(0) invert(1);
		--caption: #fff;
		--image-border: 2px solid #fff;
		--whiteblack: #222;
		--whitegrey: rgba(75, 75, 75, 0.8);
        --color-subtle: #ddd;
        --color-base:#fff;
        --background-color-base: #333;
        --background-color-interactive: #333;
	}

.vector-header-start > a.mw-logo:hover
{
  text-decoration: none;
}
.mw-logo-wordmark
{
  font-size: 1.5em;
  background-image: linear-gradient(#f7a654 25%, #d66c00, #872f00 85%);
  color: transparent;
  background-clip: text;
  transition: color 0.5s ease-in-out;
}
.mw-logo-wordmark:hover
{
  color: var(--text-color);
  transition: color 0.25s ease-in-out;
}

#pt-userpage-2 > a, #pt-userpage-2 > a:visited, #pt-mytalk > a, #pt-preferences > a, #pt-mycontris > a, #pt-logout > a, #pt-mytalk > a:visited, #pt-preferences > a:visited, #pt-mycontris > a:visited, #pt-logout > a:visited
{
  color: var(--text-color) !important;
}

a, .vector-toc-link {
    color:var(--link-color);
}
a:visited {
    color:var(--visited-link-color);
}
a:active{
    color:var(--link-color);
}

.vector-toc-link
{
  color: var(--link-color) !important;
}
 
body, html
{
   background-color: var(--background-color-base);
   color: var(--text-color);
}
.catlinks
{
  background-color:#fff0;
  border:0;
}
.mw-heading, h1, h2, h3, h4, h5, h6
{
   color: var(--text-color);
} 

.vector-menu-tabs .mw-list-item.selected a, .vector-menu-tabs .mw-list-item.selected a:visited, .vector-menu-tabs .mw-list-item.vector-tab-noicon a:focus, .vector-menu-tabs .mw-list-item.vector-tab-noicon a:hover, .vector-menu-tabs .mw-list-item a
{
 color: var(--text-color);
}

.vector-pinned-container
{
   background-color:#fff0  !important;
   color: var(--text-color);
}

.vector-dropdown-content
{
   background-color:#222 !important;
   color: #fff;
}

.vector-pinnable-header-toggle-button
{
  background-color:#111;
  color:#fff; 
}
.vector-pinnable-header-toggle-button:hover
{
  background-color:#444;
}

.vector-toc-contents
{
color: var(--text-color);
}
.vector-sitenotice-container
{
   display:none;
}
.cdx-button
{
  background-color:#666;
  border-color: transparent;
}
.cdx-button:enabled, .cdx-button.cdx-button--fake-button--enabled
{
  background-color:#666;
  border-color: transparent;
}
.cdx-button:enabled:hover, .cdx-button.cdx-button--fake-button--enabled:hover
{
  background-color:#999;
  border-color: #000;
}
.cdx-text-input__input:enabled
{
  border: 0;
  background-color:#222;
  color:#ddd;
}
.cdx-text-input__input:enabled:hover
{
  background-color:#111;
  border: 1px solid #000;
  color:#fff;
}
.cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon
{
  color:#333;
}
.cdx-text-input__input:enabled:focus ~ .cdx-text-input__icon-vue
{
  color:#555 !important;
}
.mw-page-title-main, #firstHeading
{
  font-size:2em;
}

.oo-ui-popupWidget-popup
{
  background-color:#222;
  color: var(--text-color);
}
.vector-pinnable-element .mw-list-item a, .vector-dropdown-content .mw-list-item a, #pt-userpage-2 a:not(.mw-selflink)
{
 color:var(--link-color);
}
.vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited, .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited
{
   color: var(--visited-link-color);
}

.mwe-popups .mwe-popups-extract
{
  color: var(--text-color) ;
}
 html.skin-theme-clientpref-os .mwe-popups-extract[dir="ltr"]::after
{
   background-image: linear-gradient(to right,rgba(0,0,0,0),#111 50%) !important;
}
html.skin-theme-clientpref-os .mwe-popups
{
   box-shadow: 0 30px 90px -20px rgba(0,0,0,0.3),0 0 1px 1px rgba(0,0,0,0.05);
}

.wikitable
{
  background-color:transparent;
  color: var(--text-color);
}

.wikitable > tr > th, .wikitable > * > tr > th {
  background-color: #8a400077;
  color:#fff;
}