studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

fix: various DTLPanel issues

Browse source
This commit is contained in:
Timothée Goguely 2025-01-27 19:49:07 +01:00
parent 19d3235a2a
commit be67441044
2 changed files with 11 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/assets/css/src/2.blocks.design-to-light.css
View file

@ -178,17 +178,22 @@
display: none; display: none;
} }
#dtl-panel [role="tab"] { #dtl-panel [role="tab"] {
height: 2.5rem;
padding: var(--space-12) .625rem; padding: var(--space-12) .625rem;
color: var(--color-grey-400); color: var(--color-grey-400);
font-weight: 500; font-weight: 500;
white-space: pre; white-space: pre;
border-bottom: 2px solid transparent;
} }
#dtl-panel [role="tab"][aria-selected="true"] { #dtl-panel [role="tab"][aria-selected="true"] {
color: var(--color-white); color: var(--color-white);
border-bottom: 2px solid var(--color-white); border-bottom-color: var(--color-white);
} }
#dtl-panel section { #dtl-panel section {
height: calc(100% - 3.5rem);
}
#dtl-panel [role="tablist"] + section {
height: calc(100% - 6.25rem); height: calc(100% - 6.25rem);
} }

12
src/components/design-to-light/DTLPanel.vue
View file

@ -118,18 +118,16 @@
class="dot" class="dot"
v-for="(proposal, index) in proposals" v-for="(proposal, index) in proposals"
@click="activeProposal = proposal" @click="activeProposal = proposal"
:aria-selected="proposal.isActive" :aria-selected="activeProposal === proposal"
:style=" :style="
'--x:' + '--x:' +
activeProposal.grades.position.complexity + proposal.grades.position.complexity +
';--y:' + ';--y:' +
activeProposal.grades.position.weight proposal.grades.position.weight
" "
:title="index === 0 ? 'Proposition initiale' : 'Alternative ' + index" :title="proposal.title"
> >
<span class="sr-only">{{ <span class="sr-only">{{ proposal.title }}</span>
index === 0 ? "Proposition initiale" : "Alternative " + index
}}</span>
</button> </button>
</div> </div>
<div id="indicateur" class="px-32 py-16 border-b flow"> <div id="indicateur" class="px-32 py-16 border-b flow">