Esse é o theme. Ele é responsável por lidar com a estilização das páginas utilizando o CSS.
As funcionalidades estão implementadas em uma única folha de estilho sendo elas: Cores Esquema de cores, Esqueleto, Fontes e Alertas.
Cada funcionalidade tem seu objetivo conforme detalhados a seguir.
São disponibilizadas cinco cores, uma para cada finalidade e são elas: padrão, nota, dica, importante, atenção e cuidado. Cada cor varia entre dez tons que são originalmente concebidas para atender as fontes e aos backgrounds além dos alertas. Observe as variações de cores suportadas a seguir.
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
padrão nota dica importante atenção cuidado
Cuidado As paletas acima são compartilhadas apenas para fins didáticos e não é recomendado tentar se beneficiar delas para manipular a cor ou background na construção que qualquer página.
Há suporte para 2 esquemas de cores que são herdados do navegador atravéz dos seus modos de apresentação, ele são conhecidos como dark e light. Não há suporte para qualquer modo com esquema de cores diferente deles. Ou seja, nenhum esquema de cores é adotado e todas as cores são as herdadas do navegador.
Nota Nenhum esquema de cores é adotado caso o navegador não tenha suporte eles.
O esqueleto está preparado para lidar com responsividade em diversos tamanhos de janelas. No inicio da janela fica sempre o nome do projeto, nele há um link que redireciona para a página inicial do projeto. Caso o projeto não seja o principal do domínio, ou seja, esteja publicado em um rota dentro do domínio, fica posicionado ao máximo posível no canto inferior direito da janela o domínio da página com o seu link.
Todo o restante do espaço da janela é destinado para adicionar o conteúdo da página considerando barra de rolagem apenas na vertical caso o conteúdo não consiga se encaixar por completo nela. Como as páginas tendem a ter uma grande parte de texto, está fixado a largura máxima de 1024 pixels para considerar uma zona de respiro.
Há suporte para apenas um tipo de fonte que pode ser consultada na folha de estilo
As cores dos alertas seguem a semântica para os objetivos delas que são: padrão, nota, dica, importante, atenção e cuidado.
Maiores detalhes de como alertas funcionam pode ser consultados no alert.
Ewerton da Silva PortellaDica Acesse código fonte para o theme