bryce/mediawiki-extensions-UniversalLanguageSelector
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compact language links: Use smaller callout arrow

Browse Source 
Uses equilateral triangle with 16px side.

Bug: T138235
Change-Id: If81342876d59e3041d0ea4029e301c3cc76f6641
This commit is contained in:
Santhosh Thottingal
2016-07-12 11:33:11 +05:30
parent 29cc89398a
commit 26cfea8ef4
2 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
resources/css/ext.uls.compactlinks.less
View File

@@ -36,16 +36,16 @@
border-top: 1px solid rgba( 0, 0, 0, 0.2 ); border-top: 1px solid rgba( 0, 0, 0, 0.2 );
box-shadow: -2px -2px 2px rgba( 0, 0, 0, 0.1 ); box-shadow: -2px -2px 2px rgba( 0, 0, 0, 0.1 );
content: ''; content: '';
height: 24px; height: 16px;
width: 24px; width: 16px;
left: -13px; left: -9px;
position: absolute; position: absolute;
/* The dialog middle is positioned 250px away from the center of the trigger. Substract 12 for /* The dialog middle is positioned 250px away from the center of the trigger. Substract 8 for
* half of the box height to center middle of the box rather than the top. The remaining 2 are * half of the box height to center middle of the box rather than the top. The remaining 2 are
* either for top-margin of the menu and border of this box, or because we use do not account * either for top-margin of the menu and border of this box, or because we use do not account
* for the margin of the trigger when we use $.fn.outerWidth without true as a parameter. * for the margin of the trigger when we use $.fn.outerWidth without true as a parameter.
*/ */
top: 236px; top: 240px;
transform: rotate( -45deg ); transform: rotate( -45deg );
-webkit-transform: rotate( -45deg ); -webkit-transform: rotate( -45deg );
-moz-transform: rotate( -45deg ); -moz-transform: rotate( -45deg );

8
resources/js/ext.uls.compactlinks.js
View File

@@ -131,10 +131,10 @@
width = $trigger.outerWidth(); width = $trigger.outerWidth();
height = $trigger.outerHeight(); height = $trigger.outerHeight();
// Triangle width is: Math.sqrt( 2 * Math.pow( 25, 2 ) ) / 2 =~ 17.7; // Triangle width is: Math.sqrt( 2 * Math.pow( 16, 2 ) ) / 2 =~ 11.3;
// Box width = 24 + 1 for border. // Box width = 16 + 1 for border.
// The resulting value is rounded up 20 to have a small space between. // The resulting value is rounded up 14 to have a small space between.
triangleWidth = 20; triangleWidth = 14;
if ( dir === 'rtl' ) { if ( dir === 'rtl' ) {
this.left = offset.left - this.$menu.outerWidth() - triangleWidth; this.left = offset.left - this.$menu.outerWidth() - triangleWidth;