Ligne à glisser pour archiver ou supprimer

<div class="uv-msw"><p class="hd"><b>Boîte de réception</b><small>Fais glisser une ligne vers la gauche</small></p><ul class="ls" aria-label="Boîte de réception"><li class="rw"><div class="ac"><button type="button" class="ar"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="5" x="2" y="3" rx="1"/><path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8M10 12h4"/></svg><span>Archiver</span></button><button type="button" class="dl"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 6h18M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg><span>Supprimer</span></button></div><div class="fg"><span class="av" style="--c:#ec4899">L</span><div><b>Lucía</b><span>Facture d'octobre</span></div><time>9:41</time></div></li><li class="rw"><div class="ac"><button type="button" class="ar"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="5" x="2" y="3" rx="1"/><path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8M10 12h4"/></svg><span>Archiver</span></button><button type="button" class="dl"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 6h18M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg><span>Supprimer</span></button></div><div class="fg"><span class="av" style="--c:#0ea5e9">M</span><div><b>Marcos</b><span>Photos du voyage</span></div><time>9:12</time></div></li><li class="rw"><div class="ac"><button type="button" class="ar"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="5" x="2" y="3" rx="1"/><path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8M10 12h4"/></svg><span>Archiver</span></button><button type="button" class="dl"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 6h18M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg><span>Supprimer</span></button></div><div class="fg"><span class="av" style="--c:#f59e0b">E</span><div><b>Équipe design</b><span>Revue de lundi</span></div><time>Hier</time></div></li><li class="rw"><div class="ac"><button type="button" class="ar"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="5" x="2" y="3" rx="1"/><path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8M10 12h4"/></svg><span>Archiver</span></button><button type="button" class="dl"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 6h18M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg><span>Supprimer</span></button></div><div class="fg"><span class="av" style="--c:#10b981">N</span><div><b>Nora</b><span>Un café cet après-midi ?</span></div><time>Hier</time></div></li></ul><div class="em"><b>Tout est à jour</b><button type="button" class="rs">Réinitialiser</button></div><p class="sr" aria-live="polite"></p></div>