CSS para idiomas da direita para a esquerda em portais
Você pode controlar a geração de CSS para idiomas da direita para a esquerda usando vários métodos.
Os portais do sistema base além de Portal de serviços (/sp) e os portais personalizados podem precisar de personalização adicional de CSS para espelhar completamente a direção de um portal para idiomas da direita para a esquerda.
Os widgets personalizados podem precisar de alguma conversão manual para idiomas da direita para a esquerda.
- Para estilos em linha no modelo HTML de um widget, mova esses estilos para o CSS do widget para que sejam convertidos automaticamente.
- Para estilos internos em um modelo HTML de widget, você pode usar o seletor de atributo
[dir=”rtl”]ou o seletor de classe.rtlpara fornecer CSS específico para idiomas da direita para a esquerda. - Para incluir CSS específico para idiomas da direita para a esquerda, você pode chamar o método isRTLEnabled() na classe GlideSPScriptable - Scoped em um script de servidor de widget ou usar o sinalizador global g_portal_isrtl no client script do widget.
Além disso, no tema, página, widget ou CSS de instância de widget, você pode adicionar diretivas da direita para a esquerda às propriedades de CSS usando somente uma cadeia de caracteres de interpolação Sass (#{""}).
| Diretiva de CSS da direita para a esquerda | Descrição |
|---|---|
/*rtl:ignore*/ |
Ignora a propriedade ao converter CSS do portal para idiomas da direita para a esquerda. |
/*rtl:prepend:10px*/ |
Adiciona um valor ao início do valor da propriedade para idiomas da direita para a esquerda. Este exemplo anexa 10 px. |
/*rtl:append:3rem*/ |
Adiciona um valor ao final do valor da propriedade para idiomas da direita para a esquerda. Este exemplo anexa 3rem. |
/*rtl:substituir: ou /*rtl: |
Substitui o valor da propriedade pelo valor especificado para idiomas da direita para a esquerda. Este exemplo substitui o valor da propriedade por 30px. |
/*rtl:insert:25px*/ |
Insere o valor especificado no lugar da diretiva para idiomas da direita para a esquerda. Este exemplo insere 25 px. |
Ignorar a propriedade de transformação no CSS convertido da direita para a esquerda
.fl {
transform: rotate(45deg) translateY(5px) #{"/*rtl:ignore*/"};
}