wikimedia/mediawiki-extensions-MultimediaViewer
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer synced 2024-09-29 05:07:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move dialogs to the left, make arrows point right

Browse source 
Change-Id: If8fc4ca5f902b3dc3271a33c44554d4e46faadb8
This commit is contained in:
Mark Holmquist 2014-09-18 13:37:02 -07:00 committed by Gilles Dubuc
parent 0d4863dd91
commit c6f3be42aa
4 changed files with 7 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
resources/mmv/ui/mmv.ui.dialog.js
View file

@ -98,7 +98,6 @@
this.startListeningToOutsideClick();
this.$dialog.show();
this.fixDownArrowPosition();
this.isOpen = true;
this.$openButton.addClass( 'mw-mmv-dialog-open' );
};
@ -146,28 +145,6 @@
$( document ).off( 'click.mmv.' + this.eventPrefix, this.outsideClickHandler );
};
/**
* Fixes the tip of the container to point to the icon which opens it.
*/
DP.fixDownArrowPosition = function() {
var buttonPosition,
arrowPositionBase,
buttonWidth,
arrowWidth,
offset;
buttonPosition = this.$openButton.offset().left;
arrowPositionBase = this.$downArrow.offsetParent().offset().left;
buttonWidth = this.$openButton.outerWidth();
arrowWidth = this.$downArrow.outerWidth();
// this is the correct position of the arrow relative to the viewport - we want
// the middle of the arrow to be positioned over the middle of the button
offset = buttonPosition + ( buttonWidth - arrowWidth ) / 2;
this.$downArrow.css( 'left', ( offset - arrowPositionBase ) + 'px' );
};
/**
* Clears listeners.
*/

7
resources/mmv/ui/mmv.ui.dialog.less
View file

@ -7,6 +7,7 @@
@dialog-width: 450px;
position: fixed;
right: 58px;
display: none;
width: @dialog-width;
height: @dialog-height;
@ -18,13 +19,11 @@
.mw-mmv-dialog-down-arrow {
@arrow-border-color: #aaaaaa;
right: 48px;
background-color: @background-color;
width: @arrow-size;
height: @arrow-size;
/* @noflip */
border-right: @arrow-border-size solid @arrow-border-color;
border-bottom: @arrow-border-size solid @arrow-border-color;
.rotate(45deg);
.rotate(-45deg);
position: fixed;
}
}

5
resources/mmv/ui/mmv.ui.download.dialog.less
View file

@ -9,8 +9,7 @@
// positioned relative to the download button
position: fixed;
right: 5px;
bottom: @metadatabar-above-fold-height + @progress-bar-height + 81px;
bottom: @metadatabar-above-fold-height + @progress-bar-height + 35px;
.oo-ui-optionWidget {
@tab-border-height: 3px;
@ -37,7 +36,7 @@
}
.mw-mmv-dialog-down-arrow {
bottom: @metadatabar-above-fold-height + 76px + ( @arrow-size / 2 ) - @arrow-border-size;
bottom: @metadatabar-above-fold-height + @progress-bar-height + 45px;
background-color: #F2F2F2;
}
}

5
resources/mmv/ui/mmv.ui.reuse.dialog.less
View file

@ -5,8 +5,7 @@
@divider-border-height: 1px;
// positioned relative to the reuse button
right: 5px;
bottom: @metadatabar-above-fold-height + @progress-bar-height + 38px + 5px;
bottom: @metadatabar-above-fold-height + @progress-bar-height - 5px;
.mw-mmv-reuse-tabs {
@divider-color: rgb(204, 204, 204);
@ -55,6 +54,6 @@
}
.mw-mmv-dialog-down-arrow {
bottom: @metadatabar-above-fold-height + 38px + ( @arrow-size / 2 ) - @arrow-border-size;
bottom: @metadatabar-above-fold-height + @progress-bar-height + 5px;
}
}