style as table

This commit is contained in:
OVSharova 2021-11-01 04:39:41 +03:00
parent 6c719bcf17
commit 35431e5e26
4 changed files with 37 additions and 48 deletions

View file

@ -232,7 +232,7 @@ define([
me.cmbStart.selectRecord(item ? item : me.cmbStart.items[0]); me.cmbStart.selectRecord(item ? item : me.cmbStart.items[0]);
this.view.setWidthRow(); //this.view.setWidthRow();
} }

View file

@ -198,25 +198,25 @@
</div> </div>
</div> </div>
<div class="separator long"></div> <div class="separator long"></div>
<div class="group small" > <div class="group small a-table">
<div class="elset font-normal"> <div class="elset font-normal a-tr">
<label id="animation-label-start"></label> <div class="a-td"><label id="animation-label-start"></label></div>
<div class="btn-slot" style="width: 96px; " id="animation-start"></div> <div class="a-td"><div class="btn-slot" style="width: 96px; " id="animation-start"></div></div>
</div> </div>
<div class="elset font-normal"> <div class="elset font-normal a-tr bottom">
<label id="animation-delay"></label> <div class="a-td"><label id="animation-delay"></label></div>
<span id="animation-spin-delay" class="btn-slot text spinner" ></span> <div class="a-td"><span id="animation-spin-delay" class="btn-slot text spinner" ></span></div>
</div> </div>
</div> </div>
<div class="separator long"></div> <div class="separator long"></div>
<div class="group small"> <div class="group small a-table">
<div class="elset font-normal"> <div class="elset font-normal a-tr">
<label id="animation-duration"></label> <div class="a-td"><label id="animation-duration"></label></div>
<span id="animation-spin-duration" class="btn-slot text spinner" ></span> <div class="a-td"><span id="animation-spin-duration" class="btn-slot text spinner" ></span></div>
</div> </div>
<div class="elset font-normal"> <div class="elset font-normal a-tr bottom">
<label id="animation-label-trigger"></label> <div class="a-td"><label id="animation-label-trigger"></label></div>
<div class="btn-slot" style="width: 82px; " id="animation-trigger"></div> <div class="a-td"><div class="btn-slot" style="width: 82px; " id="animation-trigger"></div></div>
</div> </div>
</div> </div>
<div class="separator long"></div> <div class="separator long"></div>
@ -229,14 +229,7 @@
<span class="btn-slot text" id="animation-checkbox-rewind"></span> <span class="btn-slot text" id="animation-checkbox-rewind"></span>
</div> </div>
</div> </div>
<div class="separator long"></div>
<div class="group small" style = "min-width: 122px;">
<div class="elset font-normal">
<label id="animation-repeat2"></label>
<span id="animation-spin-repeat2" class="btn-slot text spinner" ></span>
</div>
<div class="elset font-normal"></div>
</div>
</section> </section>
</section> </section>

View file

@ -315,27 +315,12 @@ define([
}); });
this.lockedControls.push(this.numRepeat); this.lockedControls.push(this.numRepeat);
this.numRepeat2 = new Common.UI.MetricSpinner({
el: this.$el.find('#animation-spin-repeat2'),
step: 1,
width: 88,
value: '',
maxValue: 1000,
minValue: 0,
//lock: [_set.slideDeleted, _set.noSlides, _set.disableOnStart, _set.transitLock],
dataHint: '1',
dataHintDirection: 'bottom',
dataHintOffset: 'big'
});
this.lockedControls.push(this.numRepeat2);
Common.Utils.lockControls(PE.enumLock.disableOnStart, true, {array: this.lockedControls}); Common.Utils.lockControls(PE.enumLock.disableOnStart, true, {array: this.lockedControls});
this.$el.find('#animation-duration').text(this.strDuration); this.$el.find('#animation-duration').text(this.strDuration);
this.$el.find('#animation-delay').text(this.strDelay); this.$el.find('#animation-delay').text(this.strDelay);
this.$el.find('#animation-label-start').text(this.strStart); this.$el.find('#animation-label-start').text(this.strStart);
this.$el.find('#animation-repeat').text(this.strRepeat); this.$el.find('#animation-repeat').text(this.strRepeat);
this.$el.find('#animation-repeat2').text(this.strRepeat);
this.$el.find('#animation-label-trigger').text(this.strTrigger); this.$el.find('#animation-label-trigger').text(this.strTrigger);
Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this)); Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this));
}, },
@ -404,13 +389,11 @@ define([
this.renderComponent('#animation-spin-duration', this.numDuration); this.renderComponent('#animation-spin-duration', this.numDuration);
this.renderComponent('#animation-spin-delay', this.numDelay); this.renderComponent('#animation-spin-delay', this.numDelay);
this.renderComponent('#animation-spin-repeat', this.numRepeat); this.renderComponent('#animation-spin-repeat', this.numRepeat);
this.renderComponent('#animation-spin-repeat2', this.numRepeat2);
this.$el.find("#animation-duration").innerText = this.strDuration; this.$el.find("#animation-duration").innerText = this.strDuration;
this.$el.find("#animation-delay").innerText = this.strDelay; this.$el.find("#animation-delay").innerText = this.strDelay;
this.$el.find("#animation-label-start").innerText = this.strStart; this.$el.find("#animation-label-start").innerText = this.strStart;
this.$el.find("#animation-label-trigger").innerText = this.strTrigger; this.$el.find("#animation-label-trigger").innerText = this.strTrigger;
this.$el.find("#animation-repeat").innerText = this.strRepeat; this.$el.find("#animation-repeat").innerText = this.strRepeat;
this.$el.find("#animation-repeat2").innerText = this.strRepeat;
this.widthRow(this.$el.find("#animation-label-start"), this.$el.find("#animation-delay")); this.widthRow(this.$el.find("#animation-label-start"), this.$el.find("#animation-delay"));
return this.$el; return this.$el;
}, },

View file

@ -36,15 +36,32 @@
} }
} }
/*.spinner
{
margin-left: 10px;
}*/
label { label {
margin-right: 10px; margin-right: 10px;
} }
} }
.a-table{
display: table;
width: 100%;
}
.a-tr{
display: table-row;
height: 20px;
border-top: 2px solid transparent;
&.bottom {
border-top: 4px solid transparent;
}
.a-td
{
display: table-cell;
}
}
.caption{
line-height: 18px;
font-size: 11px;
}
.btn_item { .btn_item {
color: @text-normal-ie; color: @text-normal-ie;
color: @text-normal; color: @text-normal;
@ -59,8 +76,4 @@
margin-top: -2px; margin-top: -2px;
} }
.caption{
line-height: 18px;
font-size: 11px;
}
} }