Tela vazia: ainda não há nada aqui.
illustrations/empty-basket.svgIlustrações
Os desenhos do Feitio para telas vazias e erros grandes. Cada um com o uso dele e o SVG para copiar.
Nesta página
Todas as ilustrações
Erro grande: a página ou a ação não deu certo.
illustrations/torn-paper.svgNenhuma ilustração com esse nome.
Como usar
A ilustração vai dentro da página, como SVG, e não como imagem: assim ela usa a cor do texto e troca com o tema. O traço laranja é o que leva class="feitio-hot".
<div class="feitio-empty-state">
<svg viewBox="0 0 120 100" aria-hidden="true" …>…</svg>
<h2>Nenhum agendamento ainda</h2>
<p>Crie o primeiro e ele aparece aqui.</p>
</div>- Sempre com
aria-hidden="true": o título ao lado já diz o que importa. - Uma por tela, no máximo, e só nos momentos sem conteúdo: tela vazia, erro grande, boas-vindas.
- Nas fachadas de fora, a ilustração é do cliente.
Uma ilustração nova
Na mesma mão dos ícones, com as regras de Iconografia e ilustração: tinta na cor do texto, um toque de laranja, traços que se cruzam. O arquivo vai em illustrations/<nome>.svg.