@bywise-consulting/po-ui-theme
v1.0.5
Published
PO UI Custom Theme for By Wise Applications
Downloads
3
Readme
@bywise-consulting/po-ui-theme
Tema customizado para o PO UI utilizado em aplicações da By Wise Consulting.
Instalação
Faça a instalação global da ferramenta:
npm install @bywise-consulting/po-ui-theme
Você pode ver as opções disponíveis através do comando:
Utilizando o tema customizado
Existem 3 formas de você usar o tema customizado após a publicação.
Configure o arquivo angular.json
da aplicação conforme for mais conveniente as suas necessidade.
1 - Usar o arquivo "compilado" com todo o CSS.
"styles": [
"./node_modules/@bywise-consulting/po-ui-theme/css/po-theme-custom.min.css",
"src/styles.css"
],
Prós: Modo mais simples de usar e atende aos browser suportados.
Contras: O tema customizado deve ser sempre atualizado conforme o tema padrão for publicado, pois pode ficar sem os novos estilos publicados.
2 - Usar o arquivo de variáveis do tema customizado + arquivo CSS do tema padrão
"styles": [
"./node_modules/@bywise-consulting/po-ui-theme/css/po-theme-custom-variables.min.css",
"./node_modules/@po-ui/style/css/po-theme-core.min.css",
"src/styles.css"
],
Atenção a ordem dos arquivos
Prós: Permite que o usuário do tema customizado aplique customizações em cima do tema customizado na aplicação final.
Contras: O tema customizado deve ser sempre atualizado conforme o tema padrão for publicado e pode ter incompatibilidade com browsers antigos que não dão suporte a variáveis no CSS.
3 - Usar o arquivo de variáveis do tema padrão + variáveis do tema customizado + arquivo CSS do tema padrão
"styles": [
"./node_modules/@po-ui/style/css/po-theme-default-variables.min.css",
"./node_modules/@bywise-consulting/po-ui-theme/css/po-theme-custom-variables.min.css",
"./node_modules/@po-ui/style/css/po-theme-core.min.css",
"src/styles.css"
],
Atenção a ordem dos arquivos
Prós: Não corre risco de perder novos estilos, permite que o usuário do tema customizado aplique customizações em cima do tema customizado na aplicação final.
Contras: Pode ter incompatibilidade com browsers antigos que não dão suporte a variáveis no CSS.
Atenção: Para saber quais browsers dão suporte a variáveis você pode consultar a ferramenta Can I use.