Для начала объясните, как блочный div оказался внутри инлайнового span?
.outstock-text находится внутри .price, поэтому никак, только если давать модификатор для price
Арсений Матыцин, Дело же не совсем в размере, gif при адаптиве на малых экранах и тем более retina (а сейчас это почти все) будет выглядет печально.
illustrator много лишнего добавляет в svg. После svgo 4kb могут стать раза в 4 меньше.
olya_097, Вот сейчас вообще не понял, при чем здесь клик. Вопрос о стилизации курсора при наведении на текст и крестик. Клик обрабатывается с помощью javascript.
#sidebar-container .list-group .sidebar-submenu a - когда видишь такие селекторы, дальше вникать в суть проблемы и не хочется. toggleClass('d-none') display: none не анимируется, зато анимируется width, height, opacity, transform и другие.
У jQuery есть методы slideToggle(), fadeToggle(), toggle()
Посмотрите в сторону https://anseki.github.io/leader-line/ либо отрисовывайте круг и элементы позиционируйте на нем. Вокруг каждого элемента белый border.
.outstock-text находится внутри .price, поэтому никак, только если давать модификатор для price
И наведите порядок в разметке - невалидная каша получается.