| layout |
page |
| title |
2025 Awards |
| permalink |
/awards/ |
<style>
.awards-wrapper {
display: flex;
flex-direction: column;
gap: 48px;
}
.awards-intro {
font-size: 1rem;
line-height: 1.7;
color: #1e293b;
background: linear-gradient(135deg, rgba(37, 99, 235, 0.1) 0%, rgba(14, 165, 233, 0.14) 100%);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 20px;
padding: 32px;
box-shadow: 0 20px 55px rgba(15, 23, 42, 0.12);
}
.awards-section h2 {
font-size: 1.8rem;
margin-bottom: 12px;
}
.awards-section p.section-copy {
color: #475569;
margin-bottom: 28px;
max-width: 760px;
}
.award-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
gap: 24px;
}
.award-card {
background: linear-gradient(to bottom, #ffffff 0%, #fafbfc 100%);
border: 1px solid #e8f0fe;
border-radius: 16px;
padding: 24px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.05);
transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
}
.award-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 5px;
background: linear-gradient(90deg, #027ff7, #0ea5e9, #6366f1);
border-radius: 20px 20px 0 0;
}
.award-card:hover {
transform: translateY(-6px);
box-shadow: 0 20px 60px rgba(2, 127, 247, 0.15), 0 8px 24px rgba(0, 0, 0, 0.1);
border-color: #027ff7;
background: #ffffff;
}
.award-rank {
background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
color: white;
padding: 6px 12px;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
display: inline-block;
margin-bottom: 12px;
border: 1px solid #a855f7;
box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3);
}
.award-card h3 {
color: #1a1a1a;
margin-bottom: 12px;
font-size: 1.25rem;
font-weight: 700;
position: relative;
padding-bottom: 6px;
line-height: 1.3;
}
.award-card h3::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 50px;
height: 2px;
background: linear-gradient(90deg, #027ff7, #6366f1);
border-radius: 2px;
}
.award-section {
margin-bottom: 14px;
flex: 1;
}
.award-section-title {
font-weight: 600;
color: #374151;
margin-bottom: 6px;
font-size: 0.8rem;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
gap: 6px;
}
.award-section-title::before {
content: '';
width: 3px;
height: 12px;
background: #027ff7;
border-radius: 2px;
}
.award-team {
color: #4b5563;
line-height: 1.5;
font-size: 0.875rem;
}
.award-description {
color: #4b5563;
line-height: 1.5;
font-size: 0.875rem;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
.award-links {
margin-top: auto;
padding-top: 16px;
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.award-button {
background: linear-gradient(135deg, #027ff7 0%, #0259ce 100%);
color: #ffffff;
padding: 10px 18px;
border: 0;
border-radius: 8px;
font-weight: 600;
font-size: 13px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
}
.award-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: left 0.5s;
}
.award-button:hover::before {
left: 100%;
}
.award-button:hover {
color: #ffffff;
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(2, 127, 247, 0.4);
}
.award-button svg {
width: 14px;
height: 14px;
}
.visionary-card {
background: #fff;
border: 1px solid rgba(226, 232, 240, 0.9);
border-radius: 18px;
padding: 28px;
box-shadow: 0 16px 44px rgba(15, 23, 42, 0.1);
}
.visionary-card ul {
columns: 2;
column-gap: 24px;
margin: 0;
padding: 0;
list-style: none;
}
.visionary-card li {
margin: 0 0 8px 0;
font-weight: 600;
color: #334155;
}
.loading {
text-align: center;
padding: 40px;
color: #6b7280;
font-size: 1rem;
}
@media (max-width: 768px) {
.awards-intro {
padding: 24px;
}
.award-grid {
grid-template-columns: 1fr;
}
.award-card {
padding: 20px;
}
.award-card h3 {
font-size: 1.15rem;
}
.award-description {
-webkit-line-clamp: 5;
}
.visionary-card ul {
columns: 1;
}
}
@media (min-width: 769px) and (max-width: 1200px) {
.award-grid {
grid-template-columns: repeat(2, 1fr);
}
}
</style>
Congratulations to the Lila Prize winning teams for top-scoring overall projects! Please take a moment to celebrate the teams below, explore their project descriptions, and watch their demos. We will be posting these to the website and contacting teams shortly.
<section class="awards-section" aria-label="Lila Prize Winners">
<h2>Lila Prize Winners</h2>
<div class="award-grid" id="lila-awards-grid">
<div class="loading">Loading awards...</div>
</div>
</section>
<section class="awards-section" aria-label="Abstrax Prizes">
<h2>Abstrax Prizes</h2>
<div class="award-grid" id="abstrax-awards-grid">
<div class="loading">Loading awards...</div>
</div>
</section>
<section class="awards-section" aria-label="2025 Visionary Awards">
<h2>2025 Visionary Awards</h2>
<p class="section-copy">These teams were recognized by the judges for exceptional scores, novelty, or innovative approaches. They will be invited to a special session of the hackathon showcase, and all participating teams will still be welcomed.</p>
<div class="award-grid" id="visionary-awards-grid">
<div class="loading">Loading awards...</div>
</div>
</section>
<script>
document.addEventListener('DOMContentLoaded', function() {
fetch('/assets/data/submissions.json')
.then(response => response.json())
.then(data => {
// Filter submissions with awards
const awardedSubmissions = data.filter(s => s.award);
// Group by award type
const lilaWinners = awardedSubmissions
.filter(s => s.award.startsWith('Lila Prize'))
.sort((a, b) => {
// Sort by place number
const getPlace = (award) => {
const match = award.match(/(\d+)(st|nd|rd|th) Place/);
return match ? parseInt(match[1]) : 999;
};
return getPlace(a.award) - getPlace(b.award);
});
const abstraxWinners = awardedSubmissions
.filter(s => s.award === 'Abstrax Prize');
const visionaryWinners = awardedSubmissions
.filter(s => s.award === 'Visionary Award')
.sort((a, b) => a.team_name.localeCompare(b.team_name));
// Render awards
renderAwardCards(lilaWinners, 'lila-awards-grid', true);
renderAwardCards(abstraxWinners, 'abstrax-awards-grid', false);
renderAwardCards(visionaryWinners, 'visionary-awards-grid', false);
})
.catch(error => {
console.error('Error loading awards:', error);
document.querySelectorAll('.loading').forEach(el => {
el.textContent = 'Error loading awards. Please try again later.';
el.style.color = '#dc2626';
});
});
function renderAwardCards(winners, containerId, showRank) {
const container = document.getElementById(containerId);
container.innerHTML = '';
if (winners.length === 0) {
container.innerHTML = 'No awards in this category.
';
return;
}
winners.forEach((submission) => {
const card = document.createElement('article');
card.className = 'award-card';
// Extract rank from award name
let rankBadge = '';
if (showRank && submission.award) {
const rankMatch = submission.award.match(/(\d+)(st|nd|rd|th) [Pp]lace/);
if (rankMatch) {
rankBadge = `${rankMatch[1]}${rankMatch[2]} place`;
}
} else if (!showRank) {
rankBadge = `${submission.award}`;
}
// Build links
let linksHtml = '';
if (submission.submission_link) {
linksHtml += `
Watch demo
`;
}
if (submission.code_link) {
linksHtml += `
View Code
`;
}
linksHtml += '
Team Members
${submission.team_members}
Description
${submission.description}
${linksHtml}
`;
container.appendChild(card);
});
}
});
</script>