Fixed display of multiple boxes in fieldset
This commit is contained in:
parent
641ad70732
commit
0b280ff623
|
@ -211,10 +211,15 @@ class Client {
|
||||||
private setDisplay (state : State) {
|
private setDisplay (state : State) {
|
||||||
const widthEl : HTMLInputElement = document.getElementById('displayWidth') as HTMLInputElement;
|
const widthEl : HTMLInputElement = document.getElementById('displayWidth') as HTMLInputElement;
|
||||||
const heightEl : HTMLInputElement = document.getElementById('displayHeight') as HTMLInputElement;
|
const heightEl : HTMLInputElement = document.getElementById('displayHeight') as HTMLInputElement;
|
||||||
|
const srcWidthEl : HTMLInputElement = document.getElementById('sourceWidth') as HTMLInputElement;
|
||||||
|
const srcHeightEl : HTMLInputElement = document.getElementById('sourceHeight') as HTMLInputElement;
|
||||||
|
|
||||||
widthEl.value = state.display.width as any;
|
widthEl.value = state.display.width as any;
|
||||||
heightEl.value = state.display.height as any;
|
heightEl.value = state.display.height as any;
|
||||||
|
|
||||||
|
srcWidthEl.value = state.source.width as any;
|
||||||
|
srcHeightEl.value = state.source.height as any;
|
||||||
|
|
||||||
widthEl.readOnly = false;
|
widthEl.readOnly = false;
|
||||||
heightEl.readOnly = false;
|
heightEl.readOnly = false;
|
||||||
//console.dir(state);
|
//console.dir(state);
|
||||||
|
|
|
@ -45,21 +45,20 @@ html, body{
|
||||||
|
|
||||||
.half{
|
.half{
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 50%;
|
flex: 0 0 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.third{
|
.third{
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 33.3%;
|
flex: 0 0 33.33333%;
|
||||||
}
|
}
|
||||||
|
|
||||||
fieldset.inline {
|
.flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
fieldset.inline .field-row {
|
fieldset.inline .field-row {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fieldset.inline .field-row input {
|
fieldset.inline .field-row input {
|
||||||
|
|
|
@ -180,8 +180,12 @@ class Client {
|
||||||
setDisplay(state) {
|
setDisplay(state) {
|
||||||
const widthEl = document.getElementById('displayWidth');
|
const widthEl = document.getElementById('displayWidth');
|
||||||
const heightEl = document.getElementById('displayHeight');
|
const heightEl = document.getElementById('displayHeight');
|
||||||
|
const srcWidthEl = document.getElementById('sourceWidth');
|
||||||
|
const srcHeightEl = document.getElementById('sourceHeight');
|
||||||
widthEl.value = state.display.width;
|
widthEl.value = state.display.width;
|
||||||
heightEl.value = state.display.height;
|
heightEl.value = state.display.height;
|
||||||
|
srcWidthEl.value = state.source.width;
|
||||||
|
srcHeightEl.value = state.source.height;
|
||||||
widthEl.readOnly = false;
|
widthEl.readOnly = false;
|
||||||
heightEl.readOnly = false;
|
heightEl.readOnly = false;
|
||||||
this.display.set(state);
|
this.display.set(state);
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -20,7 +20,7 @@
|
||||||
<div class="window-body">
|
<div class="window-body">
|
||||||
<div>
|
<div>
|
||||||
<ul class="tree-view" id="display"><canvas></canvas></ul>
|
<ul class="tree-view" id="display"><canvas></canvas></ul>
|
||||||
<div>
|
<div class="flex">
|
||||||
<fieldset id="screenResolution" class="inline third">
|
<fieldset id="screenResolution" class="inline third">
|
||||||
<legend>Screen</legend>
|
<legend>Screen</legend>
|
||||||
<span class="field-row">
|
<span class="field-row">
|
||||||
|
|
Loading…
Reference in New Issue