Obrigado pela informação ![]()
Se você tiver priorizar nome de usuário na experiência do usuário ativado, os nomes de usuário serão exibidos em cada postagem se o nome de usuário e o nome completo do usuário forem os mesmos.
E você ficará preso se quiser ocultar nomes de usuário apenas com CSS porque não pode direcionar elementos anteriores.
Por exemplo, você terá duas postagens que têm:
-
nome de usuário
- conteúdo da postagem
-
nome de usuário nome-completo
- conteúdo da postagem
E você não poderá ocultar nomes de usuário apenas para usuários que têm um nome completo diferente de seu nome de usuário, porque o nome de usuário é exibido antes do nome completo.
É um pouco complicado de explicar ![]()
Portanto, se você quiser uma solução apenas com CSS, precisará desativar priorizar nome de usuário na experiência do usuário e usar o seguinte CSS:
.names {
.full-name +.username {
display: none;
}
}
Quanto ao título abaixo do nome, você pode usar este CSS atualizado
.topic-meta-data .names {
flex-wrap: wrap;
.user-title {
width: 100%;
order: 1;
}
}
O order: 1; impede que o emoji de status do usuário fique ao lado do título e o mantém ao lado do nome completo:
Se eu combinar todo esse CSS, aqui está o resultado.
Antes:
.topic-meta-data .names {
flex-wrap: wrap;
.full-name +.username {
display: none;
}
.user-title {
width: 100%;
order: 1;
}
}
Depois:

