Substituindo o item de navegação #current-user por texto

Olá a todos.

Preciso substituir o item #current-user (foto de perfil) na navegação pelo texto “profile”.
Qual seria a melhor abordagem para fazer isso?

Tentei adicionar texto ao #current-user a::before
e definir o display da foto de perfil como none,

mas isso também ocultaria as notificações.

O resultado desejado é algo assim.

27%20PM

Obrigado antecipadamente.

Suponho que você poderia criar uma imagem que contivesse o texto “profile”. E simplesmente renderizar essa imagem em vez do avatar.

@blake, obrigado pela resposta.
Estou trabalhando em um novo tema e não acho que isso seria ideal.
Acha que eu poderia fazer isso usando a PluginAPI ou um widget?

Olá,

Isso também é possível com CSS. :slightly_smiling_face:

Comum > CSS

li#current-user {
  a.icon {
    padding: 0.2143em 0.5em;
    border: 1px solid transparent;
    border-bottom: none;
    &:before {
      content: "profile";
      font-weight: 600;
    }
    img.avatar {
      display: none;
    }
  }
}
// Alinha o novo menu do usuário
.desktop-view {
  .user-menu.revamped {
    right: 0.25em;
  }
}