search

dnum-mi / vue-dsfr

Portage en Vue du DSFR
https://vue-ds.fr
Other
58 stars 27 forks source link

[DsfrBreadcrumb] Ne s'affiche pas sur grand écran #302

Closed gideruette closed 2 years ago

gideruette commented 2 years ago

Etant donné la propriété hideButton: false dans les data, et la classe css 

@media (min-width:48em) {
 .fr-breadcrumb__button {
  display:none
 }

Sur grand écran le bouton ne s'affiche pas, et le fil d'Arianne non plus

Le problème avait disparu, mais il est à nouveau présent.

Je suggère d'ajouter une propriété permettant d'initialiser la propriété hideButton

laruiss commented 2 years ago

Bonjour, est-ce que c’est toujours le cas avec la version beta.48 ?

gideruette commented 2 years ago

Oui, le problème persiste : image

laruiss commented 2 years ago

Pourtant, il apparaît bien dans le storybook...

laruiss commented 2 years ago

Peut-être importez-vous la bibliothèque @gouvfr/dsfr ?

gideruette commented 2 years ago

Non non nous n'importons pas @gouvfr/dsfr, J'ai l'impression que les règles CSS ne sont pas transpilées dans le même ordre, et que deux règles avec le même poid sont inversées entre le story book et mon environnement. Je suis en cours d'investigation

gideruette commented 2 years ago

Mon environnement : image

Storybook : image

laruiss commented 2 years ago

Viens nous en parler ici : https://discord.gg/SbCYHXU5

gideruette commented 2 years ago

Les deux règles qui entrent en conflit ont le même score

image

image

On peut se permettre d'avoir toujours la classe fr-collapse--expanded, et supprimer (v-if) le fil d'Arianne dans les cas où ne veut pas l'afficher

gideruette commented 2 years ago

La problème a été identifié : dans le fichier main.ts, le style css de vue-dsfr doit être importé avant tous les composants