maciejpi/nordabiz
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactor(pej): navy colorscheme, interactive links, real contact data
Some checks are pending
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
Details
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
Details
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions
Details
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
Details

Browse Source 
Purple -> navy blue (#1a365d) for professional look.
Source links have hover states. Contact cards show LinkedIn
profiles and PEJ office phone/email.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Maciej Pienczyn 2026-03-16 21:35:38 +01:00
parent e75586f0b9
commit ac4982bb1e
1 changed files with 51 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
templates/pej/index.html
View File

@ -5,7 +5,7 @@
{% block extra_css %}
<style>
.pej-hero {
background: #7c3aed;
background: #1a365d;
color: #fff;
padding: var(--spacing-2xl) 0;
margin: calc(-1 * var(--spacing-lg)) calc(-1 * var(--spacing-lg)) var(--spacing-xl);
@ -20,7 +20,7 @@
margin-bottom: var(--spacing-xl);
}
.pej-stat { text-align: center; }
.pej-stat-value { font-size: 2rem; font-weight: 700; color: #7c3aed; }
.pej-stat-value { font-size: 2rem; font-weight: 700; color: #1a365d; }
.pej-stat-label { font-size: var(--font-size-sm); color: var(--text-secondary); }
.pej-section { margin-bottom: var(--spacing-xl); }
@ -34,7 +34,7 @@
@media (max-width: 768px) { .pej-grid { grid-template-columns: 1fr; } }
.pej-announcement {
background: #f5f3ff; border: 1px solid #e9d5ff; border-radius: var(--radius);
background: #eef2f7; border: 1px solid #c3d5e8; border-radius: var(--radius);
padding: var(--spacing-md); margin-bottom: var(--spacing-sm);
}
.pej-announcement-title { font-weight: 600; margin-bottom: var(--spacing-xs); }
@ -45,10 +45,10 @@
border-radius: var(--radius); padding: var(--spacing-md);
margin-bottom: var(--spacing-sm); transition: var(--transition);
}
.pej-news-card:hover { border-color: #7c3aed; }
.pej-news-card:hover { border-color: #1a365d; }
.pej-news-card h3 { font-size: var(--font-size-md); margin-bottom: var(--spacing-xs); }
.pej-news-card h3 a { color: var(--text-primary); text-decoration: none; }
.pej-news-card h3 a:hover { color: #7c3aed; }
.pej-news-card h3 a:hover { color: #1a365d; }
.pej-news-card .meta { font-size: var(--font-size-sm); color: var(--text-secondary); }
.pej-milestone {
@ -57,14 +57,14 @@
}
.pej-milestone:last-child { border-bottom: none; }
.pej-milestone-date {
min-width: 80px; font-size: var(--font-size-sm); color: #7c3aed; font-weight: 600;
min-width: 80px; font-size: var(--font-size-sm); color: #1a365d; font-weight: 600;
}
.pej-milestone-title { font-size: var(--font-size-sm); }
.pej-milestone-status {
font-size: 0.7rem; padding: 2px 6px; border-radius: 10px;
display: inline-block; margin-left: var(--spacing-xs);
}
.pej-milestone-status.planned { background: #e0e7ff; color: #3730a3; }
.pej-milestone-status.planned { background: #dbeafe; color: #1e40af; }
.pej-milestone-status.in_progress { background: #fef3c7; color: #92400e; }
.pej-milestone-status.completed { background: #d1fae5; color: #065f46; }
.pej-milestone-status.delayed { background: #fee2e2; color: #991b1b; }
@ -78,17 +78,17 @@
border-radius: var(--radius); padding: var(--spacing-md);
transition: var(--transition);
}
.pej-company-card:hover { border-color: #7c3aed; box-shadow: 0 2px 8px rgba(124,58,237,0.1); }
.pej-company-card:hover { border-color: #1a365d; box-shadow: 0 2px 8px rgba(26,54,93,0.1); }
.pej-company-name { font-weight: 600; margin-bottom: var(--spacing-xs); }
.pej-company-name a { color: var(--text-primary); text-decoration: none; }
.pej-company-name a:hover { color: #7c3aed; }
.pej-company-name a:hover { color: #1a365d; }
.pej-company-meta { font-size: var(--font-size-sm); color: var(--text-secondary); }
.pej-company-score {
display: inline-block; background: #f5f3ff; color: #7c3aed;
display: inline-block; background: #eef2f7; color: #1a365d;
padding: 2px 8px; border-radius: 10px; font-size: var(--font-size-sm); font-weight: 600;
}
.pej-company-type {
display: inline-block; background: #e0e7ff; color: #3730a3;
display: inline-block; background: #dbeafe; color: #1e40af;
padding: 2px 8px; border-radius: 10px; font-size: 0.75rem;
}
.pej-company-desc {
@ -105,10 +105,10 @@
border-radius: var(--radius); text-decoration: none; font-weight: 500;
transition: var(--transition);
}
.pej-btn-primary { background: #7c3aed; color: #fff; }
.pej-btn-primary:hover { background: #6d28d9; }
.pej-btn-outline { border: 1px solid #7c3aed; color: #7c3aed; }
.pej-btn-outline:hover { background: #f5f3ff; }
.pej-btn-primary { background: #1a365d; color: #fff; }
.pej-btn-primary:hover { background: #0f2440; }
.pej-btn-outline { border: 1px solid #1a365d; color: #1a365d; }
.pej-btn-outline:hover { background: #eef2f7; }
.pej-media-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-lg); }
@media (max-width: 768px) { .pej-media-grid { grid-template-columns: 1fr; } }
@ -116,7 +116,7 @@
display: block; text-decoration: none; border-radius: var(--radius);
border: 1px solid var(--border); overflow: hidden; transition: var(--transition);
}
.pej-video-card:hover { border-color: #7c3aed; box-shadow: 0 2px 8px rgba(124,58,237,0.1); }
.pej-video-card:hover { border-color: #1a365d; box-shadow: 0 2px 8px rgba(26,54,93,0.1); }
.pej-video-thumb {
position: relative; padding-bottom: 56.25%; background: #000;
}
@ -125,7 +125,7 @@
}
.pej-video-play {
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
width: 60px; height: 60px; background: rgba(124,58,237,0.9); border-radius: 50%;
width: 60px; height: 60px; background: rgba(26,54,93,0.85); border-radius: 50%;
display: flex; align-items: center; justify-content: center;
}
.pej-video-play::after {
@ -153,15 +153,26 @@
.pej-sources { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-lg); }
@media (max-width: 768px) { .pej-sources { grid-template-columns: 1fr; } }
.pej-source-group { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--spacing-md); }
.pej-source-group h3 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-sm); color: #7c3aed; }
.pej-source-group h3 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-sm); color: #1a365d; }
.pej-source-item { display: flex; align-items: flex-start; gap: var(--spacing-sm); padding: var(--spacing-xs) 0; }
.pej-source-item { transition: var(--transition); border-radius: var(--radius); padding: var(--spacing-sm); margin: 0 calc(-1 * var(--spacing-sm)); }
.pej-source-item:hover { background: #eef2f7; }
.pej-source-item a { color: var(--text-primary); text-decoration: none; font-size: var(--font-size-sm); }
.pej-source-item a:hover { color: #7c3aed; }
.pej-source-item a:hover { color: #2563eb; }
.pej-source-item a strong { color: #1a365d; }
.pej-source-item .pej-src-label { font-size: 0.75rem; color: var(--text-secondary); }
.pej-source-icon { min-width: 20px; color: #7c3aed; font-size: var(--font-size-sm); }
.pej-contact-card { background: #f5f3ff; border-radius: var(--radius); padding: var(--spacing-md); margin-bottom: var(--spacing-sm); }
.pej-contact-name { font-weight: 600; }
.pej-source-icon { min-width: 24px; width: 24px; height: 24px; color: #1a365d; font-size: var(--font-size-md); display: flex; align-items: center; justify-content: center; }
.pej-contact-card {
background: #eef2f7; border-radius: var(--radius); padding: var(--spacing-md);
margin-bottom: var(--spacing-sm); transition: var(--transition);
border-left: 3px solid transparent; cursor: default;
}
.pej-contact-card:hover { border-left-color: #2563eb; background: #e8eef5; }
.pej-contact-card a { color: #2563eb; text-decoration: none; font-size: var(--font-size-sm); }
.pej-contact-card a:hover { text-decoration: underline; }
.pej-contact-name { font-weight: 600; display: flex; align-items: center; gap: var(--spacing-sm); }
.pej-contact-role { font-size: var(--font-size-sm); color: var(--text-secondary); }
.pej-contact-details { font-size: var(--font-size-sm); margin-top: var(--spacing-xs); }
</style>
{% endblock %}
@ -314,18 +325,35 @@
</div>
<div class="pej-source-group">
<h3>Osoby kontaktowe w PEJ</h3>
<h3>Osoby kontaktowe i biuro PEJ</h3>
<div class="pej-contact-card">
<div class="pej-contact-name">Grzegorz Maj</div>
<div class="pej-contact-role">Pełnomocnik Zarządu ds. Wsparcia Rozwoju Rynku (Local Content)</div>
<div class="pej-contact-details">
<a href="https://www.linkedin.com/in/grzegorz-maj-80145574/" target="_blank" rel="noopener">LinkedIn &rarr;</a>
</div>
</div>
<div class="pej-contact-card">
<div class="pej-contact-name">Marek Woszczyk</div>
<div class="pej-contact-role">Prezes Zarządu PEJ</div>
<div class="pej-contact-details">
<a href="https://www.linkedin.com/in/marek-woszczyk-emba-1670a969/" target="_blank" rel="noopener">LinkedIn &rarr;</a>
</div>
</div>
<div class="pej-contact-card">
<div class="pej-contact-name">Leszek Hołda</div>
<div class="pej-contact-role">Prezes Bechtel Polska</div>
<div class="pej-contact-details">
<a href="https://www.linkedin.com/in/leszekholda/" target="_blank" rel="noopener">LinkedIn &rarr;</a>
</div>
</div>
<div class="pej-contact-card" style="background: #e8eef5; border-left-color: #1a365d;">
<div class="pej-contact-name">Biuro PEJ</div>
<div class="pej-contact-role">Al. Jerozolimskie 132/136, 02-305 Warszawa</div>
<div class="pej-contact-details">
<a href="tel:+48223402980">+48 22 340 2980</a> &middot;
<a href="mailto:korespondencja@pej.pl">korespondencja@pej.pl</a>
</div>
</div>
</div>