lapikud/tipilan
3
0
Fork 0
mirror of https://github.com/Lapikud/tipilan.git synced 2026-09-22 15:22:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add real fuajee & tudengimaja venue maps to expo page

Browse Source 
Replaces the MapCard gradient placeholder with the actual venue map
SVGs (public/images/messiala/), rendered object-contain on a transparent
card so it matches the page background. Served unoptimized since
next/image's optimizer rejects SVG.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01CkjnUxMqkPReq6zYVR6LHX
This commit is contained in:
Rene Arumetsa
2026-09-08 12:38:40 +03:00
parent afc7736732
commit 35bbc71ac6
3 changed files with 105 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
public/images/messiala/fuajee-kaart.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 309 KiB

40
public/images/messiala/tudengimaja-kaart.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 235 KiB

31
src/app/[locale]/messiala/page.tsx
View File

@@ -9,15 +9,20 @@ const DIVIDER = "border-t-4 border-[rgba(0,163,224,0.5)]";
/** Horizontal padding used by the padded sections (64px at the design width). */ /** Horizontal padding used by the padded sections (64px at the design width). */
const GUTTER = "px-4 sm:px-8 lg:px-16"; const GUTTER = "px-4 sm:px-8 lg:px-16";
/** Blue gradient placeholder standing in for a venue map (real images TBD). */ /** Venue map card: the map SVG rendered transparent over the page background. */
function MapCard({ label }: { label: string }) { function MapCard({ image, label }: { image: string; label: string }) {
return ( return (
<div className="relative flex items-center justify-center aspect-[4/3] bg-[linear-gradient(113deg,#00A3E0_0%,#1F5673_100%)]"> <div className="relative aspect-[4/3] overflow-hidden">
<h2 <Image
className={`${vipnagorgialla.className} font-bold italic uppercase text-center text-white leading-none tracking-tight px-6 text-[clamp(1.75rem,1rem+4vw,4rem)]`} src={image}
> alt={label}
{label} fill
</h2> className="object-contain p-4 md:p-6"
sizes="(max-width: 768px) 100vw, 50vw"
// next/image's optimizer rejects SVG (400) unless dangerouslyAllowSVG
// is enabled globally; serve the map SVG as-is instead.
unoptimized
/>
</div> </div>
); );
} }
@@ -168,8 +173,14 @@ export default async function Expo({
{/* Venue maps */} {/* Venue maps */}
<div className={`${GUTTER} pb-12 md:pb-16`}> <div className={`${GUTTER} pb-12 md:pb-16`}>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-8"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-8">
<MapCard label={t("expo.mapFoyer")} /> <MapCard
<MapCard label={t("expo.mapStudentHouse")} /> image="/images/messiala/fuajee-kaart.svg"
label={t("expo.mapFoyer")}
/>
<MapCard
image="/images/messiala/tudengimaja-kaart.svg"
label={t("expo.mapStudentHouse")}
/>
</div> </div>
</div> </div>