Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions app/controllers/homepage_controller.rb
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,7 @@ def index

def about
end

def prizes
end
end
248 changes: 248 additions & 0 deletions app/views/homepage/prizes.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,248 @@
<div class="mx-auto max-w-7xl px-4 py-8 sm:py-16">
<!-- Header Section -->
<div class="text-center mb-16">
<h1 class="text-4xl sm:text-5xl font-bold tracking-tight text-gray-900">
Prize Pool & Awards
</h1>
<p class="mt-6 text-xl text-gray-600 max-w-3xl mx-auto">
Total Prize Pool: <span class="font-bold text-primary-600">$10,000</span>
</p>
<p class="mt-4 text-lg text-gray-600 max-w-4xl mx-auto">
Our prize distribution rewards excellence across multiple dimensions while encouraging participation and innovation throughout the hackathon journey.
</p>
</div>

<!-- Overall Competition Prizes -->
<section class="mb-20">
<div class="bg-white rounded-2xl shadow-lg border border-primary-100/50 p-8 sm:p-12">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold text-gray-900">
Overall Competition Prizes
</h2>
</div>

<!-- Prize Steps -->
<div class="flex justify-center items-end space-x-8 mb-12">
<!-- 2nd Place -->
<div class="text-center flex-1 max-w-xs">
<div class="bg-gradient-to-t from-gray-300 to-gray-400 rounded-t-lg p-6 h-32 w-full flex flex-col justify-end items-center shadow-lg">
<div class="w-12 h-12 bg-gray-600 rounded-full flex items-center justify-center mb-2">
<span class="text-lg font-bold text-white">2nd</span>
</div>
</div>
<div class="bg-white rounded-b-lg p-4 shadow-lg border-t-0">
<h3 class="text-xl font-bold text-gray-900">$1,600</h3>
<p class="text-sm text-gray-600 mt-1">Second-best overall solution</p>
</div>
</div>

<!-- 1st Place (Tallest) -->
<div class="text-center flex-1 max-w-xs">
<!-- Trophy Emoji -->
<div class="text-4xl mb-2">🏆</div>
<div class="bg-gradient-to-t from-yellow-400 to-yellow-500 rounded-t-lg p-6 h-40 w-full flex flex-col justify-end items-center shadow-lg">
<div class="w-12 h-12 bg-yellow-600 rounded-full flex items-center justify-center mb-2">
<span class="text-lg font-bold text-white">1st</span>
</div>
</div>
<div class="bg-white rounded-b-lg p-4 shadow-lg border-t-0">
<h3 class="text-2xl font-bold text-gray-900">$2,600</h3>
<p class="text-sm text-gray-600 mt-1">Winner of the overall hackathon competition</p>
</div>
</div>

<!-- 3rd Place -->
<div class="text-center flex-1 max-w-xs">
<div class="bg-gradient-to-t from-orange-400 to-orange-500 rounded-t-lg p-6 h-24 w-full flex flex-col justify-end items-center shadow-lg">
<div class="w-12 h-12 bg-orange-600 rounded-full flex items-center justify-center mb-2">
<span class="text-lg font-bold text-white">3rd</span>
</div>
</div>
<div class="bg-white rounded-b-lg p-4 shadow-lg border-t-0">
<h3 class="text-xl font-bold text-gray-900">$1,100</h3>
<p class="text-sm text-gray-600 mt-1">Third-best overall solution</p>
</div>
</div>
</div>

