Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

AddPerson suggestions: all line make checkbox clickable

Browse Source
This commit is contained in:
Mathieu Jaumotte 2021-12-09 17:16:28 +01:00
parent 84f772b42b
commit 5a2e6c0969
1 changed files with 40 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/PersonSuggestion.vue
View File

@ -1,21 +1,22 @@
<template> <template>
<div class="list-item" :class="{ checked: isChecked }"> <div class="list-item" :class="{ checked: isChecked }">
<div> <label>
<input <div>
v-bind:type="type" <input
v-bind:type="type"
v-model="selected" v-model="selected"
name="item" name="item"
v-bind:id="item" v-bind:id="item"
v-bind:value="setValueByType(item, type)" /> v-bind:value="setValueByType(item, type)" />
</div> </div>
<suggestion-person <suggestion-person
v-if="item.result.type === 'person'" v-if="item.result.type === 'person'"
v-bind:item="item"> v-bind:item="item">
</suggestion-person> </suggestion-person>
<suggestion-third-party <suggestion-third-party
v-if="item.result.type === 'thirdparty'" v-if="item.result.type === 'thirdparty'"
v-bind:item="item"> v-bind:item="item">
</suggestion-third-party> </suggestion-third-party>
@ -24,6 +25,7 @@
v-if="item.result.type === 'user'" v-if="item.result.type === 'user'"
v-bind:item="item"> v-bind:item="item">
</suggestion-user> </suggestion-user>
</label>
</div> </div>
</template> </template>
@ -41,7 +43,7 @@ export default {
SuggestionUser, SuggestionUser,
}, },
props: [ props: [
'item', 'item',
'search', 'search',
'type' 'type'
], ],
@ -69,7 +71,7 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
div.results { div.results {
div.list-item { div.list-item {
padding: 0.4em 0.8em; padding: 0.4em 0.8em;
display: flex; display: flex;
@ -78,32 +80,36 @@ export default {
background-color: #ececec; background-color: #ececec;
border-bottom: 1px dotted #8b8b8b; border-bottom: 1px dotted #8b8b8b;
} }
div.container { label {
& > input { display: inline-flex;
margin-right: 0.8em; width: 100%;
div.container {
& > input {
margin-right: 0.8em;
}
span:not(.name) {
margin-left: 0.5em;
opacity: 0.5;
font-size: 90%;
font-style: italic;
}
} }
span:not(.name) { div.right_actions {
margin-left: 0.5em; margin: 0 0 0 auto;
opacity: 0.5; display: flex;
font-size: 90%; align-items: flex-end;
font-style: italic; & > * {
margin-left: 0.5em;
align-self: baseline;
}
a.btn {
border: 1px solid lightgrey;
font-size: 70%;
padding: 4px;
}
} }
} }
div.right_actions {
margin: 0 0 0 auto;
display: flex;
align-items: flex-end;
& > * {
margin-left: 0.5em;
align-self: baseline;
}
a.btn {
border: 1px solid lightgrey;
font-size: 70%;
padding: 4px;
}
}
} }
} }
</style> </style>