diff options
author | Julius Härtl <jus@bitgrid.net> | 2019-10-10 11:02:23 +0200 |
---|---|---|
committer | Arthur Schiwon <blizzz@arthur-schiwon.de> | 2019-10-29 18:03:53 +0100 |
commit | 7b82a09a3b2fd19e5af9ac091f33236b1dc2cf44 (patch) | |
tree | f91b0080625f34846535c2a578a83aa3f8885dda /apps/workflowengine | |
parent | b15c4a3a2ea0e561ed6e892a77bbb91d9335958b (diff) | |
download | nextcloud-server-7b82a09a3b2fd19e5af9ac091f33236b1dc2cf44.tar.gz nextcloud-server-7b82a09a3b2fd19e5af9ac091f33236b1dc2cf44.zip |
Fix minor styling issues with the user agent picker
Signed-off-by: Julius Härtl <jus@bitgrid.net>
Diffstat (limited to 'apps/workflowengine')
3 files changed, 32 insertions, 4 deletions
diff --git a/apps/workflowengine/src/components/Check.vue b/apps/workflowengine/src/components/Check.vue index 2f0bc11d18e..3d5c636c07d 100644 --- a/apps/workflowengine/src/components/Check.vue +++ b/apps/workflowengine/src/components/Check.vue @@ -11,6 +11,7 @@ <Multiselect v-model="currentOperator" :disabled="!currentOption" :options="operators" + class="comparator" label="name" track-by="operator" :allow-empty="false" @@ -21,6 +22,7 @@ v-model="check.value" :disabled="!currentOption" :check="check" + class="option" @input="updateCheck" @valid="(valid=true) && validate()" @invalid="(valid=false) && validate()" /> @@ -30,6 +32,7 @@ :class="{ invalid: !valid }" :disabled="!currentOption" :placeholder="valuePlaceholder" + class="option" @input="updateCheck"> <Actions v-if="deleteVisible || !currentOption"> <ActionButton icon="icon-delete" @click="$emit('remove')" /> @@ -110,7 +113,7 @@ export default { }, validate() { if (this.currentOption && this.currentOption.validate) { - this.valid = !!this.currentOption.validate(this.check); + this.valid = !!this.currentOption.validate(this.check) } return this.valid }, @@ -139,6 +142,14 @@ export default { & > *:not(.icon-delete) { width: 180px; } + & > .comparator { + min-width: 130px; + width: 130px; + } + & > .option { + min-width: 230px; + width: 230px; + } & > .multiselect, & > input[type=text] { margin-right: 5px; diff --git a/apps/workflowengine/src/components/Checks/FileSystemTag.vue b/apps/workflowengine/src/components/Checks/FileSystemTag.vue index ab3180919a7..268f8c4e33f 100644 --- a/apps/workflowengine/src/components/Checks/FileSystemTag.vue +++ b/apps/workflowengine/src/components/Checks/FileSystemTag.vue @@ -23,7 +23,7 @@ <template> <MultiselectTag v-model="newValue" :multiple="false" - label="{{ t('workflowengine', 'Select a tag') }}" + :label="t('workflowengine', 'Select a tag')" @input="update" /> </template> diff --git a/apps/workflowengine/src/components/Checks/RequestUserAgent.vue b/apps/workflowengine/src/components/Checks/RequestUserAgent.vue index f06aac2e8f7..873e985832f 100644 --- a/apps/workflowengine/src/components/Checks/RequestUserAgent.vue +++ b/apps/workflowengine/src/components/Checks/RequestUserAgent.vue @@ -35,11 +35,16 @@ @input="setValue"> <template slot="singleLabel" slot-scope="props"> <span class="option__icon" :class="props.option.icon" /> - <span class="option__title option__title_single">{{ props.option.label }}</span> + <!-- v-html can be used here as t() always passes our translated strings though DOMPurify.sanitize --> + <!-- eslint-disable-next-line vue/no-v-html --> + <span class="option__title option__title_single" v-html="props.option.label" /> </template> <template slot="option" slot-scope="props"> <span class="option__icon" :class="props.option.icon" /> - <span class="option__title">{{ props.option.label }} {{ props.option.$groupLabel }}</span> + <!-- eslint-disable-next-line vue/no-v-html --> + <span v-if="props.option.$groupLabel" class="option__title" v-html="props.option.$groupLabel" /> + <!-- eslint-disable-next-line vue/no-v-html --> + <span v-else class="option__title" v-html="props.option.label" /> </template> </Multiselect> <input v-if="!isPredefined" @@ -133,3 +138,15 @@ export default { } } </script> +<style scoped> + .multiselect, input[type='text'] { + width: 100%; + } + .multiselect .multiselect__content-wrapper li>span, + .multiselect__single { + display: flex; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +</style> |