diff --git a/frontend/src/components/Header.css b/frontend/src/components/Header.css index 9ba4a15..98a925d 100644 --- a/frontend/src/components/Header.css +++ b/frontend/src/components/Header.css @@ -22,11 +22,29 @@ z-index: 1; } +.header-title-row { + display: flex; + align-items: center; + gap: 1rem; + margin-bottom: 0.35rem; +} + +.header-logo { + width: 60px; + height: 60px; + object-fit: contain; + border-radius: 10px; + background: white; + padding: 6px; + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255,255,255,0.1); + flex-shrink: 0; +} + .header h1 { font-size: clamp(1.9rem, 3vw, 2.5rem); font-weight: 700; letter-spacing: -0.5px; - margin-bottom: 0.35rem; + margin-bottom: 0; background: linear-gradient(135deg, #fff 0%, #a5b4fc 50%, #60a5fa 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; @@ -64,15 +82,15 @@ background: rgba(79,70,229,0.1); border: 1px solid rgba(79,70,229,0.3); border-radius: 12px; - padding: 1rem; + padding: 0.875rem; margin-top: 1.25rem; } .criteria-box h3 { color: var(--accent-2); - font-size: 0.95rem; + font-size: 0.9rem; font-weight: 600; - margin-bottom: 1rem; + margin-bottom: 0.875rem; text-align: center; text-transform: uppercase; letter-spacing: 1.5px; @@ -84,7 +102,7 @@ .criteria-box h3::after { content: ""; position: absolute; - bottom: -6px; + bottom: -5px; left: 50%; transform: translateX(-50%); width: 60px; @@ -92,10 +110,14 @@ background: linear-gradient(90deg, transparent, var(--accent-2), transparent); } -.criteria-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); - gap: 1rem; +.criteria-row { + display: flex; + gap: 0.6rem; + margin-bottom: 0.6rem; +} + +.criteria-row:last-child { + margin-bottom: 0; } .criteria-section { @@ -103,11 +125,15 @@ backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.08); - border-radius: 14px; - padding: 1rem; + border-radius: 10px; + padding: 0.5rem 0.5rem 0.5rem 0.4rem; position: relative; overflow: hidden; - transition: transform 0.2s ease, box-shadow 0.2s ease; + flex: 1; +} + +.criteria-section.wide { + flex: 1 1 100%; } .criteria-section::before { @@ -116,123 +142,78 @@ top: 0; left: 0; right: 0; - height: 3px; - border-radius: 14px 14px 0 0; + height: 2px; + border-radius: 10px 10px 0 0; } -.criteria-section:hover { - transform: translateY(-2px); - box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3); -} - -.criteria-section.bloco-a { - border-color: rgba(99, 102, 241, 0.3); - background: linear-gradient(180deg, rgba(99, 102, 241, 0.08) 0%, rgba(255,255,255,0.02) 100%); - box-shadow: 0 4px 20px rgba(99, 102, 241, 0.1), inset 0 1px 0 rgba(255,255,255,0.05); -} - -.criteria-section.bloco-a::before { - background: linear-gradient(90deg, #6366f1, #818cf8, #6366f1); -} - -.criteria-section.bloco-a h4 { - color: #a5b4fc; -} - -.criteria-section.bloco-c { - border-color: rgba(234, 179, 8, 0.3); - background: linear-gradient(180deg, rgba(234, 179, 8, 0.08) 0%, rgba(255,255,255,0.02) 100%); - box-shadow: 0 4px 20px rgba(234, 179, 8, 0.1), inset 0 1px 0 rgba(255,255,255,0.05); -} - -.criteria-section.bloco-c::before { - background: linear-gradient(90deg, #eab308, #fbbf24, #eab308); -} - -.criteria-section.bloco-c h4 { - color: #fcd34d; -} - -.criteria-section.bloco-c .pts-value { - color: #fcd34d !important; -} - -.criteria-section.bloco-d { - border-color: rgba(217, 119, 6, 0.3); - background: linear-gradient(180deg, rgba(217, 119, 6, 0.08) 0%, rgba(255,255,255,0.02) 100%); - box-shadow: 0 4px 20px rgba(217, 119, 6, 0.1), inset 0 1px 0 rgba(255,255,255,0.05); -} - -.criteria-section.bloco-d::before { - background: linear-gradient(90deg, #d97706, #f59e0b, #d97706); -} - -.criteria-section.bloco-d h4 { - color: #fbbf24; -} - -.criteria-section.bloco-d .pts-value { - color: #fbbf24 !important; +.section-header { + display: flex; + align-items: center; + gap: 0.4rem; + margin-bottom: 0.4rem; + flex-wrap: nowrap; } .criteria-section h4 { color: var(--accent-2); - font-size: 0.85rem; - margin-bottom: 0.25rem; - letter-spacing: 0.4px; - display: inline; + font-size: 0.7rem; + margin: 0; + letter-spacing: 0.2px; + white-space: nowrap; } .max-pts { - display: inline-block; - margin-left: 0.5rem; - padding: 0.2rem 0.6rem; - border-radius: 6px; - font-size: 0.7rem; + padding: 0.1rem 0.35rem; + border-radius: 4px; + font-size: 0.55rem; font-weight: 600; - letter-spacing: 0.3px; + letter-spacing: 0.2px; + white-space: nowrap; + flex-shrink: 0; + margin-left: auto; } -.bloco-a .max-pts { - background: rgba(99, 102, 241, 0.25); - color: #c7d2fe; - border: 1px solid rgba(99, 102, 241, 0.4); +.table-columns { + display: flex; + gap: 0.5rem; } -.bloco-c .max-pts { - background: rgba(234, 179, 8, 0.2); - color: #fef08a; - border: 1px solid rgba(234, 179, 8, 0.4); -} - -.bloco-d .max-pts { - background: rgba(217, 119, 6, 0.2); - color: #fed7aa; - border: 1px solid rgba(217, 119, 6, 0.4); +.table-columns .criteria-table { + flex: 1; } .criteria-table { width: 100%; - margin-top: 0.6rem; - font-size: 0.75rem; + margin-top: 0.25rem; + font-size: 0.65rem; border-collapse: collapse; } +.criteria-table.compact { + font-size: 0.6rem; +} + .criteria-table th { - text-align: left; + text-align: center; color: var(--silver); font-weight: 500; - padding: 0.3rem 0.4rem; + padding: 0.15rem 0.2rem; border-bottom: 1px solid rgba(255,255,255,0.1); - font-size: 0.7rem; + font-size: 0.55rem; text-transform: uppercase; - letter-spacing: 0.5px; + letter-spacing: 0.3px; + white-space: nowrap; +} + +.criteria-table th:first-child { + text-align: left; } .criteria-table td { - padding: 0.35rem 0.4rem; + padding: 0.15rem 0.2rem; color: var(--muted); border-bottom: 1px dashed rgba(255,255,255,0.05); + white-space: nowrap; } .criteria-table tr:last-child td { @@ -244,24 +225,175 @@ font-weight: 500; } -.pts-value { - text-align: right; - color: var(--accent-2) !important; - font-weight: 400 !important; +.criteria-table td:not(:first-child) { + text-align: center; } .criteria-note { - margin-top: 0.5rem; - padding-top: 0.4rem; + margin-top: 0.3rem; + padding-top: 0.25rem; border-top: 1px dashed rgba(255,255,255,0.1); - font-size: 0.7rem; + font-size: 0.55rem; color: var(--muted); text-align: center; font-style: italic; } -@media (max-width: 768px) { - .criteria-grid { - grid-template-columns: 1fr; +/* Bloco A */ +.criteria-section.bloco-a { + border-color: rgba(99, 102, 241, 0.3); + background: linear-gradient(180deg, rgba(99, 102, 241, 0.08) 0%, rgba(255,255,255,0.02) 100%); +} + +.criteria-section.bloco-a::before { + background: linear-gradient(90deg, #6366f1, #818cf8, #6366f1); +} + +.criteria-section.bloco-a h4 { + color: #a5b4fc; +} + +.bloco-a .max-pts { + background: rgba(99, 102, 241, 0.25); + color: #c7d2fe; + border: 1px solid rgba(99, 102, 241, 0.4); +} + +.bloco-a .criteria-table td:not(:first-child) { + color: #a5b4fc; +} + +/* Bloco B */ +.criteria-section.bloco-b { + border-color: rgba(234, 179, 8, 0.3); + background: linear-gradient(180deg, rgba(234, 179, 8, 0.08) 0%, rgba(255,255,255,0.02) 100%); +} + +.criteria-section.bloco-b::before { + background: linear-gradient(90deg, #eab308, #fbbf24, #eab308); +} + +.criteria-section.bloco-b h4 { + color: #fcd34d; +} + +.bloco-b .max-pts { + background: rgba(234, 179, 8, 0.2); + color: #fef08a; + border: 1px solid rgba(234, 179, 8, 0.4); +} + +.bloco-b .criteria-table td:not(:first-child) { + color: #fcd34d; +} + +/* Bloco C */ +.criteria-section.bloco-c { + border-color: rgba(16, 185, 129, 0.3); + background: linear-gradient(180deg, rgba(16, 185, 129, 0.08) 0%, rgba(255,255,255,0.02) 100%); +} + +.criteria-section.bloco-c::before { + background: linear-gradient(90deg, #10b981, #34d399, #10b981); +} + +.criteria-section.bloco-c h4 { + color: #6ee7b7; +} + +.bloco-c .max-pts { + background: rgba(16, 185, 129, 0.2); + color: #a7f3d0; + border: 1px solid rgba(16, 185, 129, 0.4); +} + +.bloco-c .criteria-table td:not(:first-child) { + color: #6ee7b7; +} + +/* Bloco D */ +.criteria-section.bloco-d { + border-color: rgba(217, 119, 6, 0.3); + background: linear-gradient(180deg, rgba(217, 119, 6, 0.08) 0%, rgba(255,255,255,0.02) 100%); +} + +.criteria-section.bloco-d::before { + background: linear-gradient(90deg, #d97706, #f59e0b, #d97706); +} + +.criteria-section.bloco-d h4 { + color: #fbbf24; +} + +.bloco-d .max-pts { + background: rgba(217, 119, 6, 0.2); + color: #fed7aa; + border: 1px solid rgba(217, 119, 6, 0.4); +} + +.bloco-d .criteria-table td:not(:first-child) { + color: #fbbf24; +} + +/* Bloco E */ +.criteria-section.bloco-e { + border-color: rgba(139, 92, 246, 0.3); + background: linear-gradient(180deg, rgba(139, 92, 246, 0.08) 0%, rgba(255,255,255,0.02) 100%); +} + +.criteria-section.bloco-e::before { + background: linear-gradient(90deg, #8b5cf6, #a78bfa, #8b5cf6); +} + +.criteria-section.bloco-e h4 { + color: #c4b5fd; +} + +.bloco-e .max-pts { + background: rgba(139, 92, 246, 0.2); + color: #ddd6fe; + border: 1px solid rgba(139, 92, 246, 0.4); +} + +.bloco-e .criteria-table td:not(:first-child) { + color: #c4b5fd; +} + +@media (max-width: 900px) { + .criteria-row { + flex-wrap: wrap; + } + + .criteria-section { + flex: 1 1 calc(50% - 0.3rem); + min-width: calc(50% - 0.3rem); + } + + .criteria-section.wide { + flex: 1 1 100%; + } + + .table-columns { + flex-wrap: wrap; + } + + .table-columns .criteria-table { + flex: 1 1 100%; + } +} + +@media (max-width: 600px) { + .criteria-section { + flex: 1 1 100%; + } + + .header-title-row { + gap: 0.75rem; + } + + .header-logo { + width: 48px; + height: 48px; + padding: 4px; } } diff --git a/frontend/src/components/Header.jsx b/frontend/src/components/Header.jsx index e5cbcf9..4d627f9 100644 --- a/frontend/src/components/Header.jsx +++ b/frontend/src/components/Header.jsx @@ -10,68 +10,171 @@ const Header = ({ total }) => { return (
-

Ranking de Consultores CAPES

+
+ CAPES +

Ranking de Consultores CAPES

+

- Sistema de pontuacao baseado nos Criterios V2 | - 3 Blocos: Coordenacao CAPES + Consultoria + Premiacoes/Avaliacoes + Ranking ATUACAPES V1.0 | Dezembro 2025

Gerado em {dataGeracao} | Total: {totalFormatado} consultores
-

Blocos de Pontuacao

-
+

Criterios de Pontuacao

+ +
-

A - Coordenacao CAPES

- max 450 pts +
+

A - Coordenacao CAPES

+ max 450 +
- - - - - - + - - - - + + + +
CodigoBaseTempoBonus
CodBaseTetoTempoAtRet
CA20010/ano (max 100)30
CAJ1508/ano (max 80)20
CAJ_MP1206/ano (max 60)15
CAM1005/ano (max 50)20
CA20045010/a3020
CAJ1503708/a2015
CAJ_MP1203156/a1510
CAM1002805/a2010
-
+ Retorno (20)
+
+ +
+
+

B - Consultoria

+ max 230 +
+ + + + + + + + + +
CodBaseTetoTempoBonus
ATIVO1502305/aAt+Ct+Rt
HIST1002305/aCt+Rt
FALEC1002305/aCt
+
At=20 Ct=20 Rt=15-20 | Teto tempo: 50
+
+ +
+
+

E - Coord. PPG

+ V2 +
+ + + + + + + +
CodBaseTeto
PPG_COORD00
+
Dados incompletos no V1
+
+
+ +
+
+
+

C - Premiacoes, Avaliacoes, Inscricoes

+ max 300 +
+
+ + + + + + + + + +
PremiacoesBaseTeto
PREMIACAO_GP100300
PREMIACAO50150
MENCAO3090
+ + + + + + + + + + +
ComissoesBaseTeto
COORD_GP50120
COORD40100
AVAL_GP4080
AVAL3060
+ + + + + + + + +
InscricoesBaseTeto
INSC_INST2050
INSC_AUTOR1020
+
+
+
+ +
+
+
+

C - Orientacoes

+ selos +
+
+ + + + + + + +
OrientacaoBT
POS_DOC00
TESE00
DISS00
+ + + + + + + +
Co-OrientBT
POS_DOC00
TESE00
DISS00
+
+
+versoes _PREM | Selos no V1
-

C - Consultoria

- max 230 pts - +
+

C - Bancas

+ selos +
+
+ - - - - - - - - + + +
Membro BancaBaseTeto
CONS_ATIVO150 pts
CONS_HIST100 pts
CONS_FALECIDO100 pts
Tempo5 pts/ano (max 50)
Continuidade 3a+5 pts
Continuidade 5a+10 pts
Continuidade 8a++15 pts
Retorno+15 pts
MB_POS_DOC00
MB_TESE00
MB_DISS00
+
+versoes _PREM | Selos no V1
-

D - Premiacoes e Avaliacoes

- max 180 pts - +
+

D - Indicadores

+ selos +
+
+ - - - - - - + + + + +
CodigoBaseTeto
PREMIACAO (GP)150 pts (max 180)
PREMIACAO_GP30 pts (max 60)
MENCAO10 pts (max 20)
INSC_INST30 pts (max 60)
AVAL_COMIS_GP50 pts (max 100)
COORD_COMIS_GP60 pts (max 120)
BOL_BPQ3060
PROJ1030
EVENTO15
IDIOMA00
TITULACAO00