MediaWiki:EditorsStyling.css

From Apex Legends Wiki
Jump to navigation Jump to search

In other languages: Português do Brasil

CSS and Javascript changes must comply with the wiki design rules.

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/***********************
* Buttons styling *
************************/
.mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected,
.mw-rcfilters-ui-menuSelectWidget-body,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button {
  background-color:var(--theme-box-color);
  color:var(--theme-text-color);
  border-color:var(--theme-box-border-color)
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button:hover {
  background-color:var(--theme-box-hover-color);
  color:var(--theme-text-color);
  border-color:var(--theme-box-border-color)
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:focus+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:focus+span {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:hover,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:hover+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:hover+span {
  background-color:var(--theme-button-hover-color);
  border-color:var(--theme-button-hover-color);
}

.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-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,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:active+span, 
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:active+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:active+span {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
  filter: brightness(0.8);
}

.oo-ui-checkboxInputWidget [type='checkbox'] + span {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-borders-color);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span {
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span {
  border-color:var(--theme-button-color)
}
.oo-ui-checkboxInputWidget [type='checkbox']:disabled + span {
  background-color:var(--theme-borders-color);
  border-color:var(--theme-borders-color);
}
@media screen {
  :focus {
    outline-color: var(--theme-button-color);
  }
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:checked:focus+span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]:indeterminate:focus+span {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color),inset 0 0 0 2px #fff;
}
/***********************
* Dropdown menu styling *
************************/
.oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
  background-color:var(--theme-typebox-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
  background-color:var(--theme-typebox-color);
  color:var(--theme-text-color);
}
.oo-ui-dropdownWidget-handle {
  border:1px solid var(--theme-borders-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
  background-color:var(--theme-box-color);
  color:var(--theme-text-color);
  border-color:var(--theme-text-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active {
  color:var(--theme-borders-color);
  border-color:var(--theme-button-color);
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
}
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
  color:var(--theme-text-color);
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color)
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color)
}
.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:var(--theme-highlight-color);
  color:var(--theme-text-color)
}

/***********************
* Text input styling *
************************/
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-box-border-color);
  color:var(--theme-text-color)
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {
  border-color:var(--theme-button-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled {
  background-color:var(--theme-typebox-color);
}
.oo-ui-tagMultiselectWidget-handle {
  border:1px solid var(--theme-borders-color);
}
.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input {
  color:var(--theme-text-color);
}
/***********************
* Source editor styling *
************************/

textarea {
  background-color: var(--theme-typebox-color);
  color: var(--theme-text-color)
}
.wikiEditor-ui .wikiEditor-ui-view {
  border:1px solid var(--theme-box-border-color);
}
.wikiEditor-ui .wikiEditor-ui-top {
  border-bottom:1px solid var(--theme-box-border-color)
}
.wikiEditor-ui-toolbar .tabs span.tab a,
.wikiEditor-ui-toolbar .tabs span.tab a:visited,
.wikiEditor-ui-toolbar .tabs span.tab a.current,
.wikiEditor-ui-toolbar .group .tool-select .label,
.wikiEditor-ui-toolbar .group .label {
  color:var(--theme-text-color);
}

.wikiEditor-ui-toolbar {
  background-color: var(--theme-box-color);
}
.wikiEditor-ui-toolbar .group,
.wikiEditor-ui-toolbar .section-secondary .group {
  border-color:var(--theme-box-border-color);
}
.wikiEditor-ui-toolbar .sections .section {
  background-color:var(--theme-box-color);
  border-top:1px solid var(--theme-box-border-color);
  color:var(--theme-text-color)
}
.wikiEditor-ui-toolbar .page-characters div span {
  border:1px solid var(--theme-box-border-color);
  color:var(--theme-text-color)
}
.wikiEditor-ui-toolbar .page-characters div span:hover {
  background-color:var(--theme-box-hover-color);
  border-color:var(--theme-text-color);
}
.wikiEditor-ui-toolbar .booklet .index .current {
  background-color:var(--theme-body-color);
  color:var(--theme-link-color)
}
.wikiEditor-ui-toolbar .booklet > .index > :hover {
  background-color:var(--theme-box-hover-color);
}
.wikiEditor-ui-toolbar .page-table th,
.wikiEditor-ui-toolbar .page-table td {
  color:var(--theme-text-color)
}
.wikiEditor-ui-toolbar .page-table td {
  border-top:1px solid var(--theme-box-border-color)
}
#msupload-div {
  background:var(--theme-box-color);
  border-top:1px solid var(--theme-box-border-color);
}
#msupload-dropzone {
  border: 1px dashed var(--theme-borders-color);
  color:var(--theme-text-color);
}
.editOptions {
  background-color:var(--theme-box-color);
  color: var(--theme-text-color);
  border-color: var(--theme-box-border-color);
}

.wikiEditor-preview-contents {
    background: rgba(0,0,0,0);
    background-color: rgba(255,255,255,0.2);
    border-color: black;
    border-style: solid;
    border-width: 0 1px 1px;
    color: #000000
}

.wikiEditor-preview-contents,.wikiEditor-preview-loading {
    background-color: transparent
}

input#wpSummary {
    margin-bottom: 1em;
    margin-top: 1em;
    width: 80%
}