<!-- Evaluation Criteria -->
<div class="mt-12 bg-gray-50 rounded-xl p-6">
<h4 class="text-xl font-bold text-gray-900 mb-6 text-center">Evaluation Criteria</h4>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-4">
<div class="text-center">
<div class="text-sm font-medium text-gray-900">Innovation</div>
<div class="text-xs text-gray-600 mt-1">Novelty & creativity</div>
</div>
<div class="text-center">
<div class="text-sm font-medium text-gray-900">Technical Excellence</div>
<div class="text-xs text-gray-600 mt-1">Code quality & architecture</div>
</div>
<div class="text-center">
<div class="text-sm font-medium text-gray-900">Impact Potential</div>
<div class="text-xs text-gray-600 mt-1">Problem solving & sustainability</div>
</div>
<div class="text-center">
<div class="text-sm font-medium text-gray-900">User Experience</div>
<div class="text-xs text-gray-600 mt-1">Interface & accessibility</div>
</div>
<div class="text-center">
<div class="text-sm font-medium text-gray-900">Presentation</div>
<div class="text-xs text-gray-600 mt-1">Communication & delivery</div>
</div>
</div>
</div>
</div>
</section>

<!-- Category Prizes -->
<section class="mb-20">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold text-gray-900">Category Prizes</h2>
</div>

<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
<!-- Best AI Implementation -->
<div class="bg-white rounded-xl shadow-md border border-gray-200 p-6">
<div class="text-center mb-6">
<div class="w-16 h-16 mx-auto mb-4 bg-blue-500 rounded-full flex items-center justify-center">
<span class="text-3xl">🤖</span>
</div>
<h3 class="text-xl font-bold text-gray-900">Best AI Implementation</h3>
<p class="text-2xl font-bold text-blue-600 mt-2">$1,000</p>
<p class="text-sm text-gray-600 mt-2">Most sophisticated and effective use of artificial intelligence</p>
</div>
</div>

<!-- Most Accessible Solution -->
<div class="bg-white rounded-xl shadow-md border border-gray-200 p-6">
<div class="text-center mb-6">
<div class="w-16 h-16 mx-auto mb-4 bg-green-500 rounded-full flex items-center justify-center">
<span class="text-3xl">♿</span>
</div>
<h3 class="text-xl font-bold text-gray-900">Most Accessible Solution</h3>
<p class="text-2xl font-bold text-green-600 mt-2">$1,000</p>
<p class="text-sm text-gray-600 mt-2">Best addresses accessibility constraints and inclusive design</p>
</div>
</div>

<!-- Best Cultural Integration -->
<div class="bg-white rounded-xl shadow-md border border-gray-200 p-6">
<div class="text-center mb-6">
<div class="w-16 h-16 mx-auto mb-4 bg-purple-500 rounded-full flex items-center justify-center">
<span class="text-3xl">🇬🇭</span>
</div>
<h3 class="text-xl font-bold text-gray-900">Best Cultural Integration</h3>
<p class="text-2xl font-bold text-purple-600 mt-2">$600</p>
<p class="text-sm text-gray-600 mt-2">Best incorporates Ghanaian cultural context and GSL authenticity</p>
</div>
</div>
</div>
</section>

<!-- People's Choice & Daily Bounties -->
<section class="mb-20">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
<!-- People's Choice -->
<div class="bg-white rounded-xl shadow-md border border-gray-200 p-8">
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 bg-pink-500 rounded-full flex items-center justify-center">
<svg class="w-10 h-10 text-white" fill="currentColor" viewBox="0 0 20 20">
<path d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z"/>
</svg>
</div>
<h3 class="text-2xl font-bold text-gray-900">People's Choice Award</h3>
<p class="text-3xl font-bold text-pink-600 mt-2">$700</p>
<p class="text-gray-600 mt-4">Selected by participant voting during final presentations</p>
</div>
</div>

<!-- Daily Bounties -->
<div class="bg-white rounded-xl shadow-md border border-gray-200 p-8">
<div class="text-center mb-6">
<div class="w-20 h-20 mx-auto mb-6 bg-orange-500 rounded-full flex items-center justify-center">
<svg class="w-10 h-10 text-white" fill="currentColor" viewBox="0 0 20 20">
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"/>
</svg>
</div>
<h3 class="text-2xl font-bold text-gray-900">Daily Bounties</h3>
<p class="text-3xl font-bold text-orange-600 mt-2">$1,500</p>
</div>

