A versão 2.0.0 do produto traz mudanças estruturais e visuais importantes no frontend, com foco em modernização de bibliotecas, otimização de carregamento, reorganização de paths e introdução de novos recursos como classes helpers, variáveis CSS e modo escuro no tema responsivo.
O objetivo é melhorar desempenho, consistência visual e preparar o produto para evoluções futuras, reduzindo dependências legadas.
Importante: Algumas alterações afetam compatibilidade com códigos customizados e temas antigos, exigindo ajustes manuais descritos abaixo.
Agora o componente de FLUIGC.richeditor é baseado no plugin Kendo UI.
Impactos:
Variáveis globais CKEDITOR e CKEDITOR_BASEPATH não existem mais.
Configurações aplicadas após a inicialização não terão suporte.
Plugins personalizados devem seguir a nova API do FLUIGC.richeditor.
Exemplo de implementação de ação personalizada:
var richeditor = FLUIGC.richeditor('docConteudoCK', {
extraPlugins: 'fluigimage, fluigvideo, printDocument',
addExternal: [{
id: 'printDocument',
title: 'Imprimir documento',
icon: 'k-i-print',
callback: function(editor) {
console.log('Callback do plugin printDocument', editor);
}
}]
}); |
Como parte da implementação do Animalia Design System (Animalia DS), realizamos ajustes visuais em diversos elementos da interface. Essas alterações têm como objetivo melhorar a experiência do usuário e garantir maior aderência às práticas de acessibilidade.
Tamanhos dos elementos: botões, campos e demais componentes foram ampliados para facilitar a interação, especialmente em dispositivos móveis e para pessoas com necessidades específicas.
Cores e contrastes: paleta de cores revisada para assegurar legibilidade e conformidade com recomendações de acessibilidade (WCAG).
Outros ajustes visuais: espaçamentos, ícones e tipografia foram atualizados para proporcionar uma interface mais consistente, clara e inclusiva.
Para mitigar impactos em cenários específicos, os estilos visuais da versão 1.8.2 ou inferior foram preservados em um diretório dedicado. Esses arquivos devem ser utilizados exclusivamente em formulários e apenas em casos excepcionais, quando a adoção imediata dos novos padrões do Animalia Design System não for viável.
Arquivos disponíveis em /old/*:
/style-guide/css/old/fluig-style-guide.min.css (Classic)
/style-guide/css/old/fluig-style-guide-flat.min.css (Flat)
Importante: o uso desses estilos antigos é temporário e não recomendado como solução definitiva. Recomendamos planejar a migração completa para o novo padrão visual o quanto antes.
Alguns caminhos antigos foram removidos e não estão mais disponíveis, retornando erro 404:
/style-guide/css/fluig-style-guide.min.css
/portal/resources/style-guide/css/fluig-style-guide-flat.min.css
/portal/resources/style-guide/css/fluig-style-guide.min.css
O caminho oficial e suportado para utilização de estilos é:
/style-guide/css/fluig-style-guide-flat.min.css
Recomendação: utilize sempre o path acima em em formulários, garantindo compatibilidade com as versões atuais do produto.
A utilização de ícones também passou por ajustes com a implementação do Animalia Design System no Fluig.
Ícones antigos (Fluig Icons): Os ícones legados (fluigicon) foram movidos para um arquivo separado. Caso ainda sejam utilizados em formulários, é necessário importá-los manualmente:
/style-guide/css/fluig-icons.min.css
Nova biblioteca de ícones (Animalia Icons): O padrão recomendado são os Animalia Icons (animaliaicon). Assim como no caso dos ícones legados, em formulários eles devem ser importados manualmente:
/style-guide/css/animalia-icons.min.css
Observação: essa configuração é exclusiva para formulários. Na plataforma (desenvolvimento de widgets) a importação ocorre automaticamente, não sendo necessário nenhum ajuste adicional.
Os menus Liquid e Responsive foram atualizados e agora utilizam ícones da biblioteca Animalia Icons.
No Tema Responsivo, a fonte padrão do sistema passou a ser Lato Regular (font-family).
Atenção: essa alteração pode impactar o espaçamento e o alinhamento em temas customizados. Recomenda-se revisar estilos personalizados após a atualização.
Foram aplicadas diversas melhorias de desempenho e organização do código:
Otimização de carregamento
Inclusão de estilos críticos do sistema com rel="preload"
Scripts secundários do sistema carregados com defer
Novas utilitárias no Style Guide
Classes helpers adicionais adicionadas no Style Guide. Consulte a documentação para mais detalhes.
Classes responsivas para fontes, margens e paddings, disponível na mesma documentação.
Novas variáveis de CSS de tema. Consulte a documentação de temas para mais detalhes.