search

sogilis / Blog

Sogilis Blog
https://blog.sogilis.fr
1 stars 1 forks source link

Replace JS ellipsis by CSS #221

Open jibidus opened 3 years ago

jibidus commented 3 years ago

See script in site/themes/sogilis/static/js/scripts.js

Seems not so easy with multiline content: https://daily-dev-tips.com/posts/css-truncate-text-with-ellipsis/

JulioJu commented 3 years ago

@jibidus ça ne peut pas marcher https://sogilis.slack.com/archives/G01011H6GE5/p1585403580001000?thread_ts=1584706468.006400&cid=G01011H6GE5

Après y'a https://daily-dev-tips.com/posts/css-truncate-text-with-ellipsis/#heading-pure-css-truncate (qui n'utilise pas ellipsis) me je trouve que le CSS est bien plus compliqué que du simple JS.

Je ne sais pas ce que tu en penses @bdumas1 ?

bdumas1 commented 3 years ago

Effectivement, ici on a un texte sur plusieurs lignes, on ne pourra pas simplement mettre un text-overflow: ellipsis;. Je pense que le CSS est toujours moins lourd que le JS à charger, et il a moins de risque d'être désactivé chez les utilisateurs. Donc là solution CSS qui n'utilise pas ellipsis que tu donne ne me choque pas du tout. @jibidus l'idée pour toi est de clean un peu ce fichier `scripts.js' c'est bien ça ?

jibidus commented 3 years ago

L'idée, c'était juste que je me disais que faire un ellipsis, ça pouvait se faire en 1 ligne de css (vs 15 lignes de js). Mais c'était un peu trop naïf manifestement comme réflexion. Entre le JS actuel et le morceau de CSS mentionné par @JulioJu, je n'ai pas vraiment d'avis. Par contre, si on laisse le JS, je pense qu'un petit commentaire pour expliquer pour on ne fait pas ça en CSS ne serait pas superfétatoire.