Improve layout (confirm always to the right)

This commit is contained in:
Matthias 2023-05-06 08:47:30 +02:00
parent 54eaec1192
commit 1b84d2460f
2 changed files with 26 additions and 25 deletions

View File

@ -32,26 +32,27 @@
</b-form-select> </b-form-select>
</b-form-group> </b-form-group>
</div> </div>
<div> <div class="d-flex flex-row mt-1">
<b-button
variant="primary"
title="Add indicator to plot"
size="sm"
:disabled="addNewIndicator"
@click="addNewIndicator = !addNewIndicator"
>
Add new indicator
</b-button>
<b-button <b-button
variant="secondary" variant="secondary"
title="Remove indicator to plot" title="Remove indicator to plot"
size="sm" size="sm"
:disabled="!selIndicatorName" :disabled="!selIndicatorName"
class="ms-1" class="col"
@click="removeIndicator" @click="removeIndicator"
> >
Remove indicator Remove indicator
</b-button> </b-button>
<b-button
variant="primary"
title="Add indicator to plot"
size="sm"
class="ms-1 col"
:disabled="addNewIndicator"
@click="addNewIndicator = !addNewIndicator"
>
Add new indicator
</b-button>
</div> </div>
<PlotIndicator <PlotIndicator

View File

@ -21,8 +21,8 @@
</b-form-select> </b-form-select>
</b-form-group> </b-form-group>
</div> </div>
<div class="d-xl-flex flex-row flex-grow-1 justify-content-between mt-1"> <div class="d-flex flex-col flex-xl-row justify-content-between mt-1">
<b-form-group class="" label="Type" label-for="plotTypeSelector"> <b-form-group class="col flex-grow-1" label="Type" label-for="plotTypeSelector">
<b-form-select <b-form-select
id="plotTypeSelector" id="plotTypeSelector"
v-model="graphType" v-model="graphType"
@ -32,7 +32,7 @@
> >
</b-form-select> </b-form-select>
</b-form-group> </b-form-group>
<b-form-group label="Color" label-for="colsel" size="sm" class="ms-xl-1 flex-shrink-1"> <b-form-group label="Color" label-for="colsel" size="sm" class="ms-xl-1 col">
<b-input-group> <b-input-group>
<b-input-group-prepend> <b-input-group-prepend>
<div :style="{ 'background-color': selColor }" class="colorbox me-1"></div> <div :style="{ 'background-color': selColor }" class="colorbox me-1"></div>
@ -57,17 +57,7 @@
<div class="d-flex flex-row mt-2"> <div class="d-flex flex-row mt-2">
<b-button <b-button
v-if="addNew" v-if="addNew"
class="flex-grow-1" class="col"
variant="primary"
title="Add "
size="sm"
@click="emitIndicator"
>
Save indicator
</b-button>
<b-button
v-if="addNew"
class="ms-1 flex-grow-1"
variant="secondary" variant="secondary"
title="Add " title="Add "
size="sm" size="sm"
@ -75,6 +65,16 @@
> >
Cancel Cancel
</b-button> </b-button>
<b-button
v-if="addNew"
class="ms-1 col"
variant="primary"
title="Add "
size="sm"
@click="emitIndicator"
>
Save indicator
</b-button>
</div> </div>
</div> </div>
</template> </template>