curriculum

Cover Letter — Template de Candidatura

Baseado no layout da ília. Para cada nova candidatura, clone esta rota e ajuste as constantes no topo do arquivo.

---

Fluxo para nova candidatura

1. Copie src/app/cover-letter-v2/page.tsx    →  src/app/[empresa]-cover/page.tsx
2. Copie src/data/covers/cover-letter-v2.json       →  src/data/covers/cover-letter-[empresa].json
3. Atualize o import no page.tsx para apontar ao novo JSON
4. Preencha o JSON com os dados da empresa
5. Adicione a logo em public/[empresa]-logo.png
6. Adicione a rota em src/app/candidaturas/page.tsx

---

JSON de candidatura — campos

src/data/covers/cover-letter-v2.json:

{
  "company": {
    "name": "Nome da Empresa",
    "city": "Toronto, ON, Canadá",
    "logo": "/empresa-logo.png"
  },
  "position": "Senior QA Engineer",
  "greeting": "Recrutador(a)",
  "theme": {
    "dark": "#1e293b",
    "accent": "#328636"
  }
}

Campo	Descrição
company.name	Aparece em destaque abaixo do header
company.city	Linha de endereço da empresa
company.logo	URL da logo — local (/logo.png) ou externo (https://...). Aceita URLs do LinkedIn. "" exibe placeholder
position	Título da vaga (linha de referência da candidatura)
greeting	Nome do recrutador ou "Recrutador(a)" se desconhecido
theme.dark	Cor de fundo do header
theme.accent	Cor de destaque — aparece em 6 pontos do layout
letter.opening	(opcional) Parágrafo de abertura — incluído no JSON exportado se editado
letter.background	(opcional) Parágrafo de experiência
letter.closing	(opcional) Parágrafo de encerramento

---

Logo

Formato

• PNG com fundo transparente — ideal. Evita conflito com o header escuro.
• JPG funciona, mas o canto quadrado fica visível sobre o fundo escuro.
• SVG não é suportado diretamente pelo <Image> do Next.js sem configuração extra — use PNG.

Tamanho ideal

O componente renderiza a logo em 86 × 86 px com objectFit: "cover".

Uso	Tamanho recomendado
Tela padrão	86 × 86 px
Retina / HiDPI	172 × 172 px
Máximo seguro	300 × 300 px

• Proporção 1:1 (quadrada) — logos retangulares serão cortadas pelo objectFit: "cover". Se a logo for horizontal, adicione padding transparente para torná-la quadrada antes de exportar.
• Coloque o arquivo em public/ — ex: public/questrade-logo.png → COMPANY_LOGO = "/questrade-logo.png".

Onde buscar uma logo já quadrada (evitar cortar wordmark depois)

Sites institucionais geralmente só têm a wordmark horizontal (nome da empresa por extenso), que fica cortada de forma ruim em um box quadrado. Preferir, nesta ordem:

1. Favicon / app icon do site oficial (geralmente já quadrado, ícone de marca sem texto).
2. Avatar/logo da página da empresa no LinkedIn (linkedin.com/company/{empresa}) — sempre quadrado, mesmo quando o site só tem wordmark.
3. Se só houver wordmark: extrair o ícone/símbolo isolado de dentro da wordmark (recortar só a marca gráfica, sem o texto do nome), em vez de espremer a wordmark inteira num box quadrado.

Sem logo

Deixe COMPANY_LOGO = "". O placeholder dashed aparece automaticamente com o texto “Logo”.

---

Cores da empresa

DARK — fundo do header

Cor principal da empresa, preferencialmente escura para manter o texto branco legível.

const DARK = "#003087";   // ex: azul marinho Questrade

Se a empresa usar uma cor clara (branco, amarelo), inverta os textos do header manualmente — ou use a versão mais escura da paleta da marca.

ACCENT — cor de destaque

Aparece em 6 lugares:

• Faixa de 5px na base do header
• Nome da empresa (texto colorido)
• Separador horizontal (linha 2px)
• Borda esquerda da referência da vaga
• Linha de assinatura
• Bolinhas da seção de destaques

Use a cor secundária ou de ação da empresa — geralmente funciona bem em verde, azul, teal, laranja.

const ACCENT = "#0066CC";   // ex: azul de ação

Exemplos de combinações

Empresa	DARK	ACCENT
ília digital	#2B2ECC	#4ECFCE
StackAdapt	#0A0C14	#2271FF
Questrade	#003087	#0066CC
Genérica (padrão)	#1e293b	#328636

---

Verificar antes de imprimir

• Abra http://localhost:3000/[empresa]-cover
• Use Ctrl+P / Cmd+P e verifique o preview
• O header escuro precisa aparecer colorido — se estiver branco, ative “Background graphics” nas opções de impressão do navegador
• Tamanho de papel: A4 ou Letter, margens mínimas