mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-12-01 19:26:14 +00:00
7157729ae8
Aligning to WikimediaUI style guide by replacing colors with standard color palette equivalents, merging close colors (ex: `#E6E6E6` & `#eee` become `#eaecf0` ) and slightly increase contrast on a few to meet WCAG 2.0 level AA criteria. Also: - following other code bases like MobileFrontend or OOjs UI in using `border-radius` property instead of obsolete mixin - removing non-existing browser vendor prefixes in mixins - removing non-used Less variables - bringing CSS/Less code closer to coding standards and - simplifying Less code where applicable Change-Id: Icb936e14ff613471ea1da6df6341ec1b0543cfaf
51 lines
1.4 KiB
Plaintext
51 lines
1.4 KiB
Plaintext
@input-text-color: #222;
|
|
|
|
.mw-mmv-share-pane {
|
|
.mw-mmv-share-page {
|
|
// override OOJS-UI fixed width
|
|
width: auto;
|
|
// make sure this is a new block formatting context so that the float shrinks it instead of
|
|
// running into it and pushing the input down (there is probably a better way of doing this)
|
|
overflow: hidden;
|
|
|
|
// The selector has to be that deep and include [readonly] to override OOJS UI's definition
|
|
input[readonly] {
|
|
color: @input-text-color;
|
|
text-shadow: none;
|
|
}
|
|
}
|
|
|
|
.mw-mmv-dialog-copy {
|
|
// style rules based on .mw-mmv-share-page-link
|
|
float: right;
|
|
width: 1.5em;
|
|
height: 1.5em;
|
|
// position approximately to the middle - probably fragile but couldn't find a better way as
|
|
// the height of OOJS-UI input widget has both em and px parts and not possible to calculate
|
|
// exactly
|
|
margin: 8px 0.5em 8px 0;
|
|
padding: 0 0 0 5px;
|
|
}
|
|
}
|
|
|
|
.mw-mmv-share-page-link {
|
|
float: left;
|
|
width: 1.5em;
|
|
height: 1.5em;
|
|
// position approximately to the middle - probably fragile but couldn't find a better way as the
|
|
// height of OOJS-UI input widget has both em and px parts and not possible to calculate exactly
|
|
margin: 8px 0;
|
|
padding: 0 5px 0 0;
|
|
/* @embed */
|
|
background-image: url( img/link.svg );
|
|
background-size: contain;
|
|
background-position: left center;
|
|
background-repeat: no-repeat;
|
|
|
|
&:hover {
|
|
/* @embed */
|
|
background-image: url( img/link-hover.svg );
|
|
text-decoration: none;
|
|
}
|
|
}
|