.pagetab {
    border-style: solid solid none;
    border-width: thin;
    border-color: #808080;
    padding: 0.25ex 1ex 0ex;
    font-size: 95%
}

td.diff-context {
  color:var(--theme-text-color)
}

.oo-ui-toolbar {
  clear: none;
}
.tool-button:hover,
.tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button:hover {
  background-color:var(--theme-box-hover-color);
}
.ve-ui-toolbar-floating > .oo-ui-toolbar-bar {
  top: 35px;
  left: 0;
  right: 0;
}
.mw-body .ve-init-mw-desktopArticleTarget-toolbar, .ve-init-mw-desktopArticleTarget-toolbarPlaceholder {
  margin: 0;
}

/***********************
* Source editor with the highlighter tool on styling *
************************/
.CodeMirror {
  background:var(--theme-typebox-color);
  color:var(--theme-text-color);
}

.CodeMirror-gutters {
  border-right:1px solid var(--theme-box-border-color);
  background-color:var(--theme-box-color);
}

.CodeMirror-linenumber {
  color:var(--theme-borders-color);
}

.cm-mw-link-ground,
.cm-mw-ext-link-ground,
.cm-mw-template-link-ground {
  background-color:var(--theme-box-color);
}

.cm-mw-link-pagename,
.cm-mw-link-bracket,
.cm-mw-link-delimiter,
.cm-mw-extlink,
.cm-mw-free-extlink,
.cm-mw-extlink-protocol,
.cm-mw-free-extlink-protocol,
.cm-mw-extlink-bracket {
  color:var(--theme-link-color);
}

.cm-mw-exttag-bracket,
.cm-mw-exttag-attribute,
.cm-mw-htmltag-bracket,
.cm-mw-htmltag-attribute,
.cm-mw-exttag-name,
.cm-mw-htmltag-name {
  color:var(--theme-green-color);
}

.cm-mw-template-name,
.cm-mw-template-argument-name,
.cm-mw-template-delimiter,
.cm-mw-template-bracket {
  color:var(--theme-purple-color);
}

.cm-mw-template {
  color:var(--theme-epic-color);
}

.cm-mw-table-definition,
.cm-mw-table-bracket,
.cm-mw-table-delimiter {
  color:var(--theme-pink-color);
}

.cm-mw-link,
.cm-mw-link-tosection,
.cm-mw-section-header,
.cm-mw-apostrophes-bold,
.cm-mw-apostrophes-italic,
.cm-mw-list,
.cm-mw-indenting {
  color:var(--theme-blue-color);
}

.cm-mw-parserfunction-name,
.cm-mw-parserfunction-bracket,
.cm-mw-parserfunction-delimiter,
.cm-mw-templatevariable,
.cm-mw-templatevariable-bracket,
.cm-mw-templatevariable-name,
.cm-mw-templatevariable-delimiter {
  color:var(--theme-yellow-color);
}

/***********************
* Visual editor styling *
************************/
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
  background-color:var(--theme-box-hover-color);
}
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
  background-color:var(--theme-box-hover-color);
}

