wikimedia/mediawiki-extensions-WikiEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/WikiEditor synced 2024-11-24 00:06:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use WikimediaUI toolbar styling in Vector

Browse source 
Bug: T223155
Change-Id: I4730a78836e8db0b4116f09e07929d8b883c9fa4
This commit is contained in:
Ed Sanders 2020-02-04 17:09:55 -08:00 committed by Volker E
parent ef38bdfe2f
commit 0df5223a20
2 changed files with 93 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
extension.json
View file

@ -61,6 +61,12 @@
],
"skinStyles": {
"default": [
"jquery.wikiEditor.toolbar-wikimedia.less"
],
"monobook": [
"jquery.wikiEditor.toolbar-apex.less"
],
"apex": [
"jquery.wikiEditor.toolbar-apex.less"
]
},

87
modules/jquery.wikiEditor.toolbar-wikimedia.less Normal file
View file

@ -0,0 +1,87 @@
@import 'mediawiki.mixins';
/**
* CSS for WikiEditor Toolbar jQuery plugin
*/
.wikiEditor-ui-toolbar {
background-color: #f8f9fa;
box-shadow: 0 2px 1px 0 rgba( 0, 0, 0, 0.1 );
/* Groups */
.group {
min-height: 32px;
margin: 0;
border-color: #eaecf0;
padding-right: 0;
.label {
height: 28px;
margin-left: 8px;
line-height: 28px;
}
.tool-select {
background-color: transparent;
height: 32px;
margin: 0;
border: 0;
.label {
height: 32px;
padding-left: 8px;
line-height: 32px;
}
.menu .options {
margin-top: 32px;
box-shadow: 0 2px 2px 0 rgba( 0, 0, 0, 0.25 );
.option:hover {
background-color: #eaecf0;
}
}
}
}
/* Booklet */
.booklet {
> .index {
> :hover {
background-color: #eaecf0;
}
> .current {
background-color: #eaf3ff;
color: #36c;
}
}
}
}
.tool-button {
width: 32px;
height: 32px;
.transition( ~'background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms' );
}
.tool-button,
.tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
border-radius: 0;
&:hover {
background-color: rgba( 0, 23, 70, 0.086 ); /* #eaecf0 */
> .oo-ui-iconElement-icon {
opacity: 1;
}
}
&.tool-active {
background-color: rgba( 0, 104, 243, 0.086 ); /* #eaf3ff */
}
}
.tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
opacity: 0.87;
}