01. Introdução
A partir da versão 24.07 dos ícones que compõem a navegação dos módulos desktop dos produtos TOTVS Varejo Supermercados - Linha Consinco e TOTVS Varejo Supermercados WMS foram atualizados utilizando os conceitos de simbologia e tendências de estilo de iconografia mais comuns no dia a dia dos usuários dos produtos. É importante salientar que a posição dos ícones e as suas funções permanecem as mesmas, sendo que as alterações referem-se apenas ao seu aspecto visual.
02. Guia de mudanças
Acesse as abas laterais para visualizar a alteração dos ícones conforme o tipo de ação a ser executada.
...
Informações |
---|
|
Deck of Cards |
---|
| Card |
---|
default | true |
---|
id | 1 |
---|
label | Ação |
---|
title | Ação |
---|
| AçãoVeja os principais ícones: #Adicionar #Adicionar linha #Atualizar #Avançar #Baixar #Bloquear #Carregar #Clicar #Colar #Compartilhar #Configurar #Copiar #Copiar cor #Cortar #Deletar #Deletar linha #Desfazer #Editar #Enviar #Exportar #Filtrar #Girar #Histórico #Imprimir #Iniciar #Limpar #Link #Mudar #Organizar #Parâmetros #Parar #Pausar #Percentual #Pesquisar #Replicar #Sair #Salvar #Selecionar #Voltar
|
Card |
---|
id | 2 |
---|
label | Negócios |
---|
title | Negócios |
---|
| NegóciosVeja os principais ícones: #Companhia
|
Card |
---|
id | 3 |
---|
label | Comunicação |
---|
title | Comunicação |
---|
| ComunicaçãoVeja os principais ícones: #Email #Email aberto #Mensagem
|
Card |
---|
id | 4 |
---|
label | Conexões e Tecnologias |
---|
title | Conexões e Tecnologias |
---|
| Conexões e TecnologiasVeja os principais ícones: #Commit # Conectado #Conexão #Data base # Desconectado #Escolhas #Objeto inválido
|
Card |
---|
| DadosVeja os principais ícones: #Editar gráfico #Gráficos # Legenda de gráficos #Visualização gráfico
|
Card |
---|
id | 6 |
---|
label | Dispositivos |
---|
title | Dispositivos |
---|
| DispositivosVeja os principais ícones: #Câmera #Desktop
|
Card |
---|
Card |
---|
id | 7 |
---|
label | Documento |
---|
title | Documento |
---|
| DocumentoVeja os principais ícones: #Arquivo #Documento #Livro #Notas #Pasta #Pasta aberta #Prancheta
|
Card |
---|
id | 9 |
---|
label | Formatação |
---|
title | Formatação |
---|
| Veja os principais ícones: #Cor texto #Fonte texto #Texto bold #Texto Itálico #Texto sublinhado #Texto tachado
|
Card |
---|
id | 10 |
---|
label | Logística |
---|
title | Logística |
---|
| LogísticaVeja os principais ícones: #Adicionar palete #Adicionar rota #Balanças #Bloquear palete #Carrinho de mão #Despachar produto #Empilhadeira #Estrada #Movimentar palete #Palete 3D #Paletes #Produto #Rota #Transportes
|
Card |
---|
id | 11 |
---|
label | Navegação |
---|
title | Navegação |
---|
| NavegaçãoVeja os principais ícones: #Aumentar zoom #Diminuir zoom #Direções #Divisas #Maximizar #Minimizar #Setas
|
Card |
---|
id | 12 |
---|
label | Pessoas |
---|
title | Pessoas |
---|
| PessoasVeja os principais ícones: #Adicionar usuário #Deletar usuário #Usuários
|
Card |
---|
id | 13 |
---|
label | Suporte |
---|
title | Suporte |
---|
| SuporteVeja os principais ícones: #Ajuda #Atenção #Cuidado #Cuidado de segurança #Erro #Informação #Sucesso de segurança
|
Card |
---|
id | 14 |
---|
label | Status |
---|
title | Status |
---|
| StatusVeja os principais ícones: #Led amarelo #Led azul #Led azul e vermelho #Led cinza #Led preto #Led verde #Led vermelho #Status fonte vermelha
|
Card |
---|
| TempoVeja os principais ícones: #Calculadora #Calendário concluído #Cronômetro #Editar calendário #Relógio
|
Card |
---|
id | 16 |
---|
label | Alternados |
---|
title | Alternados |
---|
| AlternadosVeja os principais ícones: #Cadeado #Raio
|
Card |
---|
id | 17 |
---|
label | Outros |
---|
title | Outros |
---|
| OutrosVeja os principais ícones: #Foto #Luz #Marcação #Marcação cancelada
|
Composition Setup |
---|
deck.tab.inactive.background = #fcfcfc
deck.tab.active.background = #B4E2FD
deck.text.color = #ffffff |
|
|
03. ASSUNTOS RELACIONADOS
Modernização visual - Atualizações nos ícones
Modernização visual - Principais mudanças
Atualização do Consinco Client (C5Client)
HTML |
---|
<style>
div.theme-default .ia-splitter #main {
}
#main {
}
.aui-header-primary .aui-nav {
margin-left: none !important;
}
.expand-control-text {
color: #000000;
font-size: 14px !important;
font-weight:bold !important;
}
.expand-icon, .aui-icon, .aui-icon-small, .aui-iconfont-chevron-right {
color: #FF8000;
}
/* o código abaixo deixa transparente a imagem do banner*/
.composition-banner-overlay{
background:rgba(0,0,0,0.0);
position:relative;
border-radius:5px;
}
/* o código abaixo deixa o botão "clique aqui" na cor preta (ou na cor desejada)*/
.aui-button.aui-button-primary, .aui-button.aui-button-primary:visited {
background-color: #000000;
color: #111111;
display: block;
margin-left: 20px;
margin-right: auto;
/* os 3 códigos abaixo está relacionado a transparencia do banner, (elemento composition-banner)*/
}
.composition-banner-title{
color: #000000!important;
}
.composition-banner-desc{
color: #000000!important;
}
.composition-banner-content {
width:100%;
}
/* o código abaixo é responsável pelo efeito da imagem*/
.composition-banner{
opacity: 1.0 !important;
filter: alpha(opacity=50); /* For IE8 and earlier */
min-height: 20px !important;
min-width: 20px !important;
max-width: 20px !important;
}
.composition-banner:hover,
span.confluence-embedded-file-wrapper.confluence-embedded-manual-size .confluence-embedded-image.confluence-thumbnail:hover{
opacity: 0.5 !important;
cursor: pointer;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
.wiki-content img.confluence-embedded-image{
cursor: pointer !important;
}
</style> |