Oi pessoal.
Essa é uma pequena melhoria de usabilidade do menu lateral do Tainacan.
Sempre que eu abro ele, eu sempre acho que nome do acervo é um subitem e que os itens seguintes não estão relacionados a ele. Isso acontece por 2 motivos:
- A fonte do nome do acervo é menor que dos outros itens na tela
- Não há uma espaço lateral indicando que “itens da coleção”, por exemplo, está dentro dele.
Abaixo a imagem:
isso tem me confundido sempre, mesmo depois de usar por tanto tempo a interface.
Minha sugestão seria:
- Aumentar o tamanho da fonte do nome da coleção (manter do jeito que está também funciona, já que “lista de coleções” está maior e é um item “pai” da coleção)
- dar uma margem esquerda de uns 10px pelo menos nos itens filhos da coleção para mostrar que esses itens são filhos da coleção acima.
- Deixar o tamanho da fonte igual ou menor que o da coleção. Se for aumentar o tamanho da fonte do nome da coleção, eu deixaria os filhos menores que ele.
Abaixo, mais ou menos, o que eu quero dizer (também ajustei o padding deles pra 0.3rem, pois achei que ficou um pouco melhor assim 
)
Até,
Fred Marvila
Salve @marvila!
Esta é uma boa questão e foi uma das partes polêmicas em nossa conversa sobre o redesign… acho que vale fazermos alguns testes. Meu maior incômodo é que este nome da coleção pode crescer muito. Exemplo:
No fundo eu não queria nem que este nome ficasse aí no menu mas acho que é preciso dado à dinamicidade do menu, com os itens mudando ao trocar do contexto da lista de coleções para a coleção interna. Aplicando algumas das alterações sugeridas, fica mais ou menos assim:
E com o menu collapsado mais quebra de linha infelizmente:
Lembro que lá atrás já consideramos reduzir o peso desta fonte e tirar o ícone. Eu gosto do ícone por reforçar a ideia de single vs. lista, mas de fato permite que haja mais texto e deixa menos com cara de um item clicável do menu. Aqui estes dois ajustes sem as mudanças anteriores:
Mas talvez aí fique discreto demais, neste caso eu voltaria a aumentar um pouquinho a fonte talvez. É difícil decidir porque não sabemos mesmo o tamanho do texto que vai vir ali. Um fator que vale mencionar é que este item é um “separador”. Hierarquicamente no HTML estes subitens não estão dentro de uma caixa com o rótulo da coleção e isso é bem difícil de se mudar por conta de como os menus são registrados.
Outro caminho que já discutimos é na verdade reduzir o peso do link que restaura o menu para o da lista de coleções. Visualmente eu acho que isso funciona bem porque deixa o nome da coleção com mais cara de cabeçalho da seção.
Porém me desagrada ele não ter a mesma cara de um item clicável do menu, até por questões de acessibilidade mesmo.
Oi Mateus.
Obrigado por explicar um pouco do processo
Acho que o que mais me incomoda é a diferença entre os tamanhos e a falta de hierarquia entre o nome da coleção e o que está ali em baixo. Parece que alguma fonte pegou o tamanho errado. E acho tb que há muita distância entre os links.
Divagando sobre possibilidades para esta área, gosto da ideia de deixar o tamanho do “Lista de coleções” menor que tudo, e acredito que seja possível diminuir o tamanho das outras fontes para 14px, deixando os links abaixo do nome da coleção como 14px ou até 12px, pois há uma área grande de espaço clicável. Diminuir esse espaço também ajuda.
E entendo a questão do nome da coleção ser grande. Esse não acho que exista uma solução. Imagina uma coleção de “Objetos de Otorrinolaringologia de Pindamonhangaba” 
Não tem como resolver sem ficar uma palavra por linha (ou, quiçá deixar aparecendo apenas 2 linhas no máximo e ‘…’ depois?) Com um tooltip ao passar o mouse em cima com o nome completo da coleção? Diminuir o tamanho dos ícones tb me parece que ajudaria a deixar mais fluído o design.
Fui brincar aqui e vi que o ícone da coleção também está com tamanho diferente dos outros. Ele usa 1.125em, enquanto os outros usam 1.125rem. Isso faz com que os ícones abaixo do nome da coleção também tenham um tamanho maior que o da coleção, mesmo se vc trocar o tamanho da fonte.
Brinquei um pouco aqui com essa questão e cheguei no que me parece ser a solução que é visualmente mais agradável pra mim:
Fontes entre 14 e 12px, ícones em 16 e 14px e tirei o peso das fontes dos itens (font-weight: normal) do menu, exceto o do nome da coleção (font-weight: inherit). Ah, e margem esquerda em 8px para os menus abaixo do nome da coleção.
Mesmo com nome grande e palavras grandes, achei que funcionou bem.
Fica aí como sugestão 
