Trying to solve a challenge with the sidebar width transition! How can I move icons to the right only when the sidebar is at a width of 50px, within the specified area?
The current look:
https://i.sstatic.net/GIc4n.png
Desired outcome:
https://i.sstatic.net/LAWOj.png
$(document).ready(function() {
});
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("active");
$('#abc').addClass("d-flex flex-row-reverse");
});#wrapper {
padding-left: 250px;
transition: all 0.4s ease 0s;
}
#wrapper.active {
padding-left: 50px;
}
#wrapper.active #sidebar-wrapper {
left: 50px;
}
@media (max-width:767px) {
#wrapper {
padding-left: 0;
}
#sidebar-wrapper {
left: 0;
}
#wrapper.active {
position: relative;
left: 250px;
}
#wrapper.active #sidebar-wrapper {
left: 250px;
width: 250px;
}
}