/***********************
* Code editor styling *
************************/
.ace-tm {
  background-color: var(--theme-typebox-color);
  color: var(--theme-text-color);
}
.ace-tm .ace_gutter {
  background: var(--theme-box-color);
  color: var(--theme-text-color);
}
.ace-tm .ace_marker-layer .ace_active-line {
  background: var(--theme-box-hover-color);
}
.ace-tm .ace_gutter-active-line {
  background-color : var(--theme-box-border-color);
  color: var(--theme-text-color)
}
.ace_gutter-cell {
  color:var(--theme-borders-color);
}
.ace-tm .ace_cursor {
  color: var(--theme-text-color);
}
.ace-tm .ace_support.ace_type,
.ace-tm .ace_support.ace_class,
.ace-tm .ace_storage,
.ace-tm .ace_keyword,
.ace-tm .ace_support.ace_function {
  color: var(--theme-green-color);
}
.ace-tm .ace_variable {
  color: var(--theme-blue-color);
}
.ace-tm .ace_string {
  color: var(--theme-red-color);
}
.ace-tm .ace_comment {
  color: var(--theme-borders-color);
}
.ace-tm .ace_constant,
.ace-tm .ace_constant.ace_numeric {
  color: var(--theme-orange-color);
}
.ace-tm .ace_support.ace_constant {
  color: var(--theme-pink-color);
}
.codeEditor-status {
  background-color:var(--theme-box-color);
  border-top:1px solid var(--theme-box-border-color);
}
.codeEditor-status-message {
  border-left:1px solid var(--theme-box-border-color);
  border-right:1px solid var(--theme-box-border-color);
}
.ace-tm .ace_print-margin {
  background: none;
}

/***********************
* Code page styling *
************************/
@media screen {
  pre, code, .mw-code {
    background-color: var(--theme-typebox-color);
    color: var(--theme-text-color);
    border: 1px solid var(--theme-box-border-color);
  }
}
.mw-content-ltr.mw-highlight-lines pre,
.mw-content-ltr.content .mw-highlight-lines pre {
  box-shadow:inset 2.75em 0 0 var(--theme-box-color);
}
.mw-highlight .linenos {
  color:var(--theme-borders-color);
}
.mw-highlight a:hover .linenos,
.mw-highlight .hll a .linenos {
  color:var(--theme-text-color);
}
.mw-highlight .c {
  color:var(--theme-borders-color);
}
.mw-highlight .k,
.mw-highlight .nb,
.mw-highlight .nt {
  color:var(--theme-green-color);
}
.mw-highlight .s2,
.mw-highlight .sx {
  color:var(--theme-red-color);
}
.mw-highlight .nc,
.mw-highlight .nn {
  color:var(--theme-blue-color);
}
.mw-highlight .nf {
  color:var(--theme-rare-color);
}
.mw-highlight .nv,
.mw-highlight .s1 {
  color:var(--theme-cyan-color);
}
.mw-highlight .nd {
  color:var(--theme-purple-color);
}
.mw-highlight .mf,
.mw-highlight .mh,
.mw-highlight .mi {
  color:var(--theme-orange-color);
}
.mw-highlight .kc {
  color:var(--theme-pink-color);
}
.mw-highlight .kt {
  color:var(--theme-common-color);
}
.mw-highlight .cp {
  color:var(--theme-yellow-color);
}
.mw-highlight .o {
  color:var(--theme-box-border-color);
}

