Por favor, compartilhe seu CSS! Isso facilitaria uma correção no TC.
Aqui está uma maneira meio gambiarra de fazer isso (em common/css, NÃO em /mobile/css)
@use "lib/viewport";
@include viewport.until(md) {
.d-header:not(:has(.extra-info-wrapper.topic-info-visible)):not(:has(.extra-info-wrapper .topic-link)):not(.header-topic-info-visible) .title {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin: 0;
}
}
2 Curtiram
Desculpe, ainda não consegui manter este componente exatamente atualizado, mas, sim, a mudança em relação às visualizações para dispositivos móveis e desktop definitivamente quebrou algumas das suposições que o componente do tema original fazia.
@Lilly, obrigado pelo empurrão nessa direção. A posição absoluta resolveria o problema por enquanto… a reordenação dos itens neste componente está apenas aplicando uma solução simples com CSS Grid.
2 Curtiram
Olá a todos, apenas dando um retorno: Lilly realizou um grande trabalho na limpeza e atualização disso — acabei de mesclar as alterações dela, então agora tudo deve estar pronto para uso.
4 Curtiram
Ei @featheredtoast, tenho um PR aqui para corrigir o problema do cabeçalho com o tema Horizon em tamanhos de viewport para telefones dobráveis e alguns tablets.
Deixarei que você dê uma olhada e faça o merge:
4 Curtiram
parece bom — vamos testar, obrigado @Lilly !
2 Curtiram
Quando rolo para cima dentro de um tópico, de modo que o cabeçalho mude (para mostrar o nome do tópico e as categorias), esse novo cabeçalho não tem o ícone de hambúrguer. Com o ícone de hambúrguer à esquerda quando presente, isso significa que o ícone do fórum muda de posição. Pergunto-me se seria possível ter uma opção para colocar o ícone de hambúrguer à direita do ícone do fórum. Isso significaria que o ícone do fórum permaneceria no mesmo lugar para ambos os tipos de cabeçalho. Obrigado.
P.S. Acabei de notar que, na versão desktop, sem o componente de tema, o ícone de hambúrguer fica lá o tempo todo. Talvez isso pudesse ser uma opção para dispositivos móveis também.
pessoalmente, não sou a favor dessa mudança (talvez @featheredtoast pense de forma diferente), mas se você precisar disso, basta adicionar esse CSS em outro componente de tema no seu fórum para sobrescrever a ordem dos itens.
.d-header {
display: grid;
grid-template-areas: 'logo left-menu custom-header-icon-link-1 custom-header-icon-link-2 custom-header-icon-link-3 custom-header-icon-link-4 custom-header-icon-link-5 extra-info chat header-buttons search right-menu'!important;
}
resultado:
o ícone hambúrguer não deve aparecer no cabeçalho rolagem no mobile, a fim de maximizar o espaço do cabeçalho para títulos de tópicos mais longos
4 Curtiram
Compartilho a mesma opinião da @Lilly aqui, o objetivo era fazer o hambúrguer à esquerda parecer com o de outros aplicativos… O salto não é algo que eu otimizei, já que a experiência padrão já fazia isso.
Quando está em grade, como ela demonstrou, é fácil atualizar as posições de todos os elementos com mínima intervenção no componente base do tema aqui.
Estou aberto a PRs se houver demanda suficiente, mas esta é a primeira vez que ouço um pedido assim atualmente.
4 Curtiram
Será?
No desktop, não há “salto”, pois (se bem me lembro) o menu hambúrguer permanece sempre à esquerda do ícone do fórum.
No mobile também não há salto, já que tudo, exceto o ícone do fórum, é substituído.
1 Curtiu
Comecei a usar seu componente de tema (obrigado por compartilhá-lo!) e simplesmente desativei o ícone principal no mobile para tornar isso compatível com nossa filosofia de UI/UX de manter tudo o mais limpo possível.
1 Curtiu