---
# System prepended metadata

title: Untitled

---

- David : une façon de présenter les messages des discussions
- Emma : ah oui tiens pas mal
- Violaine : mais genre ça marche tout seul ?
- Audrey : oui il suffit d'ajouter un item à la liste :heart_decoration: 
- David : … et quelques lignes de CSS :sweat_smile:
- Vincent : ah nan mais c'est génial ! Un tout petit truc qui change la vie :) #ux


<!--

Source : https://codimd.apps.education.fr/KsjwIfUJT8S8X0gs3lsMIA?view 
Ça donne des idées : https://codimd.apps.education.fr/s/neCyPKcYV#
-->

<style>#doc ul li:nth-of-type(2n):after,#doc ul li:nth-of-type(2n):before{content:"";position:absolute;bottom:0;border-bottom-left-radius:30px}#doc ul{background-color:#fff;list-style-type:none;padding:initial initial 50px;margin-left:40px;margin-right:40px;margin-top:20px}#doc ul li:before{content:""!important;margin:0}#doc ul li{margin-top:1em;border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px 20px 20px 20px;padding:20px;max-width:400px;display:table;line-height:1.25em;position:relative;overflow-wrap:break-word;-webkit-border-radius:20px 20px 20px 20px}#doc ul li:nth-of-type(odd){background:#e5e5ea;text-shadow:1px 1px 0 #f3f3f4;margin-left:80px;margin-right:auto}#doc ul li:nth-of-type(2n){color:#fff;text-shadow:1px 1px 0 #1b96fc;background-color:#39a1f9;margin-left:auto;margin-right:80px}#doc ul li:nth-of-type(odd):before{content:"";position:absolute;z-index:0;bottom:0;left:-20px;height:40px;width:40px;background:#e5e5ea;border-bottom-right-radius:30px}#doc ul li:nth-of-type(odd):after{content:"";position:absolute;z-index:1;bottom:0;left:-20px;width:20px;height:40px;background:#fff;border-bottom-right-radius:30px}#doc ul li:nth-of-type(2n):before{z-index:0;right:-20px;height:40px;width:40px;background:fixed #39a1f9}#doc ul li:nth-of-type(2n):after{z-index:1;right:-21px;width:21px;height:41px;background:#fff}</style>