Salient - Responsive Portfolio & Blog Theme

Add TEXT Next to Hamburger Menu Icon

Theme Version 8.5+ 

Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

.slide-out-widget-area-toggle:not(.slide-out-hover-icon-effect) a:after {
    content: "MENU";
    font-size: 25px !important;
    position: relative;
    left: -81px !important;
    top: -22px !important;
    color:#000 !important;
}

Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

/* add the text as a pseudo css element */
.slide-out-widget-area-toggle:not(.slide-out-hover-icon-effect) a span:after{
    content: "MENU";
    font-size: 25px !important;
    position: relative;
    left: -81px !important;
    text-decoration: none;
    transition: color 0.2s linear;
    -moz-transition: color 0.2s linear;
    -webkit-transition: color 0.2s linear;
    top: 1px !important;
    opacity: 0.75;
}
/* adjust for Mobile/Tablet devices  */
@media only screen and (max-width: 1000px) and (min-width: 1px) {
    .slide-out-widget-area-toggle a span:after {
        font-size: 15px !important;
        left: -51px !important;
        top: -6px !important;
    }
}
/* increase width of icon to house the extra text */
header#top nav ul .slide-out-widget-area-toggle a {
    margin-left: 65px !important;
}
/* Adjust colors for light and Dark header if Permanent transparent selected  */
.midnightHeader.light .slide-out-widget-area-toggle a span:after {
    color: #fff;
}
.midnightHeader.dark .slide-out-widget-area-toggle a span:after {
    color: #333;
}
/* color and opacity when header is resized */
.small-nav .slide-out-widget-area-toggle a span:after {
    color: #999 !important;
    opacity: 1 !important;
}
.small-nav .slide-out-widget-area-toggle a:hover span:after {
    color: #2ac4ea !important;
}

Best.