Show "View as" in toolbar before grid and list modes

Question

I want to show "View as" in toolbar just before grid and list modes.

I found its already exist in template file but is hidden:

vendor/magento/module-catalog/view/frontend/templates/product/list/toolbar/viewmode.phtml

 <strong class="modes-label" id="modes-label"><?= /* @escapeNotVerified */ __('View as') ?></strong>

and in

vendor/magento/theme-frontend-blank/Magento_Catalog/web/css/source/module/_toolbar.less _toolbar.less

.modes-label {
    &:extend(.abs-visually-hidden-desktop all);
}

Answer 1

Solution is to add ".lib-visually-hidden-reset" from UI library to

Magento_Catalog/web/css/source/_extend.less

in your theme:

   .modes-label {
        .lib-visually-hidden-reset ();
        float: left;
        margin-top: 9px;
        font-family: @font-family-name__base;
        font-size: 14px;
    }