Fix related tasks input size

This commit is contained in:
kolaente 2020-04-26 15:44:23 +02:00
parent 2a7bbf3c83
commit 31b025cc55
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
2 changed files with 40 additions and 39 deletions

View file

@ -1,46 +1,45 @@
<template> <template>
<div class="task-relations"> <div class="task-relations">
<label class="label">New Task Relation</label> <label class="label">New Task Relation</label>
<div class="columns"> <div class="field">
<div class="column is-three-quarters"> <multiselect
<multiselect v-model="newTaskRelationTask"
v-model="newTaskRelationTask" :options="foundTasks"
:options="foundTasks" :multiple="false"
:multiple="false" :searchable="true"
:searchable="true" :loading="taskService.loading"
:loading="taskService.loading" :internal-search="true"
:internal-search="true" @search-change="findTasks"
@search-change="findTasks" placeholder="Type search for a new task to add as related..."
placeholder="Type search for a new task to add as related..." label="text"
label="text" track-by="id"
track-by="id" :taggable="true"
:taggable="true" :showNoOptions="false"
:showNoOptions="false" @tag="createAndRelateTask"
@tag="createAndRelateTask" tag-placeholder="Add this as new related task"
tag-placeholder="Add this as new related task" >
> <template slot="clear" slot-scope="props">
<template slot="clear" slot-scope="props"> <div
<div class="multiselect__clear" class="multiselect__clear"
v-if="newTaskRelationTask !== null && newTaskRelationTask.id !== 0" v-if="newTaskRelationTask !== null && newTaskRelationTask.id !== 0"
@mousedown.prevent.stop="clearAllFoundTasks(props.search)"></div> @mousedown.prevent.stop="clearAllFoundTasks(props.search)"></div>
</template> </template>
<span slot="noResult">No task found. Consider changing the search query.</span> <span slot="noResult">No task found. Consider changing the search query.</span>
</multiselect> </multiselect>
</div>
<div class="field has-addons">
<div class="control is-expanded">
<div class="select is-fullwidth has-defaults">
<select v-model="newTaskRelationKind">
<option value="unset">Select a relation kind</option>
<option v-for="(label, rk) in relationKinds" :key="rk" :value="rk">
{{ label[0] }}
</option>
</select>
</div>
</div> </div>
<div class="column field has-addons"> <div class="control">
<div class="control is-expanded"> <a class="button is-primary" @click="addTaskRelation()">Add task Relation</a>
<div class="select is-fullwidth has-defaults">
<select v-model="newTaskRelationKind">
<option value="unset">Select a relation kind</option>
<option v-for="(label, rk) in relationKinds" :key="rk" :value="rk">
{{ label[0] }}
</option>
</select>
</div>
</div>
<div class="control">
<a class="button is-primary" @click="addTaskRelation()">Add task Relation</a>
</div>
</div> </div>
</div> </div>
@ -54,7 +53,9 @@
{{t.text}} {{t.text}}
</span> </span>
</router-link> </router-link>
<a class="remove" @click="() => {showDeleteModal = true; relationToDelete = {relationKind: kind, otherTaskId: t.id}}"> <a
class="remove"
@click="() => {showDeleteModal = true; relationToDelete = {relationKind: kind, otherTaskId: t.id}}">
<icon icon="trash-alt"/> <icon icon="trash-alt"/>
</a> </a>
</div> </div>

View file

@ -146,7 +146,7 @@ fieldset[disabled] .multiselect {
} }
.multiselect__tags { .multiselect__tags {
min-height: 40px; height: 40px;
display: block; display: block;
padding: 8px 40px 0 8px; padding: 8px 40px 0 8px;
border-radius: 5px; border-radius: 5px;