Да, строится оно как раз по этим точкам, которые ты хочешь покороче сделать, что бы сделать его покороче, нужно использовать меньше векторов

Имел виду не удалять код а через какойта линк вызывать

лол

а, ну можешь как бэкграунд его воткнуть например

гугли svg use xhr

cпс

Если я воткну как бэкгроунд, я могу использовать hover?

Тебе более правильный метод предложили

через use будет лучше, но можно и бекграундом, только надо вставить закодированный свг.
для этого есть https://yoksel.github.io/url-encoder/

ок понял

Всем привет, возможно ЧИСТЫМ CSS при ховер на РОДИТЕЛЬСКИЙ блок запустить красиво движение блоков, просто 3 разных блока едут вправо друг за другом, как слайды (вначале их позиция абсолют и они лежат друг на друге)

Сделал через transition-delay, но если туда сюда резко по наводить, то анимация вся перемешивается и все ужасно..
Или нужно делать через JS, типо react-transition-group, навешивать доп классы и по ним делать ?

Реферанса нету, лишь на словах, но вроде нормально описал. Помогите пожалуйста.

Через кейфреймы наверно можно , наводишь на родительский блок, запускается кейфрейм

а transition-delay ставил где? на :hover{ ...} или на сам елемент?

Но разве кейфрейм не на один блок?

Или предлагаешь создать 3 разных animation и делать типо по процентам ? Но тогда все равно та же проблема, что если несколько раз быстро понаводить, то все собьется

tran-d на сами элементы:
1й - Сразу запускает transf - transX(-100%)
2й - Спустя 0.3s
3й - Спустя 0.6s

Надо попробовать в песочнице , я просто сейчас не дома, нет возможности

Я просто вначале вроде все перепробовал, прежде чем доставать добрый люд, поэтому твой вариант нормальный, но он все равно с этой "изюминкой" при резких-частых наводках

Я просто не знаю если убрать ховер с элемента прервется ли анимация или кейфрейм выполнится до конца

А так сделать анимацию и на каждый элемент повесить animation-delay

Увы сразу прекратится )