mirror of
https://github.com/Lapikud/tipilan.git
synced 2026-03-23 13:24:21 +00:00
Feature: All the game stuff are now correct
This commit is contained in:
Rene Arumetsa
@@ -7,6 +7,7 @@ import { useEffect, useRef, useState, useMemo } from "react";
|
||||
import { EyeClosed, Eye } from "lucide-react";
|
||||
import SectionDivider from "@/components/SectionDivider";
|
||||
import { useTranslations } from "next-intl";
|
||||
import gamedevData from "@/data/gamedev.json";
|
||||
|
||||
// Define interface for the ref with toggle function
|
||||
interface MountRefCurrent extends HTMLDivElement {
|
||||
@@ -1098,209 +1099,82 @@ export default function Expo() {
|
||||
</h2>
|
||||
|
||||
<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-6">
|
||||
{/* Row 1 - 4 items */}
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Lostbyte.png"
|
||||
alt="Broken Alliance"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
{gamedevData.games.map((game) => (
|
||||
<div key={game.id} className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src={game.logo}
|
||||
alt={game.name}
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold mb-1">
|
||||
{game.name}
|
||||
</h3>
|
||||
<p className="text-[#666] dark:text-[#AAA] text-center text-sm">
|
||||
{game.developer}
|
||||
</p>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Broken Alliance</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Eleball.png"
|
||||
alt="Eleball"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Eleball</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Placeholder Gameworks/craftcraft_simulator_logo.png"
|
||||
alt="CraftCraft Simulator"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">CraftCraft Simulator</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/HRA - CYBER DOC ROGUE/cyber_dog_rogue_logo.png"
|
||||
alt="Cyber Dog Rescue"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Cyber Dog Rescue</h3>
|
||||
</div>
|
||||
|
||||
{/* Row 2 - 4 items */}
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Placeholder Gameworks/death_and_taxes_logo.png"
|
||||
alt="Death and Taxes"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Death and Taxes</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Path of Pixels/deep_pixel_melancholy_logo.png"
|
||||
alt="Deep Pixel Melancholy"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Deep Pixel Melancholy</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Cyber_Doc_Rogue.png"
|
||||
alt="Delusional"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Delusional</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Eleball.png"
|
||||
alt="Eleball"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Eleball</h3>
|
||||
</div>
|
||||
|
||||
{/* Row 3 - 4 items */}
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Hardwired.png"
|
||||
alt="Hardwired"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Hardwired</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Hexwave.png"
|
||||
alt="HexWave"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">HexWave</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Immortal.png"
|
||||
alt="IMMORTAL: And the death that follows"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">IMMORTAL: And the death that follows</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Kalawindow.png"
|
||||
alt="Kalawindow"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Kalawindow</h3>
|
||||
</div>
|
||||
|
||||
{/* Row 4 - 4 items */}
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Korter1996.png"
|
||||
alt="Kortel 1996"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Kortel 1996</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Midnight_Souveneirs.png"
|
||||
alt="Midnight Souveneirs"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Midnight Souveneirs</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Nullis.png"
|
||||
alt="Nullis"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Nullis</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Planet_hoarders.png"
|
||||
alt="Planet Hoarders"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Planet Hoarders</h3>
|
||||
</div>
|
||||
|
||||
{/* Row 5 - 3 items (last row) */}
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Realm Hearts/realm_hearts.png"
|
||||
alt="Realm Hearts"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Realm Hearts</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/Seasons_of_Solitude.png"
|
||||
alt="Season of Solitude"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">Season of Solitude</h3>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src="/images/EXPO/GameDev logos/War_torn.png"
|
||||
alt="War-thorn"
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold">War-thorn</h3>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
|
||||
{/* ÜLIKOOLID Section */}
|
||||
<div className="flex flex-col m-6 md:m-16 mb-16">
|
||||
<h2
|
||||
className={`text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] dark:text-[#EEE5E5] mb-8 uppercase`}
|
||||
>
|
||||
Ülikoolid
|
||||
</h2>
|
||||
|
||||
{/* First 12 games in 3x4 grid */}
|
||||
<div className="grid grid-cols-3 md:grid-cols-4 gap-6 mb-6">
|
||||
{gamedevData.universities?.slice(0, 12).map((university) => (
|
||||
<div key={university.id} className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src={university.logo}
|
||||
alt={university.name}
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold mb-1">
|
||||
{university.name}
|
||||
</h3>
|
||||
<p className="text-[#666] dark:text-[#AAA] text-center text-sm">
|
||||
{university.university}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Remaining games in new grid */}
|
||||
{gamedevData.universities && gamedevData.universities.length > 12 && (
|
||||
<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-6">
|
||||
{gamedevData.universities.slice(12).map((university) => (
|
||||
<div key={university.id} className="flex flex-col">
|
||||
<div className="bg-[#1a1a2e] rounded-lg overflow-hidden aspect-square mb-2">
|
||||
<img
|
||||
src={university.logo}
|
||||
alt={university.name}
|
||||
className="w-full h-full object-contain p-4"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-[#2A2C3F] dark:text-[#EEE5E5] text-center font-semibold mb-1">
|
||||
{university.name}
|
||||
</h3>
|
||||
<p className="text-[#666] dark:text-[#AAA] text-center text-sm">
|
||||
{university.university}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
230
src/data/gamedev.json
Normal file
230
src/data/gamedev.json
Normal file
@@ -0,0 +1,230 @@
|
||||
{
|
||||
"games": [
|
||||
{
|
||||
"id": "broken-alliance",
|
||||
"name": "Broken Alliance",
|
||||
"logo": "/images/EXPO/GameDev logos/broken_alliance.png",
|
||||
"developer": "Placeholder Gameworks",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "buckshot-tournament",
|
||||
"name": "Buckshot Tournament",
|
||||
"logo": "/images/miniturniirid/buckshot_tournament.png",
|
||||
"developer": "Mike Klubnika",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "eleball",
|
||||
"name": "Eleball",
|
||||
"logo": "/images/EXPO/GameDev logos/Eleball.png",
|
||||
"developer": "Pulsar Twin",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "craftcraft-simulator",
|
||||
"name": "CraftCraft Simulator",
|
||||
"logo": "/images/EXPO/GameDev logos/craftcat_sim.png",
|
||||
"developer": "Placeholder Gameworks",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "cyber-dog-rescue",
|
||||
"name": "Cyber Dog Rescue",
|
||||
"logo": "/images/EXPO/GameDev logos/Cyber_Doc_Rogue.png",
|
||||
"developer": "HRA Interactive",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "death-and-taxes",
|
||||
"name": "Death and Taxes",
|
||||
"logo": "/images/EXPO/GameDev logos/death_and_taxes.png",
|
||||
"developer": "Placeholder Gameworks",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "deep-pixel-melancholy",
|
||||
"name": "Deep Pixel Melancholy",
|
||||
"logo": "/images/EXPO/GameDev logos/deep_pixel_melancholy.svg",
|
||||
"developer": "ok/no",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "delusional",
|
||||
"name": "Delusional",
|
||||
"logo": "/images/EXPO/GameDev logos/DELUSIONAL_logo.svg",
|
||||
"developer": "Cyber Doc Rogue",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "hardwired",
|
||||
"name": "Hardwired",
|
||||
"logo": "/images/EXPO/GameDev logos/Hardwired.png",
|
||||
"developer": "Hardwired Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "hexwave",
|
||||
"name": "HexWave",
|
||||
"logo": "/images/EXPO/GameDev logos/Hexwave.png",
|
||||
"developer": "HexWave Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "immortal",
|
||||
"name": "IMMORTAL: And the death that follows",
|
||||
"logo": "/images/EXPO/GameDev logos/Immortal.png",
|
||||
"developer": "IMMORTAL Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "kalawindow",
|
||||
"name": "Kalawindow",
|
||||
"logo": "/images/EXPO/GameDev logos/Kalawindow.png",
|
||||
"developer": "Kalawindow Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "kortel-1996",
|
||||
"name": "Kortel 1996",
|
||||
"logo": "/images/EXPO/GameDev logos/Korter1996.png",
|
||||
"developer": "Kortel Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "midnight-souveneirs",
|
||||
"name": "Midnight Souveneirs",
|
||||
"logo": "/images/EXPO/GameDev logos/Midnight_Souveneirs.png",
|
||||
"developer": "Midnight Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "nullis",
|
||||
"name": "Nullis",
|
||||
"logo": "/images/EXPO/GameDev logos/Nullis.png",
|
||||
"developer": "Nullis Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "planet-hoarders",
|
||||
"name": "Planet Hoarders",
|
||||
"logo": "/images/EXPO/GameDev logos/Planet_hoarders.png",
|
||||
"developer": "Planet Hoarders Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "realm-hearts",
|
||||
"name": "Realm Hearts",
|
||||
"logo": "/images/EXPO/GameDev logos/realm_hearts.png",
|
||||
"developer": "Dreamaster",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "season-of-solitude",
|
||||
"name": "Season of Solitude",
|
||||
"logo": "/images/EXPO/GameDev logos/Seasons_of_Solitude.png",
|
||||
"developer": "Solitude Studios",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "war-thorn",
|
||||
"name": "War-thorn",
|
||||
"logo": "/images/EXPO/GameDev logos/War_torn.png",
|
||||
"developer": "War-thorn Studios",
|
||||
"description": ""
|
||||
}
|
||||
],
|
||||
"universities": [
|
||||
{
|
||||
"id": "deltavr",
|
||||
"name": "DeltaVR",
|
||||
"logo": "/images/EXPO/ylikoolid/deltavr.png",
|
||||
"university": "Tallinna Tehnikaülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "a-bottles-journey",
|
||||
"name": "A Bottle's Journey",
|
||||
"logo": "/images/EXPO/ylikoolid/a_bottles_journey.png",
|
||||
"university": "Tallinna Tehnikaülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "magic-mineral",
|
||||
"name": "Magic Mineral",
|
||||
"logo": "/images/EXPO/ylikoolid/magic_mineral.png",
|
||||
"university": "Tallinna Tehnikaülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "tiksu-toksu",
|
||||
"name": "Tiksu-Toksu",
|
||||
"logo": "/images/EXPO/ylikoolid/tiksu-toksu.jpg",
|
||||
"university": "Tallinna Tehnikaülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "the-return",
|
||||
"name": "The Return",
|
||||
"logo": "/images/EXPO/ylikoolid/the_return.png",
|
||||
"university": "Tartu Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "blastronaut",
|
||||
"name": "Blastronaut",
|
||||
"logo": "/images/EXPO/ylikoolid/blastronaut.png",
|
||||
"university": "Tartu Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "oh-crap",
|
||||
"name": "Oh Crap!",
|
||||
"logo": "/images/EXPO/ylikoolid/oh_crap.png",
|
||||
"university": "Tartu Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "psyrreal",
|
||||
"name": "Psyrreal",
|
||||
"logo": "/images/EXPO/ylikoolid/psyrreal.png",
|
||||
"university": "Tartu Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "void-of-hermes",
|
||||
"name": "Void of Hermes",
|
||||
"logo": "/images/EXPO/ylikoolid/void_of_hermes.png",
|
||||
"university": "Tallinna Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "type-n-magic",
|
||||
"name": "Type 'n Magic",
|
||||
"logo": "/images/EXPO/ylikoolid/type_n_magic.png",
|
||||
"university": "Tallinna Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "packet-tracers",
|
||||
"name": "Packet Tracers",
|
||||
"logo": "/images/EXPO/ylikoolid/packet_tracers.png",
|
||||
"university": "Tallinna Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "dwarf-escape",
|
||||
"name": "Dwarf Escape",
|
||||
"logo": "/images/EXPO/ylikoolid/dwarf_escape.png",
|
||||
"university": "Tallinna Ülikool",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"id": "wildings",
|
||||
"name": "Wildings",
|
||||
"logo": "/images/EXPO/ylikoolid/wildings.png",
|
||||
"university": "Eesti Ettevõtluskõrgkool",
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
Reference in New Issue
Block a user