Image settings: fix buttons size

This commit is contained in:
Julia Radzhabova 2019-11-19 15:43:26 +03:00
parent 949b83df4a
commit 6c55bd0f24
6 changed files with 31 additions and 20 deletions

View file

@ -14,17 +14,17 @@
</tr>
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="width:100px;"><%= scope.textOriginalSize %></button>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="min-width:100px;width: auto;"><%= scope.textOriginalSize %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default" id="image-button-fit-margins" style="width:100px;"><%= scope.textFitMargins %></button>
<button type="button" class="btn btn-text-default" id="image-button-fit-margins" style="min-width:100px;width: auto;"><%= scope.textFitMargins %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="image-button-crop" style="width: 100px;"></div>
<div id="image-button-crop" style="min-width: 100px;"></div>
</td>
</tr>
<tr>

View file

@ -159,6 +159,10 @@ define([
});
this.lockedControls.push(this.btnFitMargins);
var w = Math.max(this.btnOriginalSize.cmpEl.width(), this.btnFitMargins.cmpEl.width());
this.btnOriginalSize.cmpEl.width(w);
this.btnFitMargins.cmpEl.width(w);
this.btnInsertFromFile = new Common.UI.Button({
el: $('#image-button-from-file')
});
@ -229,6 +233,7 @@ define([
this.btnFlipH.on('click', _.bind(this.onBtnFlipClick, this));
this.lockedControls.push(this.btnFlipH);
var w = this.btnOriginalSize.cmpEl.outerWidth();
this.btnCrop = new Common.UI.Button({
cls: 'btn-text-split-default',
caption: this.textCrop,
@ -236,9 +241,9 @@ define([
enableToggle: true,
allowDepress: true,
pressed: this._state.cropMode,
width: 100,
width: w,
menu : new Common.UI.Menu({
style : 'min-width: 100px;',
style : 'min-width:' + w + 'px;',
items: [
{
caption: this.textCrop,

View file

@ -14,17 +14,17 @@
</tr>
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="width:100px;"><%= scope.textOriginalSize %></button>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="min-width:100px;width: auto;"><%= scope.textOriginalSize %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default" id="image-button-fit-slide" style="width:100px;"><%= scope.textFitSlide %></button>
<button type="button" class="btn btn-text-default" id="image-button-fit-slide" style="min-width:100px;width: auto;"><%= scope.textFitSlide %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="image-button-crop" style="width: 100px;"></div>
<div id="image-button-crop" style="min-width:100px;"></div>
</td>
</tr>
<tr>

View file

@ -143,6 +143,17 @@ define([
this.fireEvent('editcomplete', this);
}, this));
this.btnFitSlide = new Common.UI.Button({
el: $('#image-button-fit-slide')
});
this.lockedControls.push(this.btnFitSlide);
this.btnFitSlide.on('click', _.bind(this.setFitSlide, this));
var w = Math.max(this.btnOriginalSize.cmpEl.width(), this.btnFitSlide.cmpEl.width());
this.btnOriginalSize.cmpEl.width(w);
this.btnFitSlide.cmpEl.width(w);
w = this.btnOriginalSize.cmpEl.outerWidth();
this.btnCrop = new Common.UI.Button({
cls: 'btn-text-split-default',
caption: this.textCrop,
@ -150,9 +161,9 @@ define([
enableToggle: true,
allowDepress: true,
pressed: this._state.cropMode,
width: 100,
width: w,
menu : new Common.UI.Menu({
style : 'min-width: 100px;',
style : 'min-width:' + w + 'px;',
items: [
{
caption: this.textCrop,
@ -176,12 +187,6 @@ define([
this.btnCrop.menu.on('item:click', _.bind(this.onCropMenu, this));
this.lockedControls.push(this.btnCrop);
this.btnFitSlide = new Common.UI.Button({
el: $('#image-button-fit-slide')
});
this.lockedControls.push(this.btnFitSlide);
this.btnFitSlide.on('click', _.bind(this.setFitSlide, this));
this.btnRotate270 = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'rotate-270',

View file

@ -21,12 +21,12 @@
<table cols="2">
<tr>
<td class="padding-small" colspan=2>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="width:100px;"><%= scope.textOriginalSize %></button>
<button type="button" class="btn btn-text-default" id="image-button-original-size" style="min-width:100px;width: auto;"><%= scope.textOriginalSize %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div id="image-button-crop" style="width: 100px;"></div>
<div id="image-button-crop" style="min-width:100px;"></div>
</td>
</tr>
<tr>

View file

@ -199,6 +199,7 @@ define([
this.lblReplace = $('#image-lbl-replace');
var w = this.btnOriginalSize.cmpEl.outerWidth();
this.btnCrop = new Common.UI.Button({
cls: 'btn-text-split-default',
caption: this.textCrop,
@ -206,9 +207,9 @@ define([
enableToggle: true,
allowDepress: true,
pressed: this._state.cropMode,
width: 100,
width: w,
menu : new Common.UI.Menu({
style : 'min-width: 100px;',
style : 'min-width:' + w + 'px;',
items: [
{
caption: this.textCrop,