mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-11-17 04:43:18 +00:00
Merge "Style fixes for the UI changes"
This commit is contained in:
commit
6c2fe0aaf5
|
@ -124,8 +124,6 @@
|
||||||
this.canvas.empty();
|
this.canvas.empty();
|
||||||
|
|
||||||
this.buttons.empty();
|
this.buttons.empty();
|
||||||
|
|
||||||
this.fileReuse.empty();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -29,6 +29,7 @@
|
||||||
bottom: @metadatabar-above-fold-height;
|
bottom: @metadatabar-above-fold-height;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-image-inner-wrapper {
|
.mw-mmv-image-inner-wrapper {
|
||||||
|
|
|
@ -149,19 +149,26 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Handles a "dialog open" event from dialogs on the page.
|
* Handles a "dialog open/close" event from dialogs on the page.
|
||||||
*/
|
*/
|
||||||
C.handleDialogOpen = function () {
|
C.handleDialogEvent = function ( e ) {
|
||||||
this.dialogOpen = true;
|
switch ( e.type ) {
|
||||||
this.$image.addClass( 'mw-mmv-dialog-is-open' );
|
case 'mmv-download-opened':
|
||||||
};
|
this.downloadOpen = true;
|
||||||
|
break;
|
||||||
|
case 'mmv-download-closed':
|
||||||
|
this.downloadOpen = false;
|
||||||
|
break;
|
||||||
|
case 'mmv-reuse-opened':
|
||||||
|
this.reuseOpen = true;
|
||||||
|
break;
|
||||||
|
case 'mmv-reuse-closed':
|
||||||
|
this.reuseOpen = false;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
this.dialogOpen = this.reuseOpen || this.downloadOpen;
|
||||||
* Handles a "dialog close" event from dialogs on the page.
|
this.$image.toggleClass( 'mw-mmv-dialog-is-open', this.dialogOpen );
|
||||||
*/
|
|
||||||
C.handleDialogClose = function () {
|
|
||||||
this.dialogOpen = false;
|
|
||||||
this.$image.removeClass( 'mw-mmv-dialog-is-open' );
|
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -170,10 +177,10 @@
|
||||||
C.setUpImageClick = function () {
|
C.setUpImageClick = function () {
|
||||||
var canvas = this;
|
var canvas = this;
|
||||||
|
|
||||||
this.handleEvent( 'mmv-reuse-opened', $.proxy( this.handleDialogOpen, this ) );
|
this.handleEvent( 'mmv-reuse-opened', $.proxy( this.handleDialogEvent, this ) );
|
||||||
this.handleEvent( 'mmv-reuse-closed', $.proxy( this.handleDialogClose, this ) );
|
this.handleEvent( 'mmv-reuse-closed', $.proxy( this.handleDialogEvent, this ) );
|
||||||
this.handleEvent( 'mmv-download-opened', $.proxy( this.handleDialogOpen, this ) );
|
this.handleEvent( 'mmv-download-opened', $.proxy( this.handleDialogEvent, this ) );
|
||||||
this.handleEvent( 'mmv-download-closed', $.proxy( this.handleDialogClose, this ) );
|
this.handleEvent( 'mmv-download-closed', $.proxy( this.handleDialogEvent, this ) );
|
||||||
|
|
||||||
this.$image
|
this.$image
|
||||||
.on( 'click.mmv-view-original', function () {
|
.on( 'click.mmv-view-original', function () {
|
||||||
|
|
|
@ -116,6 +116,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-reuse-button {
|
.mw-mmv-reuse-button {
|
||||||
|
right: @buttons-offset - 2px;
|
||||||
bottom: @buttons-offset + @metadatabar-above-fold-height + @progress-bar-height;
|
bottom: @buttons-offset + @metadatabar-above-fold-height + @progress-bar-height;
|
||||||
/* @embed */
|
/* @embed */
|
||||||
background-image: url(img/use-ltr.svg);
|
background-image: url(img/use-ltr.svg);
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
|
|
||||||
.mw-mmv-download-dialog {
|
.mw-mmv-download-dialog {
|
||||||
@divider-border-height: 1px;
|
@divider-border-height: 1px;
|
||||||
@dialog-height: 300px;
|
@dialog-height: 230px;
|
||||||
|
|
||||||
height: @dialog-height;
|
height: @dialog-height;
|
||||||
|
|
||||||
|
@ -11,7 +11,7 @@
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: @metadatabar-above-fold-height + @progress-bar-height + 35px;
|
bottom: @metadatabar-above-fold-height + @progress-bar-height + 35px;
|
||||||
|
|
||||||
.oo-ui-optionWidget {
|
.mw-mmv-download-size .oo-ui-optionWidget {
|
||||||
@tab-border-height: 3px;
|
@tab-border-height: 3px;
|
||||||
@highlighted-tab-color: rgb(225, 243, 255);
|
@highlighted-tab-color: rgb(225, 243, 255);
|
||||||
@selected-tab-color: rgb(0, 113, 188);
|
@selected-tab-color: rgb(0, 113, 188);
|
||||||
|
@ -19,15 +19,10 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 10px 25px;
|
padding: 10px 25px;
|
||||||
|
|
||||||
font-size: 1.2em;
|
font-size: 16px;
|
||||||
|
|
||||||
&.oo-ui-optionWidget-highlighted {
|
&.oo-ui-optionWidget-selected {
|
||||||
border-bottom: (@tab-border-height - @divider-border-height) solid @highlighted-tab-color;
|
border: none;
|
||||||
}
|
|
||||||
|
|
||||||
&.oo-ui-optionWidget-selected,
|
|
||||||
&.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
|
|
||||||
border-bottom: @tab-border-height solid @selected-tab-color;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
|
|
|
@ -20,6 +20,7 @@
|
||||||
|
|
||||||
.mw-mmv-download-area {
|
.mw-mmv-download-area {
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
|
padding-left: 10px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
.mw-mmv-download-go-button {
|
.mw-mmv-download-go-button {
|
||||||
|
@ -41,6 +42,8 @@
|
||||||
&:hover {
|
&:hover {
|
||||||
border-bottom: 1px solid mix(#000, @mw-ui-constructive-button-color, 20%);
|
border-bottom: 1px solid mix(#000, @mw-ui-constructive-button-color, 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
min-width: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-download-image-size-name {
|
.mw-mmv-download-image-size-name {
|
||||||
|
@ -79,24 +82,28 @@
|
||||||
text-align: start;
|
text-align: start;
|
||||||
display: none;
|
display: none;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
|
margin-right: 20px;
|
||||||
width: auto;
|
width: auto;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Changes to pulldown menu */
|
||||||
|
.oo-ui-inlineMenuWidget-handle {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.oo-ui-menuItemWidget {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
.oo-ui-widget-disabled {
|
.oo-ui-widget-disabled {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Changes to pulldown menu */
|
.oo-ui-labelElement-label {
|
||||||
.oo-ui-icon-check,
|
margin-left: 20px;
|
||||||
.oo-ui-inlineMenuWidget-handle {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oo-ui-menuItemWidget {
|
|
||||||
width: 100%;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue