Change the fa-bars icon on hamburger menu mobile

[smartimpact]

<div class="sidebar-toggle d-none d-md-block" data-toggle-class="sidebar-left-collapsed" data-target="html" data-fire-event="sidebar-left-toggle">
            <i class="fas fa-bars" aria-label="Toggle sidebar"></i>
        </div>

I need to show this when sidebar-left is open: <i class="fas fa-xmark" aria-label="Toggle sidebar"></i> .And when is closed i need to show this: <i class="fas fa-bars" aria-label="Toggle sidebar"></i>
What and where i need to change?

Thanks

---

Template Version: 4.2.0

[Support]

Hello, you can add both and control it with CSS:

<div class="custom-hide btn-cursor-pointer toggle-sidebar-left" data-toggle-class="sidebar-left-opened" data-target="html" data-fire-event="sidebar-left-opened">
	<i class="fas fa-xmark" aria-label="Toggle sidebar"></i>
	<i class="fas fa-bars" aria-label="Toggle sidebar"></i>
</div>

CSS:

.toggle-sidebar-left .fa-xmark {
	display: none;
}

.toggle-sidebar-left .fa-bars {
	display: block;
}

.sidebar-left-opened .toggle-sidebar-left .fa-xmark {
	display: block;
}

.sidebar-left-opened .toggle-sidebar-left .fa-bars {
	display: none;
}

---

[smartimpact]

Perfect. Thanks

---

[Author]

Posts