# Guia de Customização do Planka - Stelium

Localização dos Arquivos

Todos os arquivos customizáveis estão em:

/opt/stelium/data/planka/custom/

Arquivos para Customização

1. FAVICON (ícone da aba do navegador)

Arquivo	Localização
`favicon.ico`	`/opt/stelium/data/planka/custom/public/favicon.ico`

Especificações:

Formato: ICO (multi-resolução)
Tamanhos incluídos: 16x16, 24x24, 32x32, 64x64 pixels
Ferramenta recomendada: https://favicon.io ou https://realfavicongenerator.net

2. LOGOS (ícones do app/PWA)

Arquivo	Localização	Tamanho
`logo192.png`	`/opt/stelium/data/planka/custom/public/logo192.png`	192x192 px
`logo512.png`	`/opt/stelium/data/planka/custom/public/logo512.png`	512x512 px

Especificações:

Formato: PNG com transparência
Usar o mesmo design em ambos os tamanhos
Usado quando o app é instalado como PWA

3. LOGO INTERNO (exibido no app)

Arquivo	Localização
`logo.f8c2b962d0f2bd7f46cb.png`	`/opt/stelium/data/planka/custom/media/logo.f8c2b962d0f2bd7f46cb.png`

Especificações:

Formato: PNG com transparência
Tamanho atual: ~22KB
Exibido no canto superior esquerdo do app
Recomendado: altura de ~40px, largura proporcional

4. BACKGROUND DA PÁGINA DE LOGIN

Arquivo	Localização
`cover.a3c21cab987867165c62.jpg`	`/opt/stelium/data/planka/custom/media/cover.a3c21cab987867165c62.jpg`

Especificações:

Formato: JPG
Resolução recomendada: 1920x1080 ou maior
Tamanho máximo recomendado: ~600KB
A imagem é exibida como background com cover (preenche toda a área)
Há um overlay escuro semi-transparente sobre a imagem

5. MANIFEST.JSON (configurações do PWA)

Arquivo	Localização
`manifest.json`	`/opt/stelium/data/planka/custom/public/manifest.json`

Conteúdo atual:

{
  "name": "Planka",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    },
    {
      "src": "logo192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "logo512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#22252a",
  "background_color": "#ffffff"
}

O que pode ser alterado:

name: Nome do aplicativo (ex: "Stelium Trilhas")
theme_color: Cor da barra de título do navegador (formato hex)
background_color: Cor de fundo durante carregamento (formato hex)

6. CSS PRINCIPAL (cores, fontes, estilos)

Arquivo	Localização
`main.609d3ed8.css`	`/opt/stelium/data/planka/custom/css/main.609d3ed8.css`

ATENÇÃO: Este arquivo é minificado e complexo (~678KB). Edite com cuidado.

Cores principais usadas no Planka:

Elemento	Cor Atual	Código Hex
Background do app	Cinza escuro	`#22252a`
Overlay do login	Preto semi-transparente	`#21212180`
Links	Azul	`#0969da`
Botões primários	Azul	`#216ba5`
Header/menu	Preto transparente	`#0000003d`

Fonte utilizada: Nunitoga (já inclusa no app)

Para alterar cores globalmente, faça busca e substituição no CSS:

Buscar: #22252a → Substituir pela nova cor de background
Buscar: #216ba5 → Substituir pela nova cor de botões

Como Aplicar as Alterações

Após substituir os arquivos, execute o comando:

docker stack deploy -c /opt/stelium/stacks/planka/stack.yml planka

Ou aguarde ~30 segundos que o Docker detectará as mudanças automaticamente.

Checklist para o Designer

Estrutura de Diretórios

/opt/stelium/data/planka/custom/
├── public/
│   ├── favicon.ico          ← Ícone do navegador
│   ├── logo192.png           ← Logo PWA pequeno
│   ├── logo512.png           ← Logo PWA grande
│   └── manifest.json         ← Configurações do PWA
├── media/
│   ├── cover.*.jpg           ← Background do login
│   └── logo.*.png            ← Logo interno do app
└── css/
    └── main.*.css            ← Estilos (cores, fontes)

Observações Importantes

NUNCA renomeie os arquivos - os nomes devem permanecer exatamente iguais
Faça backup antes de qualquer alteração
Teste em navegador anônimo para ver as mudanças (cache pode interferir)
Os arquivos são montados como somente leitura (:ro) por segurança

URL de Acesso

Produção: https://trilhas.stelium.com.br
Login admin: admin / Stelium_Admin_2025