Fix Jauge bar collapsing to 0px when nested with a name label
A Jauge posée dans un conteneur a une hauteur "auto" (voir _style_string) — "flex:1 1 auto" seul n'avait alors rien à répartir (le conteneur flex lui-même n'a pas de hauteur définie), donc le wrapper de la barre s'effondrait à 0px : seul le nom restait visible, la jauge elle-même disparaissait. Ajout d'un "min-height" plancher sur ce wrapper, qui laisse toujours la barre visible dans ce cas tout en la laissant grandir avec flex:1 si l'élément a une vraie hauteur.
This commit is contained in:
@@ -115,9 +115,17 @@ def _render_jauge(el, meta, slug, children_map=None, ctx=None, parent_flex_direc
|
||||
f'<div class="jaugeBar" style="position:absolute; left:0; top:0; bottom:0; width:{percent}%; '
|
||||
f'background-color:{fill_color}; transition:width .3s ease, background-color .3s ease;"></div>'
|
||||
)
|
||||
# min-height (pas 0) : un élément posé DANS un conteneur a une hauteur
|
||||
# "auto" par défaut (voir _style_string) — "flex:1 1 auto" seul n'a
|
||||
# alors rien à répartir (le conteneur flex lui-même n'a pas de hauteur
|
||||
# définie tant que rien ne la contraint) et la barre s'effondrait à 0px,
|
||||
# ne laissant plus que le nom visible. Cette valeur plancher garde la
|
||||
# barre visible dans ce cas, tout en la laissant grandir avec flex:1 si
|
||||
# l'élément a une vraie hauteur (posé directement sur un écran, ou
|
||||
# hauteur fixée via "Position & taille").
|
||||
bar_wrap = (
|
||||
f'<div style="position:relative; overflow:hidden; background:#1c2130; border-radius:6px; '
|
||||
f'flex:1 1 auto; min-height:0;">{bar}{label_html}</div>'
|
||||
f'flex:1 1 auto; min-height:14px;">{bar}{label_html}</div>'
|
||||
)
|
||||
return (
|
||||
f'<div id="{_auto_id(el)}" data-element-id="{el["id"]}" style="{html_lib.escape(style)}">'
|
||||
|
||||
Reference in New Issue
Block a user