Il est possible de faire un hack CSS avec la bordure du pseudo-élément ::after pour obtenir l’effet que vous souhaitez.
.category-list tbody .category {
border-left: none;
position: relative;
padding-left: 50px;
> h3:first-child {
border-width: 0;
border-style: solid;
border-color: inherit;
&::after {
content: "";
width: 0px;
height: 70%;
position: absolute;
border-radius: 20px;
border-width: 10px;
border-style: solid;
border-color: inherit;
top: 50%;
transform: translateY(-50%);
left: 10px;
}
}
}
Notez que j’ai appliqué le style directement à l’élément h3 du titre car il est enfant direct du td auquel le style en ligne a été appliqué. Donc, si le modèle s’en débarrasse un jour, vous devrez ajuster votre CSS.
Mais vous pouvez ignorer la surcharge de components/parent-category-row comme vous le souhaitiez.
