Source: https://quiroz.co/turn-your-mobile-menu-hamburger-icon-into-a-menu-button-with-text/
Hamburger with text
/*------------------------------------------------*/
/*---------[GQ - MOBILE MENU BUTTON 1]------------*/
/*------------------------------------------------*/
.mobile_menu_bar:before {
background-color: #3e4555;
padding: 2px 0px 2px 2px;
top: 9px;
color: #fff!important;}
.mobile_menu_bar::after {
font-family: Arial;
content: "MENU";
position: relative;
padding: 10px 20px 10px 5px;
background-color: #3e4555;
color: #FFFFFF!important;
cursor: pointer;}
.mobile_nav.opened .mobile_menu_bar:before {
content: "\4d";}
Code language: CSS (css)
Text without hamburger
/*------------------------------------------------*/
/*---------[GQ - MOBILE MENU BUTTON 2]------------*/
/*------------------------------------------------*/
.mobile_menu_bar:before {
display:none}
.mobile_menu_bar::after {
font-family: Arial;
content: "MENU";
position: relative;
padding: 10px 20px 10px 20px;
background-color: #3e4555;
color: #FFFFFF!important;
cursor: pointer;}
.mobile_nav.opened .mobile_menu_bar:after {
content: "CLOSE";}
Code language: CSS (css)