💄 Make sure that parameter help icon gets always displayed

This commit is contained in:
Jan Oberhauser 2019-09-19 23:59:25 +02:00
parent 419af0a5fd
commit c1a609d358
2 changed files with 56 additions and 51 deletions

View file

@ -73,10 +73,18 @@ export default Vue
} }
.parameter-info { .parameter-info {
background-color: #ffffffaa;
border-radius: 6px;
display: none; display: none;
padding: 4px;
position: absolute;
right: 0px;
top: 8px;
} }
.parameter-name { .parameter-name {
position: relative;
&:hover { &:hover {
.parameter-info { .parameter-info {
display: inline; display: inline;

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <div class="paramter-input-list-wrapper">
<div v-for="parameter in filteredParameters" :key="parameter.name"> <div v-for="parameter in filteredParameters" :key="parameter.name">
<div <div
v-if="multipleValues(parameter) === true && parameter.type !== 'fixedCollection'" v-if="multipleValues(parameter) === true && parameter.type !== 'fixedCollection'"
@ -169,7 +169,7 @@ export default mixins(
</script> </script>
<style lang="scss"> <style lang="scss">
.paramter-input-list-wrapper {
.delete-option { .delete-option {
display: none; display: none;
position: absolute; position: absolute;
@ -190,9 +190,21 @@ export default mixins(
font-weight: 600; font-weight: 600;
border-bottom: 1px solid #999; border-bottom: 1px solid #999;
&:hover {
.parameter-info {
display: inline;
}
}
.delete-option { .delete-option {
top: 0; top: 0;
left: -0.9em;
} }
.parameter-info {
display: none;
}
} }
} }
@ -208,21 +220,6 @@ export default mixins(
.parameter-name:hover > .delete-option { .parameter-name:hover > .delete-option {
display: block; display: block;
} }
.parameter-name {
&:hover {
.parameter-info {
display: inline;
}
}
.delete-option {
left: -0.9em;
}
.parameter-info {
display: none;
}
} }
</style> </style>