copy button: use Codex colors for dark mode compatibility

Bug: T40932
Change-Id: I9a809954f64c6d3a14cc3e2b3c2fd38824f803f3
This commit is contained in:
Siddharth VP 2024-09-28 21:05:43 +05:30
parent f4f8f00210
commit 38cbb6fed6
2 changed files with 12 additions and 9 deletions

View file

@ -674,7 +674,7 @@ class SyntaxHighlight extends ExtensionTagHandler implements
'pygments.links.scribunto.js' 'pygments.links.scribunto.js'
] : [] ), ] : [] ),
'styles' => [ 'styles' => [
'pygments.copy.css' 'pygments.copy.less'
], ],
'messages' => [ 'messages' => [
'syntaxhighlight-button-copy', 'syntaxhighlight-button-copy',

View file

@ -1,3 +1,5 @@
@import 'mediawiki.skin.variables.less';
/** /**
* Adapted from https://www.mediawiki.org/wiki/MediaWiki:Gadget-site-tpl-copy.css * Adapted from https://www.mediawiki.org/wiki/MediaWiki:Gadget-site-tpl-copy.css
* Original author: Krinkle * Original author: Krinkle
@ -18,19 +20,20 @@
box-sizing: border-box; box-sizing: border-box;
padding: 5px 7px; padding: 5px 7px;
border-radius: 2px; border-radius: 2px;
background: #fff; background: @background-color-base;
color: #36c; color: @color-progressive;
border: 1px solid #eaecf0; border: 1px solid @border-color-muted;
} }
.mw-highlight-copy--bound button:hover { .mw-highlight-copy--bound button:hover {
cursor: pointer; cursor: pointer;
background: #fff; color: @color-progressive--hover;
border: 1px solid #447ff5; background: @background-color-interactive-subtle;
border-color: @border-color-progressive--hover;
} }
.mw-highlight-copy--bound button:active { .mw-highlight-copy--bound button:active {
background: #eff3fa; color: @color-progressive--active;
color: #2a4b8d; background: @background-color-interactive;
border-color: #2a4b8d; border-color: @border-color-progressive--active;
} }