After setting a background image for the side panel and blurring it using CSS, I encountered an issue where the text and icons within the side panel also became blurred. Despite attempting to isolate the background image in a separate class, the problem persisted.
.background-image-holder {
background-image: url(../img/bg.jpg) !important;
background-size: cover;
background-repeat: no-repeat;
filter:blur(5px);
}
<div class=“panel panel-left panel-reveal background-image-holder”>
<div class=“list-block”>
<div class=“content-block-title”>Navigation</div>
....