Pginer has uploaded a new change for review.
https://gerrit.wikimedia.org/r/119746
Change subject: Reuse dialog styling
......................................................................
Reuse dialog styling
Adjustments of several styling aspects for the reuse file panel:
* Border style and colours to match the ones used in similar borders and Agora
style
* Highlight the trigger also on hover
* Tweak the margins to avoid info on the embed panel to appear next to the edge.
Change-Id: I3a5448e3e81006ae35d2c18a9b2cbc2a6598210e
---
M resources/mmv/ui/mmv.ui.reuse.dialog.less
M resources/mmv/ui/mmv.ui.reuse.share.less
2 files changed, 12 insertions(+), 11 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MultimediaViewer
refs/changes/46/119746/1
diff --git a/resources/mmv/ui/mmv.ui.reuse.dialog.less
b/resources/mmv/ui/mmv.ui.reuse.dialog.less
index c8b0818..f074025 100644
--- a/resources/mmv/ui/mmv.ui.reuse.dialog.less
+++ b/resources/mmv/ui/mmv.ui.reuse.dialog.less
@@ -7,8 +7,8 @@
right: 0;
bottom: 0;
- border-left: 1px solid @reuse-link-color;
- padding: 15px;
+ border-left: 1px solid #cccccc;
+ padding: 15px 20px;
.unselectable;
font-size: 1.25em;
@@ -34,7 +34,8 @@
vertical-align: baseline;
}
- &.open {
+ &.open,
+ &:hover {
opacity: 1;
}
}
@@ -46,7 +47,7 @@
.mw-mlb-reuse-dialog {
@background-color: rgb(255, 255, 255);
- @shadow-color: rgb(0, 0, 0);
+ @shadow-color: #aaaaaa;
@border-radius: 3px;
@divider-border-height: 1px;
@dialog-width: 450px;
@@ -59,7 +60,7 @@
width: @dialog-width;
height: @dialog-height;
background-color: @background-color;
- box-shadow: 2px 2px 2px @shadow-color;
+ box-shadow: 0 2px 0 @shadow-color;
.box-round(@border-radius);
.mw-mlb-reuse-tabs {
@@ -101,7 +102,7 @@
.mw-mlb-reuse-pane {
display: none;
- padding: 10px;
+ padding: 10px 20px;
&.active {
display: block;
@@ -110,8 +111,8 @@
.mw-mlb-reuse-down-arrow {
@arrow-size: 20px;
- @arrow-border-color: rgb(170, 170, 170);
- @arrow-border-size: 1px;
+ @arrow-border-color: #aaaaaa;
+ @arrow-border-size: 2px;
background-color: @background-color;
width: @arrow-size;
@@ -121,6 +122,6 @@
.rotate(45deg);
position: absolute;
right: 60px;
- bottom: -1 * ( @arrow-size / 2 );
+ bottom: -1 * ( @arrow-size / 2 ) - @arrow-border-size;
}
}
diff --git a/resources/mmv/ui/mmv.ui.reuse.share.less
b/resources/mmv/ui/mmv.ui.reuse.share.less
index 4f13a13..2fb5c0d 100644
--- a/resources/mmv/ui/mmv.ui.reuse.share.less
+++ b/resources/mmv/ui/mmv.ui.reuse.share.less
@@ -14,12 +14,12 @@
// 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 10px;
+ padding: 0 5px 0 0;
/* @embed */
background-image: url(img/link.svg);
background-size: contain;
- background-position: center;
+ background-position: left center;
background-repeat: no-repeat;
&:hover {
--
To view, visit https://gerrit.wikimedia.org/r/119746
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I3a5448e3e81006ae35d2c18a9b2cbc2a6598210e
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MultimediaViewer
Gerrit-Branch: master
Gerrit-Owner: Pginer <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
