Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Projeto] Desafio: crie um modo ''colunas''

Oi! Tive muito mais dificuldade do que achei que teria!!! (mas já com a certeza que com mais treino vou melhorar hahahah) Segue aqui embaixo o resultado do meu projeto e se alguém conseguir me ajudar como resolver umas coisinhas seria ótimo!

  • auto layout: nao consegui configurar meu auto layout exatamente do jeito que eu queria. Queria manter o espaçamento à esquerda, porém queria distribuir as colunas proporcionalmente com o espaço restante, mas sem afetar a posiçao do logo. Quando tentei fazer isso ajustando o padding lateral, o logo movia junto.
  • background: queria que o fundo ficasse branco quando o layout ficasse em kanban e mantendo a barra de topo como no layout de listagem, nao sei se isso vai ser ensinado nas próximas aulas, mas tentei de diversas formas e nao deu certo.

Visualizaçao modo Listagem:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Visualizaçao modo Kanban:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

E, por fim, como está o meu componante e sua variante: Insira aqui a descrição dessa imagem para ajudar na acessibilidade Achei muito legal ter esse desafio no meio do curso!

2 respostas

Olá, Natalia, como vai?

Muito legal que você já está colocando a mão na massa, e é isso mesmo — com treino, tudo vai ficando mais claro. Sobre suas dúvidas:

No caso do Auto Layout, uma alternativa que pode funcionar é deixar o logo dentro de um grupo separado no frame principal. Assim, você consegue deixar o logo fixo na lateral com o espaçamento que preferir.

Sobre o fundo no modo Kanban, uma forma de resolver seria criando uma variação do componente, usando o recurso de variantes do Figma. Você pode fazer um modo com fundo branco para o Kanban e outro com fundo normal para a listagem, mantendo a barra de topo igual nos dois. Isso ajuda a trocar o visual sem precisar refazer tudo do zero.

O projeto do instrutor pode ajudar bastante nessas dúvidas mais visuais: Fastask no Figma Community.

Espero ter ajudado!

Siga firme nos seus estudos e conte com o fórum sempre que precisar.

Abraços :)

Caso este post tenha lhe ajudado, por favor, marcar como solucionado
solução!

Oi, Mike!

Obrigada pelas respostas referente às minhas dúvidas! Nao tinha colocado a barra de topo junto com a barra de navegaçao como um único componente, dessa forma que você sugeriu achei ótimo.

Abraços!