Como criar um layout da direita para a esquerda para o elemento de lista de itens

Por padrão, o Lista de itens O layout exibe o ícone à esquerda e o texto à direita. Com um simples ajuste de CSS, você pode inverter o layout para que o ícone apareça à direita e o texto fique alinhado à direita.

Isto é especialmente útil para:

• projetos de linguagem RTL
• Layouts de lista alternativos
• Estilo de interface de usuário moderno
• Criando listas de recursos visualmente únicas

Passo 1: Abra as Configurações da Lista de Itens

No editor GemPages:

• Passe o mouse sobre o Lista de itens elemento que você deseja personalizar
• Clique com o botão direito do mouse no elemento.
• Selecionar Código personalizado

Isso permite aplicar CSS personalizado especificamente a esse elemento da Lista de Itens.

Passo 2: Adicione o código de layout RTL

Cole o seguinte código na seção de código personalizado:

.ElementClass .gp-icon-list-wrapper {

  flex-direction: linha reversa;

}

.ElementClass .gp-icon-list-wrapper [data-gp-text] {

 text-align: right;

}

Passo 3: Substitua a classe do elemento

Substituir .ElementClass com o ID de classe real do seu elemento da Lista de Itens.

Dicas:

• Use este layout para designs inspirados em árabe, hebraico ou RTL (da direita para a esquerda).
• Combine-o com espaçamento personalizado ou estilização de ícones para um melhor equilíbrio visual.
• Visualize o layout em dispositivos desktop e móveis após aplicar o código.

Etapa 4: salvar e publicar

Uma vez terminado:

• Salve suas alterações
• Publique ou atualize sua página