Как вариант, чисто на CSS:
- Горизонтальные линии через градиенты в background
- круглые элементы через бордеры у before и after
Убирать ненужные части можно играясь с first-child, last-child или непосредственно у самих элементов через доп классы.
Из минусов, не помню как делать кастомную длину штриха для бордеров.
Вот набросал быстрый вариант, значения здесь фиксированные, но можно выносить в переменные и считать через calc:
https://codepen.io/Arseny_dp/pen/vYNorjv 