# 5.0.2 : Problème affichage volet roulant avec long titre sur mobile

**URL:** <https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763>\
**Category:** Configuration\
**Tags:** v5\
**Created:** [Août 29, 2026, 9:33 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763 "2026-08-29T21:33:09Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jluc](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/jluc/32/12397_2.png) [@Jluc](https://community.gladysassistant.com/u/Jluc)\
**Post date:** [Août 29, 2026, 9:33 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/1 "2026-08-29T21:33:09Z")

</div>

Et ensuite j’ai obtenu cette vue :

 ![Screenshot_20260829_231554_Chrome](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/1/9/19fc286fdff6914f1d5168fcd032e2d52188d9d2.jpeg)

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [Août 30, 2026, 7:27 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/2 "2026-08-30T07:27:32Z")

</div>

Salut @Jluc,

Merci pour ton retour, effectivement, vu qu’on ne tronque plus les noms des appareils, avec les 3 boutons des volets qui prennent pas mal de largeur sur mobile, ça ne rend pas très bien 😃

Je pense que les boutons des volets sont trop larges sur mobiles, je proposes de les compacter :

 ![desktop1280card](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/1/2/129bdd28309f5228f57bbf8c97c1e0d7c0970e69.jpeg)

J’ai proposé une PR :

> <https://github.com/GladysAssistant/Gladys/pull/3062>
>
> \### Description
> 
> Since 5.0.2, a shutter/curtain row in the "devices in room" das…hboard widget could render its device name as an unreadable vertical column of single letters on mobile: the text button group ("Ouvrir | ⏸ | Fermé" in French) is wider than half a phone screen, and the name cell — \`flex: 1 1 auto\` with no width floor and \`overflow-wrap: anywhere\` — was squeezed to about one character per line.
> 
> Two changes, CSS-first (no feature component markup touched except \`ShutterButtons\`):
> 
> \- \*\*Compact shutter buttons in narrow cards.\*\* The widget's \`.table-responsive\` wrapper now declares a \`device-widget / inline-size\` container, and below 24rem of card width the shutter buttons swap their text labels for \`fe-arrow-up\` / \`fe-arrow-down\` icons. The labels stay in the DOM, visually hidden, so screen readers keep the button names; the active state stays visible through the highlighted button. The switch follows the card's real width, not the viewport's, so a narrow desktop column compacts exactly like a phone, and a wide card (tablet, single column) keeps the text labels. The scene editor renders \`ShutterButtons\` outside any \`device-widget\` container, so it is untouched.
> \- \*\*A 6rem floor under the name cell.\*\* No control can crush a name below readable word-chunks anymore, whatever its width; a control that truly cannot coexist with the floor overflows the wrapper again, which is the signal \`acAdaptiveControls\` measures.
> 
> Rendering verified in the demo (\`npm run start-demo\`) with the reporter's exact device name:
> 
> | 360px phone (after) | Narrow desktop column, before → after |
> |---|---|
> | Name wraps on words, icon group \`↑ ⏸ ↓\`, active state highlighted | "Volet" was shredded to "Vole / t" next to text buttons → icons + readable name |
> 
> Also checked: 820px single-column card still shows the full text labels, and the pre-existing vertical setpoint stepper in very narrow columns is unchanged (present on master too).
> 
> \## Forum
> 
> \### Checklist
> 
> \- \[x\] Tests pass: no server change (front-only CSS/markup fix); Cypress not run in this environment
> \- \[x\] Linter and prettier pass on both front and server (\`npm run eslint\`, \`npm run prettier\`) — run on the changed front files
> \- \[x\] No undocumented breaking change
> 
> \---
> \_Generated by \[Claude Code\](https://claude.ai/code/session\_01LQBnTp4Y9wp5KBe5swY4Nf)\_
> 
> 
> 
> \## Summary by CodeRabbit
> 
> \* \*\*Style\*\*
> \* Improved device cards to adapt shutter controls based on available card width.
> \* Shutter buttons now display clear open/close labels with directional icons.
> \* On narrow cards, controls switch to a compact icon layout while retaining accessible labels.
> \* Prevented device names and summaries from wrapping awkwardly on smaller screens.

Si certains veulent tester, j’ai une URL de test Gladys Plus à disposition : [https://claude-gladys-mobile-view-y4.gladys-plus.pages.dev/](https://claude-gladys-mobile-view-y4.gladys-plus.pages.dev/)

---

<div class="post-metadata">

**Author:** ![guim31](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/guim31/32/4840_2.png) [@guim31](https://community.gladysassistant.com/u/guim31)\
**Post date:** [Août 30, 2026, 7:38 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/3 "2026-08-30T07:38:09Z")

</div>

Très sympa chez moi !

 ![1000038152](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/b/b/bb3fd2422ac0f8d2d4710df334ef94a0abb93fa9.jpeg)

Je trouve aussi qu’il est important de gagner de la place, le nouveau thème me semble avoir des paddings plus importants !  
Ça + les arrondis ça prend plus de place

---

<div class="post-metadata">

**Author:** ![mutmut](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/mutmut/32/14064_2.png) [@mutmut](https://community.gladysassistant.com/u/mutmut)\
**Post date:** [Août 30, 2026, 7:44 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/4 "2026-08-30T07:44:01Z")

</div>

J’ai aussi remarqué sur mobile des soucis de place :

 ![IMG_1109](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/e/6/e692ea792b8af9736a0c1fe589fce4b5d2ed4dfb.jpeg)

Dans mon cas ce ne sont pas les commandes mais les valeurs qui ne sont pas arrondies, 3 décimales suffiraient à l’affichage.

---

<div class="post-metadata">

**Author:** ![cursor-bot](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/cursor-bot/32/22252_2.png) [@cursor-bot](https://community.gladysassistant.com/u/cursor-bot)\
**Post date:** [Août 30, 2026, 8:25 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/5 "2026-08-30T08:25:25Z")

</div>

Salut tout le monde !

Ce sujet est désormais **en cours de développement**.

Une PR a été ouverte pour arrondir les valeurs capteurs affichées (sans perdre les petites grandeurs) :

> <https://github.com/GladysAssistant/Gladys/pull/3063>
>
> \### Description
> 
> Follow-up to the mobile report on the community forum (\[topic 1…0763\](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/4)): sensor rows of the devices widget print \`last\_value\` verbatim, so a Zigbee float32 artifact like \`45.60000038146973 %\` overflows the card on mobile.
> 
> Rounding to a fixed number of decimals (as suggested on the forum) would fix the noise but destroy small values — \`0.0004\` would become \`0\`, and the magnitude \*is\* the information. Instead, \`smartRound\` (which already handled values ≥ 1 with 2 decimals under 10, 1 decimal under 1000, integers above) now keeps \*\*3 significant digits below 1\*\* instead of full precision:
> 
> | input | displayed |
> |---|---|
> | \`45.60000038146973\` | \`45.6\` |
> | \`33.33333333333336\` | \`33.3\` |
> | \`0.005\` | \`0.005\` (not \`0\`) |
> | \`0.00123456\` | \`0.00123\` |
> | \`0.10000000149011612\` | \`0.1\` |
> 
> Non-numeric values (\`null\`, strings) pass through untouched, covered by tests.
> 
> \`smartRound\` is now applied everywhere the widget printed a raw number:
> 
> \- \`RawDeviceValue\` — the fallback renderer of most numeric sensors (humidity, power, energy…)
> \- \`BadgeNumberDeviceValue\` — the colored badges (CO2, AQI…)
> \- \`MultiLevelDeviceFeature\` — the value label next to the slider (shutter position, dimmer…)
> \- \`DistanceSensorDeviceValue\` / \`PressureSensorDeviceValue\` — their no-conversion path (metric user, metric unit) skipped the rounding the converted path already had
> 
> Rendering verified in the demo front at 360px with injected noisy values (screenshots attached to the session): \`Humidité 45.6 %\`, \`Position 33.3 %\`, \`Humidité 0.005 %\`, badge \`43\` — where before the raw values overflowed the card pill.
> 
> \## Forum
> 
> Forum: https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763
> 
> \### Checklist
> 
> \- \[x\] Tests pass: \`server/test/utils/units.test.js\` extended for the new \`\< 1\` behavior and the non-number guard (38 passing locally); the changed server lines are covered
> \- \[x\] Linter and prettier pass on both front and server (\`npm run eslint\`, \`npm run prettier\`) — run on the changed files
> \- \[x\] No undocumented breaking change
> 
> \---
> \_Generated by \[Claude Code\](https://claude.ai/code/session\_01LQBnTp4Y9wp5KBe5swY4Nf)\_

N’hésitez pas à suivre la PR, à tester (optionnel, surtout pour les petites demandes) et à faire vos retours ici si besoin.

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [Août 30, 2026, 8:35 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/6 "2026-08-30T08:35:07Z")

</div>

@mutmut URL de test : [https://claude-gladys-mobile-view-y4.gladys-plus.pages.dev/](https://claude-gladys-mobile-view-y4.gladys-plus.pages.dev/) 🙂

Avant/Après:

 ![beforechambrecard](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/2/b/2bc0794e537da26a6ceef9d36b4f7f7dea1acac3.jpeg)  
 ![afterchambrecard](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/7/0/70bf2da740b1a3f89e5d4b613759128d5fd85544.jpeg)

 ![beforesdbcard](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/2/b/2bf00808b91d143f3119db5e05656ef519c3ca10.png)  
 ![aftersdbcard](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/d/8/d8e67af14d5c6aa7a72cb4a7144092cf9ce7a24b.png)

---

<div class="post-metadata">

**Author:** ![Will\_71](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/will_71/32/9582_2.png) [@Will\_71](https://community.gladysassistant.com/u/Will_71)\
**Post date:** [Août 30, 2026, 8:46 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/7 "2026-08-30T08:46:37Z")

</div>

On pourrait avoir un popup comme pour les lampes mais dédié aux volets ?

---

<div class="post-metadata">

**Author:** ![mutmut](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/mutmut/32/14064_2.png) [@mutmut](https://community.gladysassistant.com/u/mutmut)\
**Post date:** [Août 30, 2026, 11:02 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/8 "2026-08-30T11:02:47Z")

</div>

impec, merci !

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/6/0/608ef3794937a34cc8ff78762bccd346a277d0b9.png)  
 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/3/e/3e0267f1398ec8afdbe2aad810d1d199679bc9a0.png)

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [Août 30, 2026, 12:35 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/9 "2026-08-30T12:35:23Z")

</div>

> [@mutmut](#):
>
> impec, merci !

Nickel, c’est mergé et ça part dans la prochaine version de Gladys 🙂

> [@Will\_71](#):
>
> On pourrait avoir un popup comme pour les lampes mais dédié aux volets ?

Carrément !

---

<div class="post-metadata">

**Author:** ![mutmut](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/mutmut/32/14064_2.png) [@mutmut](https://community.gladysassistant.com/u/mutmut)\
**Post date:** [Août 31, 2026, 7:07 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/10 "2026-08-31T07:07:56Z")

</div>

> [@pierre-gilles](#):
>
> > [@Will\_71](#):
> >
> > On pourrait avoir un popup comme pour les lampes mais dédié aux volets ?
> 
> Carrément !

est-ce que tu penses qu’on peut regrouper les widgets popup ici ?

> [@Amélioration des tableaux de bord -\> Widgets popup](https://community.gladysassistant.com/t/amelioration-des-tableaux-de-bord-widgets-popup/10750):
>
> Bonjour, Utilisateur de Home Assistant, j’utilise de plus en plus Gladys, en complément, pour sa simplicité de mise en oeuvre et sa philosophie. Par contre, quand on a beaucoup d’équipements, les tableaux de bord deviennent un peu complexes à gérer si on veut garder une bonne visibilité. De plus, pour un type de matériel, si on veux gérer plusieurs choses, il faut publier plusieurs widget (ex: pour mon ampli yamaha, il faut que je publie un widget pour le power (pour l’allumer, l’éteindre), u…

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [Septembre 4, 2026, 7:08 UTC](https://community.gladysassistant.com/t/5-0-2-probleme-affichage-volet-roulant-avec-long-titre-sur-mobile/10763/11 "2026-09-04T07:08:52Z")

</div>

> [@mutmut](#):
>
> est-ce que tu penses qu’on peut regrouper les widgets popup ici ?

Je préfère que les demandes de fonctionnalités soient simples et claires, avec un titre qui permette à lui seul de comprendre le développement proposé. La description est un bonus pour apporter des précisions, mais le titre doit être suffisamment explicite pour que, en parcourant simplement la liste des demandes, on comprenne immédiatement de quoi il s’agit, sans même avoir à ouvrir la fiche.

D’ailleurs, la demande que tu partages me semble davantage être une discussion qu’une véritable demande de fonctionnalité. 🙂