Categorias de Micro-Themes

Micro-Themes de marca

As categorias de micro-theme abaixo incluem opções que foram codificadas no tema de sua marca e são adaptadas aos padrões dela. Micro-themes de marca adicionais podem ser adicionados a cada uma das categorias abaixo conforme necessário ao longo do tempo.

Accordion

Esta categoria inclui opções de estilo alternativo que podem ser aplicadas a qualquer componente accordion publicado em sua página.

Backgrounds

Pode ser aplicado a qualquer container, coluna, linha ou grade. Quando utilizados, esses micro-themes mudam a cor de fundo do elemento ao qual são aplicados.

Bullet List

Esses micro-themes podem ser aplicados ao texto e são usados ​​para alterar o tipo de marcadores usados ​​em uma bullet list.

Buttons

Micro-themes de botão podem ser aplicados a links de texto para transformá-los em botões. Eles vêm em diferentes formatos, tamanhos e cores, incluindo também dicas de clique diferentes para cada tipo de botão.

Color

Esses micro-themes podem ser aplicados ao texto para controlar a cor do texto ao qual são aplicados.

Fonts

Micro-themes de fonte podem ser aplicados ao texto para alterar a fonte usada por esse texto.

Link

Esses micro-themes podem ser usados ​​para controlar o estilo de qualquer link de texto publicado em sua página.

Logo

Micro-themes de logotipo podem ser aplicados a qualquer container para exibir um dos logotipos codificados em seu tema dentro dele.

Pods

Os pods contêm CSS que afeta o estilo de vários elementos de uma vez. Por padrão, eles adicionam preenchimento a todos os lados, alteram a cor de fundo, do texto, dos links e dos botões.

Regions

As regions são semelhantes aos pods; elas controlam o preenchimento superior e inferior, cor de fundo, cores de texto, cores de link e cores de botão.

OBSERVAÇÃO: as regions devem ser aplicadas a seções inteiras de uma página, enquanto os pods podem ser aplicados a containers/colunas em uma área para substituir o estilo dela.

Tabs

Esta categoria inclui opções de estilo alternativo que podem ser aplicadas a qualquer componente de conteúdo com guias publicado em sua página.

Micro-Themes de Sistema

As categorias de micro-themes abaixo incluem opções que estão disponíveis em todos os consoles e não são específicas para padrões específicos de marca.

Alignment

Inclui opções de alinhamento à esquerda, direita e ao centro. Esse micro-theme podem ser aplicado diretamente ao texto ou a um container inteiro. Quando aplicado a um container, tudo dentro dele será alinhado à esquerda, direita ou ao centro.

Drop Down

Inclui diferentes opções de estilo que podem ser aplicadas a menus em um formulário freestyle.

Choice Group

Inclui diferentes opções de estilo que podem ser aplicadas a um grupo de escolha em um formulário freestyle.

Choice

Inclui diferentes opções de estilo que podem ser aplicadas a uma escolha individual em um formulário freestyle.

Flow

Os micro-theme de Flow podem ser usados ​​para ajustar o estilo e a cor da navegação, o alinhamento da navegação, bem como o efeito de transição usado ao passar de uma etapa para outra.

Form

Os micro-theme nesta categoria podem ser usados ​​para controlar o estilo dos campos do formulário, o que acontece dentro dele ao validar os seus campos, a colocação das labels do formulário, o alinhamento do botão de envio e o estilo dos campos obrigatórios. Você pode aplicar mais micro-themes de múltiplos formulários a qualquer formulário freestyle que publicar em uma página do Ion.

Form Field

Os micro-theme nesta categoria podem ser aplicados a um container de campo de formulário e podem ser usados ​​para alterar o estilo do campo.

Full-Page Slider

Esses micro-themes podem ser usados ​​para ajustar o estilo/cor da navegação usada em um componente Full-Page Slider.

Grid Layout

A categoria Grid Layout inclui micro-themes que podem ser usados ​​para fazer ajustes em colunas e linhas em uma determinada grade. Esses micro-themes podem ser aplicados a toda a grade ou especificamente a uma coluna ou linha. As opções nesta categoria incluem:

  • Nested responsive grid - faz a grade responsiva expandir ou contrair para preencher o espaço disponível em um determinado container.
  • Gutterless columns - remove as gutters entre as colunas para que não haja mais preenchimento entre elas.
  • Row padding - adiciona várias quantidades de preenchimento na parte superior e inferior de uma determinada linha.

Images

Esta categoria contém opções que podem ser aplicadas a uma imagem para alinhá-la à esquerda, direita ou ao centro de um determinado container.

Reveal

Esses micro-themes podem ser usados ​​para aplicar efeitos de transição e ajustar o estilo de sobreposição.

Slider

Inclui diferentes opções de estilo que podem ser aplicadas a um slider em um formulário freestyle.

Styling

Esta categoria inclui estilos predefinidos que podem ser aplicados a praticamente qualquer parte do conteúdo. Essas opções incluem uma opção de círculo/oval (que enquadra seu conteúdo dentro de uma forma circular/oval), uma sombra clara, uma sombra sólida, cantos arredondados e uma borda cinza escura.

Text

Esta categoria contém micro-themes que podem ser usados ​​para estilizar o texto como uma legenda ou letras pequenas. O texto da legenda normalmente seria usado abaixo de uma foto como uma breve descrição e letras pequenas normalmente seriam usadas para um aviso de isenção de responsabilidade.

Textbox

Inclui diferentes opções de estilo que podem ser aplicadas a uma caixa de texto dentro de um formulário freestyle.

Utilities

Esta categoria inclui micro-themes que são usados ​​para fazer ajustes funcionais ao conteúdo. Os micro-themes nesta categoria podem ser aplicados à maioria do conteúdo publicado em sua página e incluem:

  • Animation Wrapper - pode ser adicionado a um container que abriga um componente Reveal para corrigir um problema com transformações CSS no navegador Safari que afeta negativamente a capacidade do componente Reveal de usar o micro-theme "Flip Card".
  • Direction: Right to Left - altera a direção do texto para ir da direita para a esquerda.
  • Dynamic Visibility - quando aplicada a um elemento, não mostrará aquele elemento na página ao vivo, mas será mostrado durante a edição; geralmente emparelhado com código personalizado para ativar e desativar o conteúdo.
  • Hide in IE8 and Lower - oculta o conteúdo no Internet Explorer 8 e anteriores.
  • Hide when Printing - pode ser aplicado a qualquer elemento para ocultá-lo quando o usuário tentar imprimir a página.
  • Insert Page Break when Printing - pode ser aplicado a qualquer conteúdo para definir um ponto de quebra acima desse elemento ao imprimir, de forma que tudo abaixo desse ponto de quebra seja renderizado em uma nova página.
  • Show only in IE8 and Lower - mostra o conteúdo apenas no Internet Explorer 8 e anteriores.
  • Show Only when Printing - pode ser aplicado a qualquer elemento para mostrar esse elemento apenas quando o usuário tenta imprimir a página.
  • Scroll Awareness (once) - pode ser aplicada a um elemento para acionar uma animação personalizada na primeira vez que alguém rola para esse elemento.
  • Scroll Awareness (always) - pode ser aplicada a um elemento para acionar uma animação personalizada toda vez que alguém rola para esse elemento.
  • Top Most Layer - move o conteúdo para o topo da camada em que é publicado; usado para mover o conteúdo para a frente de outros elementos publicados em um determinado container.