[rtl] Make dropdown menu (footnote, fix position)

This commit is contained in:
JuliaSvinareva 2022-10-09 22:46:00 +03:00
parent dc06aab506
commit aa629fb043
5 changed files with 66 additions and 6 deletions

View file

@ -173,6 +173,14 @@ define([
this.search = this.options.search;
this.outerMenu = this.options.outerMenu;
if (Common.UI.isRTL()) {
if (this.menuAlign === 'tl-tr') {
this.menuAlign = 'tr-tl';
} else if (this.menuAlign === 'tl-bl') {
this.menuAlign = 'tr-br';
}
}
if (this.options.restoreHeight) {
this.options.restoreHeight = (typeof (this.options.restoreHeight) == "number") ? this.options.restoreHeight : (this.options.maxHeight ? this.options.maxHeight : 100000);
!this.options.maxHeight && (this.options.maxHeight = this.options.restoreHeight);

View file

@ -106,6 +106,11 @@
border-top-color: transparent;
border-bottom-color: transparent;
.rtl & {
border-left-color: @border-regular-control-ie;
border-left-color: @border-regular-control;
}
&:hover, &:focus {
background-color: transparent;
border-right-color: @border-regular-control-ie;

View file

@ -8,6 +8,10 @@
margin-left: -1px;
border-radius:@border-radius-base;
.rtl & {
margin-left: 1px;
}
&.pull-right {
right: 100%;
left: auto;

View file

@ -334,27 +334,47 @@ define([
{caption: me.mniInsEndnote, value: 'ins_endnote'},
{caption: '--'},
new Common.UI.MenuItem({
template: _.template([
template: !Common.UI.isRTL() ? _.template([
'<div class="menu-zoom" style="height: 26px;" ',
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
'data-stopPropagation="true"',
'<% } %>', '>',
'<label class="title">' + me.textGotoFootnote + '</label>',
'<button id="id-menu-goto-footnote-next-' + index + '" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'<button id="id-menu-goto-footnote-prev-' + index + '" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'<button id="id-menu-goto-footnote-next-' + index + '" type="button" class="btn small btn-toolbar next"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'<button id="id-menu-goto-footnote-prev-' + index + '" type="button" class="btn small btn-toolbar prev"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'</div>'
].join('')) :
_.template([
'<div class="menu-zoom" style="height: 26px;" ',
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
'data-stopPropagation="true"',
'<% } %>', '>',
'<label class="title">' + me.textGotoFootnote + '</label>',
'<button id="id-menu-goto-footnote-prev-' + index + '" type="button" class="btn small btn-toolbar prev"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'<button id="id-menu-goto-footnote-next-' + index + '" type="button" class="btn small btn-toolbar next"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'</div>'
].join('')),
stopPropagation: true
}),
new Common.UI.MenuItem({
template: _.template([
template: !Common.UI.isRTL() ? _.template([
'<div class="menu-zoom" style="height: 26px;" ',
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
'data-stopPropagation="true"',
'<% } %>', '>',
'<label class="title">' + me.textGotoEndnote + '</label>',
'<button id="id-menu-goto-endnote-next-' + index + '" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'<button id="id-menu-goto-endnote-prev-' + index + '" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'<button id="id-menu-goto-endnote-next-' + index + '" type="button" class="btn small btn-toolbar next"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'<button id="id-menu-goto-endnote-prev-' + index + '" type="button" class="btn small btn-toolbar prev"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'</div>'
].join('')) :
_.template([
'<div class="menu-zoom" style="height: 26px;" ',
'<% if(!_.isUndefined(options.stopPropagation)) { %>',
'data-stopPropagation="true"',
'<% } %>', '>',
'<label class="title">' + me.textGotoEndnote + '</label>',
'<button id="id-menu-goto-endnote-prev-' + index + '" type="button" class="btn small btn-toolbar prev"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
'<button id="id-menu-goto-endnote-next-' + index + '" type="button" class="btn small btn-toolbar next"><i class="icon menu__icon btn-nextitem">&nbsp;</i></button>',
'</div>'
].join('')),
stopPropagation: true

View file

@ -112,6 +112,11 @@
//max-width: 95px;
overflow: hidden;
text-overflow: ellipsis;
.rtl & {
float: right;
padding: 5px 20px 5px 5px;
}
}
.zoom {
@ -120,6 +125,24 @@
min-width: 40px;
text-align: center;
}
.next {
float: right;
margin: 2px 5px 0 0;
.rtl & {
float: left;
margin: 2px 0 0 0 !important;
}
}
.prev {
float: right;
margin-top: 2px;
.rtl & {
float: left;
margin: 2px 0 0 5px;
}
}
}