fixed puissance agir mouse hover map items

This commit is contained in:
Bachir Soussi Chiadmi 2023-07-06 21:39:25 +02:00
parent 04eb79af8b
commit 19e61bbcd7
2 changed files with 43 additions and 11 deletions

View File

@ -219,10 +219,6 @@ body{
padding-right: 0.2em;
}
label.mdi:hover:before,
label.mdi.hover:before{
color:#01ffe2;
}
svg.open-btn{
position: absolute;
right:0; top:0;
@ -233,6 +229,14 @@ body{
>label{
padding:0.3em 0 0.5em 0;
cursor: pointer;
svg{
width:0.7em; height:0.7em;
}
&.hover{
svg{
color:#01ffe2;
}
}
}
h4.besoin-description{
font-weight: 400;
@ -251,6 +255,14 @@ body{
}
>label{
padding:0 0 0.5em 0;
svg{
width:0.7em;height:0.7em;
}
&.hover{
svg{
color:#01ffe2;
}
}
}
section{
&:not(:last-of-type){

View File

@ -12,6 +12,8 @@ import { mdiChevronRight } from '@mdi/js';
import { mdiChevronDown } from '@mdi/js';
import { mdiPencilPlus } from '@mdi/js';
import { mdiPencilPlusOutline } from '@mdi/js';
import { mdiRhombus } from '@mdi/js';
import { mdiRhombusOutline } from '@mdi/js';
export default {
@ -22,14 +24,18 @@ export default {
chevronright_path: mdiChevronRight,
chevrondown_path: mdiChevronDown,
pencilplus_path: mdiPencilPlus,
pencilplusoutline_path: mdiPencilPlusOutline
pencilplusoutline_path: mdiPencilPlusOutline,
rhombus_path: mdiRhombus,
rhombusoutline_path: mdiRhombusOutline
}
},
computed: {
...mapState(UserStore,['isloggedin']),
...mapState(ConcernementsStore,['opened_concernement']),
...mapState(ConcernementsStore,['ct_concernement']),
...mapState(ConcernementsStore,['ct_entite']),
...mapState(ConcernementsStore,['opened_concernement',
'ct_concernement',
'ct_entite'
]),
...mapState(CommonStore,['hover_elmt'])
},
created () {
console.log(`puissance d'agir content created, id: ${this.id}, opened_concernement:`,this.opened_concernement);
@ -77,10 +83,15 @@ export default {
></svg-icon>
<header>
<label
class="mdi mdi-rhombus"
:class="{ hover: hover_elmt && hover_elmt.type === 'besoin' && (hover_elmt.id === besoin.id || hover_elmt.bid === besoin.id) }"
:class="{ 'hover': hover_elmt
&& (hover_elmt.type === 'besoin' || hover_elmt.type === 'reponse')
&& (hover_elmt.id === besoin.id || hover_elmt.bid === besoin.id) }"
@click="onClickBesoin(besoin.id)"
>
<svg-icon
type="mdi"
:path="rhombus_path"
/>
Besoin de l'enqueteur
</label>
<h4 class="besoin-description" v-html="besoin.description"/>
@ -92,7 +103,16 @@ export default {
class="reponse"
:id="reponse.id"
>
<label class="mdi mdi-rhombus-outline">Ressource</label>
<label
:class="{ 'hover': hover_elmt
&& hover_elmt.type === 'reponse'
&& hover_elmt.id === reponse.id }"
>
<svg-icon
type="mdi"
:path="hover_elmt && hover_elmt.type === 'reponse' && hover_elmt.id === reponse.id ? rhombus_path : rhombusoutline_path"
/>
Ressource</label>
<section v-if="reponse.qui">
<label for="reponse-qui">Qui</label>
<p name="reponse-qui" v-html="reponse.qui" />