O que é um componente?

• Principais

  Os principais componentes são os que estão disponíveis para todos os elementos, grupos e seções. Esses componentes são os mais utilizados e são os que possuem mais funcionalidades.

  • Fixar Tamanho:

    Todos os elementos vêm com o conteúdo 'abraçado', o objetivo é deixar claro que ao acioná-lo, o tamanho será fixado e não responsivo. O usuário tem a opção de 'vincular' o tamanho, podendo alterar o valor de um e o outro seguir proporcionalmente. Não há valor 'vazio', sempre será obtido o tamanho atual do item e o usuário poderá alterá-lo conforme desejar.

  • Escalar

    Na construção dos sites, lojas e páginas os elementos ou grupos podem ser escalados. Assim o usuário não precisa crescer o tamanho de cada item especificamente, acelerando seu fluxo de trabalho e economizando tempo.

    As opções disponíveis são:

    • 0.25x
    • 0.5x
    • 0.75x
    • 1x
    • 2x
    • 3x
    • 4x
    • 5x
    • 10x
  • Rotacionar

    Também na construção dos sites, lojas e páginas os elementos ou grupos podem ser rotacionados. Assim o usuário pode deixar os grupos/elementos levemente ou totalmente inclinados.

    A seleção ocorre pelos graus mais utilizados como: (todos, exceto 0, possuem valor negativo)

    • 0º
    • 15º
    • 30º
    • 45º
    • 60º
    • 75º
    • 90º
    • 105º
    • 120º
    • 135º
    • 120º
    • 150º
    • 165º
    • 180º
  • Esticar

    Como todos os componente vêm “abraçados” ao conteúdo, o usuário pode precisar que o item alcance a largura máxima da seção/grupo ou elemento. O componente “esticar” possui a variação de “esticar todos” somente para seções e grupos. Em seu padrão tem a opção “auto” que busca a informação do pai (seção ou grupo) que se tiver com o “esticar todos” acionado obedecerá, ao desligar o “auto” o usuário poderá deixar “abraçados” ao conteúdo ou em largura máxima da seção/grupo.

  • Orientar Layout

    Seções, grupos e alguns elementos podem ter orientações diferentes, sendo: Linha - Itens um abaixo do outro; Coluna - Itens um ao lado do outro; e Quebra - Os itens fica organizados em linha, porém até o limite da largura, se passar ele “quebra linha”.

  • Alinhar

    O alinhamento dos itens ocorre pelo componente, tendo ele comunicação com os componente “orientar layout” e o “espaçar”, pois a interação ocorrerá de acordo com a orientação aplicada na seção/grupo ou elemento ou de acordo com o espaçamento.

  • Espaçar

    Entre grupos ou elementos o usuário pode precisar de espaçamento entre os itens.

    Este componente possui 3 situações, sendo elas:

    • Espaçamento zero
    • Distribuído (space between)
    • Equidistante (space around).

Ao acionar o tipo de espaço “equidistante” o usuário abre mão de aplicação de valor direto, por este motivo o campo é bloqueado.

Preencher

Distância da Margem

Cor de Fundo

Arredondamento

Borda

Grade

Sombra

Animação

Específicos

Genéricos