Может конечно и есть слайдеры такие, но сделать это можно легко с любым слайдером.
Делается это обычными callback функциями у любого слайдера. к примеру у kenwheeler.github.io/slick
это slickGoTo
т.е. при ховере или клике по кнопкам вызываешь функцию которая должна перейти на нужный тебе слайд
как вариант просто выравниваешь не child элемент, а child child'a https://jsfiddle.net/0qsbmLsf/1/
т.е. если задал блоку rotate - его child - нужно выровнять. но внутри него ты нормально ничего не выравняешь. потому что на него действует rotate родителя.
а вот уже child внутри child'a ты можешь выровнять - потому что на него rotate уже не действует.
ставишь блок с соц сетями на это место абсолютом к примеру. даешь блоку opacity: 0;
при ховере даешь opacity: 1;
или visibility: hidden; и visibility: visible;
Это значит ты не должен встать в ступор при любой задаче, какую бы тебе задачу не дали.
А если ты попал в тупик и не знаешь как сверстать то что тебе дали - у тебя НЕ отличные знания html/css.
ты хочешь сделать свой div, который не будет придерживаться bootsrap сетки. ну тк сделай его. не используй ни container, ни row, ни col для этого блока. и ты получишь блок на 100% шириной без паддингов.
ну самое простое как по мне - создать внутри твоего блока еще 2 блока поменьше. и абсолютом поставить их на свои места. одному дать border-top и right. а второму - border-bottom