<div class="space-y-4 mt-6">
<div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
<span class="font-medium text-gray-900">Day 1 - Most Creative Approach</span>
<span class="font-bold text-orange-600">$400</span>
</div>
<div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
<span class="font-medium text-gray-900">Day 2 - Best Progress/Iteration</span>
<span class="font-bold text-orange-600">$500</span>
</div>
<div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
<span class="font-medium text-gray-900">Day 3 - Best Pitch Delivery</span>
<span class="font-bold text-orange-600">$500</span>
</div>
</div>
</div>
</div>
</section>

<!-- Prize Rules & Information -->
<section class="mb-20">
<div class="bg-gray-50 rounded-2xl p-8 sm:p-12">
<h2 class="text-3xl font-bold text-gray-900 mb-8 text-center">Prize Distribution Rules</h2>

<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 class="text-xl font-bold text-gray-900 mb-4">Eligibility & Restrictions</h3>
<ul class="space-y-2 text-gray-700">
<li class="flex items-start space-x-2">
<span class="text-primary-600 mt-1">"</span>
<span>Teams may win multiple category prizes but only one overall prize</span>
</li>
<li class="flex items-start space-x-2">
<span class="text-primary-600 mt-1">"</span>
<span>Daily bounties are independent and can be won alongside any other prizes</span>
</li>
<li class="flex items-start space-x-2">
<span class="text-primary-600 mt-1">"</span>
<span>All team members share prize money equally</span>
</li>
<li class="flex items-start space-x-2">
<span class="text-primary-600 mt-1">"</span>
<span>Winners must be present during award ceremony</span>
</li>
</ul>
</div>
</div>

<div class="mt-8 pt-8 border-t border-gray-200">
<h3 class="text-xl font-bold text-gray-900 mb-4 text-center">Award Timeline</h3>
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 text-center">
<div class="p-4 bg-white rounded-lg">
<div class="text-primary-600 font-bold">Daily</div>
<div class="text-sm text-gray-600">Bounties announced each evening</div>
</div>
<div class="p-4 bg-white rounded-lg">
<div class="text-primary-600 font-bold">Final Day</div>
<div class="text-sm text-gray-600">Category and overall winners announced</div>
</div>
<div class="p-4 bg-white rounded-lg">
<div class="text-primary-600 font-bold">30 Days</div>
<div class="text-sm text-gray-600">Prize distribution post-hackathon</div>
</div>
</div>
</div>
</div>
</section>

<!-- Call to Action -->
<div class="text-center">
<h2 class="text-3xl font-bold text-gray-900 mb-6">Ready to Compete?</h2>
<p class="text-lg text-gray-600 mb-8 max-w-2xl mx-auto">
Join us for 36 hours of innovation and compete for your share of the $10,000 prize pool while building solutions that can transform education and empower voices.
</p>
<%= link_to "Register Your Team",
rodauth(:hacker).create_account_path,
class: "inline-flex items-center rounded-xl bg-gradient-to-r from-primary-600 to-primary-500 px-8 py-4 text-lg font-semibold text-white shadow-md transition-all duration-300 ease-out hover:translate-y-[-2px] hover:shadow-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2" %>
</div>
</div>
9 changes: 9 additions & 0 deletions app/views/layouts/application.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -295,6 +295,15 @@
>
Contact
</a>
<a
href="<%= prizes_path %>"
class="
-mx-3 block rounded-lg px-3 py-2 text-base font-semibold text-gray-900
hover:bg-gray-50
"
>
Prizes
</a>
<a
href="<%= rodauth(:hacker).create_account_path %>"
class="
Expand Down
1 change: 1 addition & 0 deletions config/routes.rb
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@

get "/about", to: "homepage#about"
get "/contact", to: "homepage#contact"
get "/prizes", to: "homepage#prizes"

get "/invitations/confirm/:token", to: "invitations#confirm", as: :confirm_invitation
post "/invitations/confirm/:token/decline", to: "invitations#decline", as: :decline_invitation
Expand Down