/***********************
* Recent changes page styling *
************************/
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
  background-color:var(--theme-box-color);
  border-color:var(--theme-box-border-color);
  border-right: 5px solid var(--theme-box-accent-color)
}
.oo-ui-toolbar-bar {
  background-color:var(--theme-box-color);
  color:var(--theme-text-color);
}
.oo-ui-toolbar-position-top > .oo-ui-toolbar-bar {
  border-bottom:1px solid var(--theme-box-border-color);
}
.oo-ui-menuToolGroup {
  border-left:1px solid var(--theme-box-border-color);
  border-right:1px solid var(--theme-box-border-color);
}
.oo-ui-popupToolGroup-tools {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
}
.mw-rcfilters-ui-filterMenuHeaderWidget-header {
  border-bottom: 1px solid var(--theme-box-border-color);
  background-color: var(--theme-box-color);
}
.mw-rcfilters-ui-filterMenuHeaderWidget-title {
  color: var(--theme-text-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
  color: var(--theme-borders-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) {
  border-bottom: 1px solid var(--theme-box-border-color);
}
.mw-rcfilters-ui-menuSelectWidget-footer {
  background-color: var(--theme-box-color);
  border-top: 1px solid var(--theme-box-border-color);
}
.mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget {
  color: var(--theme-text-color);
}
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {
  background-color: var(--theme-box-color);
}
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-title, .mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
  color: var(--theme-common-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget:hover {
  background-color: var(--theme-box-hover-color);
}
.oo-ui-menuSelectWidget {
  background-color: var(--theme-box-color);
  border: 1px solid var(--theme-box-border-color);
}

.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-highlighted {
  background-color:var(--theme-typebox-color);
}
.mw-rcfilters-ui-itemMenuOptionWidget-view-namespaces {
  border-top:4px solid var(--theme-box-border-color);
}
.mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator {
  margin:5px 0;
  border-top:2px dashed var(--theme-borders-color);
}

.oo-ui-tagItemWidget.oo-ui-widget-enabled {
  color:var(--theme-text-color);
}
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
  background-color:var(--theme-typebox-color);
}
.oo-ui-tagItemWidget {
  border:1px solid var(--theme-borders-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
  color:var(--theme-text-color);
  border-color:var(--theme-text-color);
}
.oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
  outline:1px solid transparent
}

.mw-userlink {
  font-size: small;
}
.mw-usertoollinks.mw-changeslist-links {
  font-size: smaller;
}

.mw-plusminus-pos {
  color:var(--theme-green-color);
}
.mw-plusminus-neg {
  color:var(--theme-pink-color);
}
.mw-plusminus-null {
  color:var(--theme-common-color);
}
.unpatrolled {
  color:var(--theme-red-color);
}
.autocomment,
.autocomment a,
.autocomment a:visited {
  color:var(--theme-borders-color);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button {
  color:var(--theme-link-color);
  border-radius: 6px;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:hover {
  color:var(--theme-link-color);
  background-color: var(--theme-highlight-color);
}
.oo-ui-iconElement-icon.oo-ui-icon-reload.oo-ui-image-progressive {
  filter: var(--theme-link-color-filter);
}
.client-js .mw-rcfilters-spinner .mw-rcfilters-spinner-bounce,
.client-js .mw-rcfilters-spinner::before,
.client-js .mw-rcfilters-spinner::after {
  background-color:var(--theme-link-color);
}

/***********************
* Revision differences styling *
************************/
table.diff {
    background: transparent
}
.diff-context {
  border-color:var(--theme-borders-color);
}
td.diff-context {
  background: none repeat scroll 0 0 transparent;
  color:var(--theme-text-color);
}
td.diff-addedline {
  background-color: rgba(66,223,249,0.3);
  border-color: rgba(66,223,249,0.4);
}
td.diff-deletedline {
  background-color: rgba(246,223,36,0.3);
  border-color: rgba(246,223,36,0.4);
}
.diff-addedline .diffchange {
  background: rgba(66,223,249,0.5);
}
.diff-deletedline .diffchange {
  background: rgba(246,223,36,0.5);
}

.mw-diff-inline-added ins,
.mw-diff-inline-changed ins,
.mw-diff-inline-moved ins,
.mw-diff-table-prefix .mw-diff-inline-legend .mw-diff-inline-legend-ins {
  background-color: rgba(66,223,249,0.3);
  box-shadow: 0 0 0 1px rgba(66,223,249,0.5);
}
.mw-diff-inline-deleted del,
.mw-diff-inline-changed del,
.mw-diff-inline-moved del,
.mw-diff-table-prefix .mw-diff-inline-legend .mw-diff-inline-legend-del {
  background-color: rgba(246,223,36,0.3);
  box-shadow: 0 0 0 1px rgba(246,223,36,0.5);
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active>.oo-ui-buttonElement-button {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color);
  border-color:var(--theme-borders-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active>.oo-ui-buttonElement-button:hover {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color);
  border-color:var(--theme-button-hover-color);
}
.oo-ui-iconElement-icon.oo-ui-icon-wikiText.oo-ui-image-invert {
  filter: brightness(10%);
}

/***********************
* Popup box styling *
************************/
.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
  background-color:var(--theme-box-color);
}
.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
  border:1px solid var(--theme-box-border-color);
}
.oo-ui-messageDialog-message {
  color:var(--theme-text-color);
}
.oo-ui-messageDialog-content > .oo-ui-window-foot {
  outline:1px solid var(--theme-box-border-color);
}
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
  border-right:1px solid var(--theme-box-border-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button:focus {
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
}

/***********************
* Popup bubble styling *
************************/
.oo-ui-popupWidget-popup {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
}
.mw-rcfilters-ui-tagItemWidget-popup-content {
  color:var(--theme-text-color);
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before,
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:before,
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:before {
  border-top-color:var(--theme-box-border-color);
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after,
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:after,
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:after {
  border-top-color:var(--theme-box-color);
}

/***********************
* Dialog box styling *
************************/
.ui-dialog {
  border:1px solid var(--theme-box-border-color);
}
.ui-widget-content {
  background:var(--theme-box-color);
  color:var(--theme-text-color);
}
body .ui-dialog .ui-widget-header {
  background:var(--theme-body-color) !important;
}
.ui-widget-header {
  border:1px solid var(--theme-box-border-color);
  color:var(--theme-text-color);
}
.mw-wikiEditor-InsertLink-TitleInputField .oo-ui-messageWidget {
  color:var(--theme-borders-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked+span {
  border-color:var(--theme-button-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:checked:hover+span {
  background-color: var(--theme-box-hover-color);
  border-color:var(--theme-button-color);
}
.oo-ui-radioInputWidget [type=radio]+span {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-box-border-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:hover+span {
  border-color:var(--theme-button-color);
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type=radio]:active+span {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
  filter: brightness(0.8);
}
.wikiEditor-toolbar-dialog .ui-dialog-buttonpane {
  border-top:1px solid var(--theme-box-border-color) !important;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  color:var(--theme-button-color);
}
body .ui-button {
  border:1px solid var(--theme-box-border-color) !important;
  background:var(--theme-box-color) !important;
}
body .ui-button:hover {
  color:var(--theme-text-color);
  border-color:var(--theme-button-color) !important;
  background:var(--theme-box-hover-color) !important;
}
body .ui-button:active {
  background:  var(--theme-box-color) !important;
  border-color: var(--theme-box-border-color) !important;
  filter: brightness(0.7);
}

/***********************
* Toggle switch styling *
************************/
.oo-ui-toggleSwitchWidget {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
  background-color:var(--theme-box-hover-color);
  border-color:var(--theme-box-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
  background-color:var(--theme-typebox-color);
  border:1px solid var(--theme-box-border-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-button-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip,
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-typebox-color);
}
.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:var(--theme-borders-color);
  border-color:var(--theme-borders-color);
  box-shadow:inset 0 0 0 1px var(--theme-borders-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {
  background-color:var(--theme-button-hover-color);
  border-color:var(--theme-button-hover-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
  background-color:var(--theme-typebox-color);
  border-color:var(--theme-box-border-color);
}
.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:var(--theme-borders-color);
  border-color:var(--theme-borders-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {
  border-color:var(--theme-button-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
  background-color:var(--theme-borders-color);
  border-color:var(--theme-borders-color);
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
  border:1px solid var(--theme-box-border-color);
  box-shadow:inset 0 0 0 1px var(--theme-box-border-color);
}
.oo-ui-fieldLayout-disabled>.oo-ui-fieldLayout-body>.oo-ui-fieldLayout-header>.oo-ui-labelElement-label {
  color:var(--theme-text-color);
}

/***********************
* Notifications dropdown menu styling *
************************/
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head > .oo-ui-labelElement-label {
  color: var(--theme-text-color);
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head {
  border-bottom:1px solid var(--theme-box-border-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled>.oo-ui-buttonElement-button:hover {
  color:var(--theme-button-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-buttonElement-pressed>input.oo-ui-buttonElement-button,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled>.oo-ui-buttonElement-button:active {
  color:var(--theme-button-color);
  border-color: var(--theme-button-color);
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
  border-bottom-color:var(--theme-box-border-color);
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
  border-bottom-color:var(--theme-box-color);
}
.mw-echo-ui-notificationItemWidget {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
}
.mw-echo-ui-notificationItemWidget-unread {
  background-color:var(--theme-highlight-color);
}
.mw-echo-ui-notificationItemWidget:hover {
  background-color:var(--theme-box-hover-color);
}
.mw-echo-ui-notificationItemWidget-unread:hover {
  background-color:var(--theme-highlight-color);
  color: var(--theme-button-color);
}
.mw-echo-ui-notificationsListWidget:not(:hover) a,
#p-personal .mw-echo-ui-notificationsListWidget:not(:hover) a.new,
.mw-echo-ui-notificationItemWidget-content-message-header {
  color:var(--theme-text-color);
}
.mw-echo-ui-notificationItemWidget-content-message-body {
  color:var(--theme-borders-color);
}
.mw-echo-ui-menuItemWidget > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
.mw-echo-ui-notificationItemWidget-content-actions-timestamp {
  color:var(--theme-text-color);
}
.mw-echo-ui-toggleReadCircleButtonWidget-circle {
  background-color:var(--theme-button-color);
  border:1px solid var(--theme-borders-color);
}
.mw-echo-ui-toggleReadCircleButtonWidget:hover .mw-echo-ui-toggleReadCircleButtonWidget-circle {
  background-color:var(--theme-button-hover-color);
}
.mw-echo-ui-toggleReadCircleButtonWidget-circle-unread {
  background-color:var(--theme-typebox-color);
  border:1px solid var(--theme-borders-color);
}
.mw-echo-ui-toggleReadCircleButtonWidget:hover .mw-echo-ui-toggleReadCircleButtonWidget-circle-unread {
  background-color:var(--theme-box-hover-color);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
  background-color:inherit;
}
.mw-echo-ui-notificationItemWidget:focus {
  box-shadow:inset 0 0 0 2px var(--theme-button-color);
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-footer {
  border-top:1px solid var(--theme-box-border-color);
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-footer .mw-echo-ui-notificationBadgeButtonPopupWidget-footer-buttons .oo-ui-buttonElement:last-child {
  border-left:1px solid var(--theme-box-border-color);
}

/***********************
* User preferences page styling *
************************/
.oo-ui-menuLayout-content {
  background-color:var(--theme-body-color);
}
.mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed,
.mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout {
  border-color:var(--theme-box-border-color);
}
.oo-ui-tabSelectWidget-framed {
  background-color:var(--theme-box-color);
}
.oo-ui-tabOptionWidget {
  color:var(--theme-borders-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
  border-bottom-color:var(--theme-button-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
  background-color:var(--theme-box-hover-color);
  color:var(--theme-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
  background-color:var(--theme-button-hover-color);
  color: var(--theme-text-color);
}
.oo-ui-labelWidget.oo-ui-inline-help {
  display:block;
  color:var(--theme-borders-color);
  font-size:0.92857143em
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {
  background-color:var(--theme-body-color);
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
  background-color:var(--theme-box-hover-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
  color:var(--theme-red-color);
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
  background-color:var(--theme-box-hover-color);
  border-color:var(--theme-red-color);
}
#preferences .mw-htmlform-submit-buttons {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
  padding:1em;
}
.oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
  background-color:var(--theme-borders-color);
  color:var(--theme-box-color);
  border-color:var(--theme-borders-color);
}

/***********************
* Template documentation page styling *
************************/
.doc {
    margin: 0em auto 1em;
    background-color: rgba(0,0,0,0.1);
    border: 2px solid var(--theme-borders-color);
    border-radius: 1em;
    padding: 1em
}

.doc-header {
    padding-bottom: 3px;
    border-bottom: 1px solid var(--theme-borders-color);
    margin-bottom: 1ex
}

.doc-footer {
    margin: 0;
    background-color: rgba(0,0,0,0.1);
    border: 2px solid var(--theme-borders-color);
    border-radius: 1em;
    padding: 1em
}

/***********************
* Community portal page styling *
************************/
.cpbox {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap
}

.cpbox #admins {
    box-sizing: border-box;
    width: calc(33% - 10px);
    margin: 5px;
    flex-grow: 1;
    min-width: 300px
}

.cpbox #help {
    box-sizing: border-box;
    width: calc(67% - 10px);
    margin: 5px;
    flex-grow: 1
}

/***********************
* Misc *
************************/
hr {
  background-color:var(--theme-borders-color);
}

.CategoryTreeEmptyBullet {
  color:var(--theme-borders-color);
}
.CategoryTreeToggle {
  color:var(--theme-button-color);
}
.CategoryTreeToggle:hover {
  color: var(--theme-button-hover-color);
}

.horse-userprofile {
  background-color: var(--theme-box-color);
  color: var(--theme-cyan-color);
  border: 1px solid var(--theme-cyan-color);
}
.mw-message-box-error {
  background-color:var(--theme-box-color);
  border-color:var(--theme-red-color);
  color: var(--theme-red-color);
}
Retrieved from "https://apexlegends.wiki.gg/index.php?title=MediaWiki:EditorsStyling.css&oldid=116256"