⬇️ Cabeçalho suspenso

Olá Keegan, estou tentando adicionar um fundo a isso para que pareça um botão, mas quando tenho vários links de cabeçalho ocultos com a configuração de segurança, ainda vejo um resquício do menu que estava oculto. Há alguma maneira de evitar isso? Obrigado!

Editar: Descobri que isso acontecia ao adicionar preenchimento para que parecesse um botão. Posso viver sem isso se não houver uma solução fácil.

.custom-header-links .top-level-links .custom-header-link {
    padding: 10px 20px;
    border-radius: 5px;
    background: var(--tertiary);
}

image

Editar 2:
Deixe pra lá, eu só tive que ser criativo!

.custom-header-links .top-level-links .custom-header-link {
    padding: 10px 0px;
    border-radius: 5px;
    background: var(--tertiary);
}

.custom-header-links .top-level-links .custom-header-link-caret svg {
    padding-right: 10px;
}

.custom-header-links .top-level-links .custom-header-link-icon {
    padding-left: 10px;
}
2 curtidas

Olá Keegan, quando tento usar o recurso de segurança com as seguintes configurações, os dois últimos links simplesmente desaparecem, mesmo visualizando de uma conta que é elegível para ver os links (ou seja, pertencente ao grupo de usuários “company_staff”).

É que não estou usando o recurso corretamente?

Obrigado.
@keegan


Olá @kenjdarhan,

Parece que o headerLinkId está apontando para 1 e 2 para os dois últimos links. Acho que deveria ser 0 se você quiser que ele apareça no mesmo menu suspenso.

Olá, tenho usado o componente Dropdown Header e ele tem sido incrivelmente fácil de usar e imensamente útil para nós. No entanto, seria ainda melhor se os links no menu suspenso pudessem abrir em novas abas. Aguardo sua resposta.

1 curtida

PRs são bem-vindos ou entre em contato conosco para patrocinar o trabalho.

Olá, sou novo no Font Awesome e estou tendo dificuldades para fazer os ícones aparecerem.
É isso que tenho até agora. Alguém poderia me ajudar?

Você anexou os incomuns a esta configuração global?:

meu deus obrigado eu continuei anexando-os usando o formato <i> e isso não fez nada, obrigado por isso

2 curtidas

Saudações!

Você poderia esclarecer qual aspecto do seu modelo permitiu o posicionamento de ícones/botões que levam a páginas alternativas no seu site?
image

Fiquei particularmente encantado com a apresentação desses botões na versão mobile - eles estão superbamente dispostos acima do título em forma de ícones na iteração mobile.

:+1:

1 curtida

Olá, obrigado pela sua resposta :blush:.

Para tornar a navegação mais fluida entre todas as áreas do meu site (incluindo o fórum), escolhi criar um código HTML com esta barra de navegação responsiva, eliminando o componente de menu suspenso.

Como você pode ver nestas outras páginas, que fazem parte do mesmo site, inseri exatamente o mesmo código para ter todos os links a um clique de distância :grin:

https://oii.francescomancuso.it/

https://oii.francescomancuso.it/risorse/

http://oii.francescomancuso.it/contest/

https://oii.francescomancuso.it/ranking/

1 curtida

Como você realmente conserta isso, eu ainda não consigo fazer o ícone aparecer :smiling_face_with_tear:

@merefield Ótimo componente!

Os links do menu não estão sendo exibidos em dispositivos móveis. Se os links estiverem posicionados à direita, os ícones de seta aparecem, mas apenas os links do menu suspenso são exibidos, não os links do menu. O que estou perdendo aqui?

Anexei capturas de tela da visualização do desktop, visualização móvel e as configurações atuais.

Visualização Móvel:

Agradeceria muito sua ajuda!

Obrigado.

1 curtida

Olá @Joe_Nguyen, acabei de instalar este componente e ele está funcionando como esperado em visualizações móveis e de desktop. Se possível, você poderia postar capturas de tela das configurações que você tem ao clicar nos botões “Launch Editor” nas configurações do componente? Não tenho certeza do que está acontecendo aí, você deveria ter algo mais na visualização móvel :thinking:

2 curtidas

O mesmo que a Lily, funciona bem para mim.

Notei que você usa as janelas responsivas no Chrome. Se você fizer isso, recarregue a página (F5) pelo menos uma vez; caso contrário, você não verá a visualização móvel.

Você também pode garantir que está usando a visualização móvel se adicionar ?mobile_view=1 ao URL do fórum.

3 curtidas

@Lilly Aqui estão minhas configurações:

@Arkshine - quando adicionei ?mobile_view=1 à URL, eu vejo a seta suspensa.

Obrigado!

2 curtidas

Você tem certeza de que não está no modo desktop no seu celular?

1 curtida

Oi @Lilly! Agora vejo o menu suspenso no celular. :grinning: Preciso descobrir como fazer os links abrirem em uma nova janela.

1 curtida

Isso é algo que eu costumo deixar os usuários configurarem em suas preferências/configurações de interface, porque pessoas que usam leitores de tela são prejudicadas por substituir e abrir links em novas janelas ou abas.

Obrigado novamente @Lilly @Arkshine pela sua ajuda!

1 curtida

De nada, fico feliz que tenha ajudado.

@Arkshine fez todo o trabalho, eu só postei comentários LOL :laughing:

2 curtidas