Отображать текст и значок в портативном меню Woocommerce

Question

Имеется отличная документация о том, как изменить или удалить ссылки на портативные меню в WooCommerce. Однако я заметил, что многие мобильные дизайны (mweb и приложения) имеют тенденцию к отображению текста, а также значков для портативных меню. Я хочу отобразить текст ссылки под значком, а также сам значок.

Похоже, что WooCommerce преднамеренно скрыл текст для ссылки на портативное устройство с помощью CSS:

.storefront-handheld-footer-bar ul li>a {
  height: 4.235801032em;
  display: block;
  position: relative;
  text-indent: -9999px;
  z-index: 999;
  border-right: 1px solid rgba(255, 255, 255, .2)
}

Я подозреваю, что я должен просто изменить text-indent, и текст снова появится. Например, в инструкциях, предоставленных WooCommerce для добавления новой домашней ссылки в меню портативного устройства, я думал, что изменение text-indent в CSS позволит мне отображать как значок, так и «Домой».

function jk_home_link() {
    echo '<a href="' . esc_url( home_url( '/' ) ) . '">' . __( 'Home' ) . '</a>';
}

Но я не могу понять, как "отменить" текстовый отступ, чтобы текст для ссылки также отображался. Есть мысли?