Compare commits
18 Commits
9e93f904d7
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
53179e2707
|
|||
|
34306d3c46
|
|||
|
a4712dfc02
|
|||
|
a2e9f5ef6f
|
|||
|
42a8e1a737
|
|||
|
ac961ff420
|
|||
|
9fc6dd1a4c
|
|||
|
ec5061168b
|
|||
|
9bfdfcbae6
|
|||
|
e391330a7f
|
|||
|
6ec87647cf
|
|||
|
45b852752c
|
|||
|
f8b8a7466c
|
|||
|
119a48d115
|
|||
|
53313c1c8d
|
|||
|
d8caa7d241
|
|||
| fa33134ea0 | |||
|
782447bb12
|
@ -1,13 +1,11 @@
|
||||
// @ts-check
|
||||
import { defineConfig } from 'astro/config';
|
||||
import { defineConfig } from "astro/config";
|
||||
import tailwindcss from "@tailwindcss/vite";
|
||||
|
||||
|
||||
import react from "@astrojs/react";
|
||||
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
vite: { plugins: [tailwindcss()], },
|
||||
vite: { plugins: [tailwindcss()] },
|
||||
integrations: [react()],
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "solar-star",
|
||||
"name": "studio-2025",
|
||||
"type": "module",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
|
||||
<path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" />
|
||||
<style>
|
||||
path { fill: #000; }
|
||||
@media (prefers-color-scheme: dark) {
|
||||
path { fill: #FFF; }
|
||||
}
|
||||
</style>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 749 B |
BIN
public/logo.png
Normal file
BIN
public/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 528 KiB |
BIN
src/assets/studioBenker.png
Normal file
BIN
src/assets/studioBenker.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 554 KiB |
@ -1,18 +1,19 @@
|
||||
---
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
import { Image } from 'astro:assets';
|
||||
import benker from '@assets/studioBenker.png';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].about;
|
||||
---
|
||||
|
||||
<main class="flex gap-8 flex-col">
|
||||
<h1 class="text-4xl font-bold">Om STUDiO 2025</h1>
|
||||
<div class="flex gap-2 text-lg max-w-prose flex-col">
|
||||
<p>
|
||||
STUDiO 2025 er en studentfestival som arrangeres under fadderuka i Oslo fra 11. til 15. august på Chateau Neuf.
|
||||
</p>
|
||||
<p>
|
||||
Det blir sosiale og spennende arrangementer hver dag! Festivalen er for alle nye og gamle studenter i Oslo. Opplev høydepunktet i semesteret - ta med fadderbarna eller vennegjengen, eller kom alene og møt nye venner.
|
||||
</p>
|
||||
<p>
|
||||
Ikke gå glipp av den største studiekickoffen i Oslo!
|
||||
</p>
|
||||
<p>
|
||||
Flere av arrangementene våre er gratis, og alt er ID 18+.
|
||||
</p>
|
||||
<main class="flex gap-8 flex-col max-w-prose">
|
||||
<h1 class="text-4xl font-bold">{t.title}</h1>
|
||||
<div class="flex gap-2 text-lg flex-col">
|
||||
<p>{t.p1}</p>
|
||||
<p>{t.p2}</p>
|
||||
<p>{t.p3}</p>
|
||||
<p>{t.p4}</p>
|
||||
<Image src={benker} alt="Studio Benker" class="place-self-center w-full" width={600} height={400} loading="eager" />
|
||||
<p set:html={t.p5}></p>
|
||||
</div>
|
||||
</main>
|
||||
@ -1,25 +1,31 @@
|
||||
<section class="flex flex-col gap-4">
|
||||
<h2 class="text-xl font-bold">Ofte stilte spørsmål</h2>
|
||||
<ul class="flex flex-col gap-2">
|
||||
---
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].faq;
|
||||
---
|
||||
|
||||
<section class="flex flex-col gap-6 max-w-prose">
|
||||
<h2 class="text-2xl font-bold">{t.title}</h2>
|
||||
<ul class="flex flex-col gap-4">
|
||||
<li>
|
||||
<strong>Hvor arrangeres festivalen? </strong>
|
||||
<p>På <a href="https://neuf.no/praktisk#adkomst">Chateau Neuf</a>, Majorstuen, Oslo</p>
|
||||
<strong>{t.q1}</strong>
|
||||
<p set:html={t.a1}></p>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Hvem er festivalen for?</strong>
|
||||
<p>Alle nye og gamle studenter, men arrangementene er åpne for alle som ønsker å delta.</p>
|
||||
<strong>{t.q2}</strong>
|
||||
<p>{t.a2}</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Koster det penger å delta?</strong>
|
||||
<p>Gratis inngang hver dag og nesten alle arrangementene er gratis. Kun 2 arrangementer krever kjøp av billett.</p>
|
||||
<strong>{t.q3}</strong>
|
||||
<p>{t.a3}</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Må jeg har med student ID for å komme inn?</strong>
|
||||
<p>Nei, men generell legitimasjon er påkrevd.</p>
|
||||
<strong>{t.q4}</strong>
|
||||
<p>{t.a4}</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Hva er alder årsgrensen på festivalen?</strong>
|
||||
<p>Alt er ID18+</p>
|
||||
<strong>{t.q5}</strong>
|
||||
<p>{t.a5}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
@ -2,29 +2,20 @@
|
||||
import { Image } from 'astro:assets';
|
||||
import logo from '@assets/logo.png';
|
||||
import DNS from '@assets/DNS-logo-hvit.png';
|
||||
import { FaFacebook, FaInstagram, FaTiktok } from 'react-icons/fa';
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
import Links from '@components/Links.astro';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].footer;
|
||||
---
|
||||
<footer class="flex items-center justify-between bg-red-900 text-white py-16 px-8 mt-20">
|
||||
<div class="flex gap-2 items-center justify-center">
|
||||
<Image src={logo} alt="Logo for Studentfestivalen i Oslo" class="hero-logo" width={48} height={48}/>
|
||||
<p>Studentfestivalen i Oslo 2025</p>
|
||||
|
||||
<footer class="flex items-center lg:justify-between justify-center bg-accent text-white py-16 px-18 mt-20">
|
||||
<div class="gap-4 items-center justify-center hidden lg:flex">
|
||||
<Image src={logo} alt={t.org} class="hero-logo" width={64} height={64} loading="lazy" />
|
||||
<p class="text-white text-2xl">{t.org}</p>
|
||||
</div>
|
||||
<div class="flex gap-2 items-center justify-center">
|
||||
<Image src ={DNS} alt="Logo for Det Norske Studentersamfund" class="hero-logo" width={169} height={169}/>
|
||||
<div class="flex flex-col items-center justify-center gap-2">
|
||||
<address>Slemdalsveien 15, 0369 Oslo</address>
|
||||
<div>
|
||||
<div class="flex gap-4">
|
||||
<a href="https://www.facebook.com/events/692300293586085" target="_blank" rel="noopener noreferrer" aria-label="Facebook">
|
||||
<FaFacebook class="text-white text-2xl hover:text-gray-300" />
|
||||
</a>
|
||||
<a href="https://www.instagram.com/studentfestivalenioslo/" target="_blank" rel="noopener noreferrer" aria-label="Instagram">
|
||||
<FaInstagram class="text-white text-2xl hover:text-gray-300" />
|
||||
</a>
|
||||
<a href="https://www.tiktok.com/@studentersamfund" target="_blank" rel="noopener noreferrer" aria-label="TikTok">
|
||||
<FaTiktok class="text-white text-2xl hover:text-gray-300" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex gap-6 items-center justify-center flex-col text-center">
|
||||
<Image src={DNS} alt={t.dnsAlt} class="hero-logo" width={200} height={200} loading="lazy" />
|
||||
<address>{t.address}</address>
|
||||
<Links lang={lang} class="text-3xl" />
|
||||
</div>
|
||||
</footer>
|
||||
@ -1,9 +1,12 @@
|
||||
---
|
||||
import logo from '@assets/logo.png';
|
||||
import { Image } from 'astro:assets';
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].hero;
|
||||
---
|
||||
|
||||
<section class="flex flex-col items-center justify-center h-[75vh] gap-4">
|
||||
<h1 class="text-4xl">Studentfestivalen i Oslo 2025</h1>
|
||||
<Image src={logo} alt="Studentfestivalen i Oslo Logo" width={250} height={250}/>
|
||||
<section class="flex flex-col items-center justify-center h-[50vh] gap-4">
|
||||
<h1 class="text-4xl font-extrabold text-center">{t.title}</h1>
|
||||
<Image src={logo} alt={t.alt} width={250} height={250} loading="eager" />
|
||||
</section>
|
||||
@ -1,15 +1,17 @@
|
||||
---
|
||||
const links = [
|
||||
{ href: "https://www.neuf.no", text: "Chateau Neuf" },
|
||||
{ href: "https://forms.gle/PvEh37nvRyicLFXn6", text: "Bli frivillig!" },
|
||||
{ href: "https://www.instagram.com/studentfestivalenioslo/", text: "Instagram" },
|
||||
{ href: "https://www.facebook.com/studentfestivalen", text: "Facebook" },
|
||||
{ href: "https://www.tiktok.com/@studentersamfund", text: "TikTok" },
|
||||
];
|
||||
import { FaFacebook, FaInstagram, FaTiktok } from 'react-icons/fa';
|
||||
const { href, class: className, ...props } = Astro.props;
|
||||
|
||||
---
|
||||
|
||||
<div class="flex gap-4 justify-center items-center">
|
||||
{links.map(link => (
|
||||
<a href={link.href} target="_blank" rel="noopener noreferrer">{link.text}</a>
|
||||
))}
|
||||
<div class:list={["flex gap-6 justify-center items-center", className]} {...props}>
|
||||
<a href="https://www.facebook.com/events/692300293586085" target="_blank" rel="noopener noreferrer" aria-label="Facebook">
|
||||
<FaFacebook className=`${className} hover:text-slottsblaa` />
|
||||
</a>
|
||||
<a href="https://www.instagram.com/studentfestivalenioslo/" target="_blank" rel="noopener noreferrer" aria-label="Instagram" class="hover:text-griserosa">
|
||||
<FaInstagram className=`${className} hover:text-slottsblaa` />
|
||||
</a>
|
||||
<a href="https://www.tiktok.com/@studentersamfund" target="_blank" rel="noopener noreferrer" aria-label="TikTok" class="hover:text-dyp-tegl">
|
||||
<FaTiktok className=`${className} hover:text-slottsblaa` />
|
||||
</a>
|
||||
</div>
|
||||
@ -1,47 +1,33 @@
|
||||
<nav class="flex justify-between items-center px-10 py-4 bg-accent mb-4">
|
||||
<h1 class="text-xl font-bold text-white">
|
||||
<a href="/">STUDiO 2025</a>
|
||||
---
|
||||
import NavLink from '@components/NavLink.astro';
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].nav;
|
||||
const { pathname } = Astro.url;
|
||||
|
||||
function getLangSwitchPath(path: string, lang: string) {
|
||||
if (lang === 'no') {
|
||||
if (path === '/') return '/en/';
|
||||
if (path.startsWith('/en/')) return path.replace('/en/', '/');
|
||||
return '/en' + path;
|
||||
} else {
|
||||
if (path === '/en/' || path === '/en') return '/';
|
||||
if (path.startsWith('/en/')) return path.replace('/en', '');
|
||||
return path;
|
||||
}
|
||||
}
|
||||
|
||||
const langSwitchPath = getLangSwitchPath(pathname, lang);
|
||||
---
|
||||
<nav class="flex justify-center lg:justify-between items-center px-10 py-6 bg-accent mb-4 whitespace-nowrap">
|
||||
<h1 class="text-xl font-bold text-white hover:no-underline hidden lg:block">
|
||||
<a href={lang === 'en' ? '/en/' : '/'} class="hover:no-underline">{t.title}</a>
|
||||
</h1>
|
||||
<ul class="flex space-x-4 text-white">
|
||||
<li><a href="/">Hjem</a></li>
|
||||
<li><a href="/program">Program</a></li>
|
||||
<li><a href="https://forms.gle/PvEh37nvRyicLFXn6" target="_blank">Bli frivillig</a></li>
|
||||
<li><a href="/about">Om</a></li>
|
||||
<li>
|
||||
<button onclick={() => toggleLanguage()} class="ml-4 bg-blue-500 text-white px-3 py-1 rounded">
|
||||
Norsk / English
|
||||
</button>
|
||||
</li>
|
||||
|
||||
<script>
|
||||
let currentLanguage = 'no';
|
||||
|
||||
function toggleLanguage() {
|
||||
currentLanguage = currentLanguage === 'no' ? 'en' : 'no';
|
||||
const links = document.querySelectorAll('nav ul li a');
|
||||
links.forEach(link => {
|
||||
const href = link.getAttribute('href');
|
||||
if (currentLanguage === 'en') {
|
||||
link.setAttribute('href', `/en-${href.slice(1)}`);
|
||||
} else {
|
||||
link.setAttribute('href', `/${href.replace('/en-', '')}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<ul class="flex space-x-6 text-betongraa">
|
||||
<NavLink href={lang === 'en' ? '/en/' : '/'}>{t.home}</NavLink>
|
||||
<NavLink href={lang === 'en' ? '/en/program' : '/program'}>{t.program}</NavLink>
|
||||
<NavLink href="https://forms.gle/PvEh37nvRyicLFXn6" target="_blank">{t.volunteer}</NavLink>
|
||||
<NavLink href={lang === 'en' ? '/en/about' : '/about'}>{t.about}</NavLink>
|
||||
<NavLink href={langSwitchPath} noActive class="bg-gyllen-beige text-svart px-3 py-1 rounded hover:bg-slottsblaa font-bold">{t.langSwitch}</NavLink>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<style>
|
||||
nav a {
|
||||
padding: 0.5em 0.5em;
|
||||
color: var(--text);
|
||||
border-bottom: 4px solid transparent;
|
||||
text-decoration: none;
|
||||
}
|
||||
nav a.active {
|
||||
text-decoration: none;
|
||||
border-bottom-color: var(--accent);
|
||||
}
|
||||
</style>
|
||||
</nav>
|
||||
18
src/components/NavLink.astro
Normal file
18
src/components/NavLink.astro
Normal file
@ -0,0 +1,18 @@
|
||||
---
|
||||
const { href, class: className, noActive = false, ...props } = Astro.props;
|
||||
const pathname = Astro.url.pathname.replace(import.meta.env.BASE_URL, "");
|
||||
const subpath = pathname.match(/[^\/]+/g);
|
||||
|
||||
const normalize = (str: string) => str.replace(/^\/+/, "");
|
||||
const isActive = !noActive && (
|
||||
normalize(href) === normalize(pathname) ||
|
||||
normalize(href) === `en/${normalize(pathname)}` ||
|
||||
normalize(href) === (subpath?.[0] || "") ||
|
||||
(normalize(href) === "en" && normalize(pathname) === "en") ||
|
||||
(normalize(href) === "" && normalize(pathname) === "")
|
||||
);
|
||||
---
|
||||
|
||||
<a href={href} class:list={["hover:text-white border-b-4 border-b-transparent hover:border-b-slottsblaa no-underline p-2 flex items-center text-center", className, { active: isActive }]} {...props}>
|
||||
<slot />
|
||||
</a>
|
||||
@ -1,65 +1,67 @@
|
||||
---
|
||||
const currentDate = new Date().toLocaleDateString("nb-NO", {
|
||||
weekday: 'long',
|
||||
year: 'numeric',
|
||||
month: 'long',
|
||||
day: 'numeric'
|
||||
});
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
const { lang = 'no', data } = Astro.props as { lang?: Lang, data: any };
|
||||
const t = translations[lang].program;
|
||||
|
||||
const events = [
|
||||
{
|
||||
id: "9882",
|
||||
slug: "magic-the-gathering-monday",
|
||||
title: "Magic: The Gathering Monday",
|
||||
subtitle: "",
|
||||
nextOccurrence: {
|
||||
id: "9326",
|
||||
start: "2025-06-16 15:00:00+00:00",
|
||||
end: null,
|
||||
venue: {
|
||||
id: "52",
|
||||
slug: "galleriet",
|
||||
title: "Galleriet",
|
||||
preposition: "i",
|
||||
url: "/lokaler/galleriet/",
|
||||
},
|
||||
venueCustom: "",
|
||||
},
|
||||
url: "https://neuf.no/arrangementer/magic-the-gathering-monday",
|
||||
futureOccurrencesCount: 2,
|
||||
},
|
||||
// ...other events
|
||||
];
|
||||
type ProgramItem = {
|
||||
time: string;
|
||||
event: string;
|
||||
price?: string | null;
|
||||
cost?: string | null;
|
||||
url?: string;
|
||||
};
|
||||
|
||||
function formatDate(dateString) {
|
||||
const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' };
|
||||
return new Date(dateString).toLocaleDateString('no-NO', options);
|
||||
}
|
||||
|
||||
// Filter events for Monday
|
||||
const mondayEvents = events.filter(event => {
|
||||
const eventDate = new Date(event.nextOccurrence.start);
|
||||
return eventDate.getDay() === 1; // Monday is represented by 1
|
||||
});
|
||||
const convertDate = (date: string | Date) => {
|
||||
let d = date;
|
||||
if (!(d instanceof Date)) {
|
||||
d = new Date(d);
|
||||
}
|
||||
return d.toLocaleDateString(lang === 'en' ? 'en-GB' : 'nb-NO', {
|
||||
weekday: 'long',
|
||||
month: 'long',
|
||||
day: 'numeric'
|
||||
});
|
||||
};
|
||||
---
|
||||
|
||||
<div class="flex gap-4 flex-col">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="font-bold text-xl">Hva skjer i dag?</h2>
|
||||
<p>{currentDate}</p>
|
||||
{data ? (
|
||||
<div class="flex items-center justify-between flex-col gap-8">
|
||||
<h1 class="font-bold text-3xl text-center w-full">{t.today}</h1>
|
||||
<p class="font-bold text-2xl text-center w-full">{convertDate(new Date())}</p>
|
||||
</div>
|
||||
<ul>
|
||||
{events.map(event => (
|
||||
<li key={event.id}>
|
||||
<a href={event.url}>
|
||||
<h2>{event.title}</h2>
|
||||
{event.subtitle && <p>{event.subtitle}</p>}
|
||||
<p>
|
||||
{event.nextOccurrence.start && formatDate(event.nextOccurrence.start)}{" "}
|
||||
{event.nextOccurrence.venueCustom || `${event.nextOccurrence.venue.preposition} ${event.nextOccurrence.venue.title}`}
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<div class="flex gap-12 flex-wrap justify-center items-stretch">
|
||||
{Object.entries(data).map(([date, items]) => (
|
||||
<div id="program-list" class="w-125 p-6 border-1 border-white rounded-2xl even:bg-slottsblaa even:text-white bg-gyllen-beige flex flex-col gap-2">
|
||||
<h2 class="font-bold text-xl">{convertDate(date)}</h2>
|
||||
<ul>
|
||||
{(items as ProgramItem[]).map((item) => {
|
||||
const price = item.price || item.cost;
|
||||
return (
|
||||
<li class="flex justify-between">
|
||||
<p>
|
||||
{item.time} - {item.event}
|
||||
</p>
|
||||
{item.url ? (
|
||||
<a href={item.url} target="_blank" rel="noopener noreferrer" class="text-right">{price}</a>
|
||||
) : (
|
||||
price
|
||||
)}
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
<p class="font-bold text-xl text-center w-full">
|
||||
<a href="https://neuf.no/arrangementer" class="text-gyllen-oransje hover:text-slottsblaa hover:underline" target="_blank" rel="noopener noreferrer">{t.programMore}</a>
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div>No program data available.</div>
|
||||
)}
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@ -1,6 +0,0 @@
|
||||
---
|
||||
const currentDate = new Date().toLocaleDateString();
|
||||
---
|
||||
<div>
|
||||
<p> {currentDate}</p>
|
||||
</div>
|
||||
@ -1,18 +1,22 @@
|
||||
---
|
||||
import { translations, type Lang } from '@data/i18n';
|
||||
const { lang = 'no' } = Astro.props as { lang?: Lang };
|
||||
const t = translations[lang].vors;
|
||||
|
||||
const videoUrl = "https://www.youtube.com/watch?v=t7T4RPBpTVY";
|
||||
---
|
||||
|
||||
<div style="width: 560px; height: 315px;">
|
||||
<div class="mt-4 text-xl mb-2">
|
||||
|
||||
Sett på låta for litt stemning før dere kommer🔥
|
||||
</div>
|
||||
<div class="self-center flex flex-col items-center p-4 gap-4">
|
||||
<p>
|
||||
{t.text}
|
||||
</p>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
loading="lazy"
|
||||
class="max-w-full"
|
||||
width="640"
|
||||
height="480"
|
||||
src={videoUrl.replace("watch?v=", "embed/")}
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen>
|
||||
</iframe>
|
||||
|
||||
@ -1,30 +1,40 @@
|
||||
{
|
||||
"Monday 11th": [
|
||||
{ "time": "18:00", "event": "Opening party with DJ", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Sing-a-long karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"Tuesday 12th": [
|
||||
{ "time": "18:00", "event": "Barbecue", "cost": "free" },
|
||||
{ "time": "19:00", "event": "Qualified Guessing Quiz", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Live Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"Wednesday 13th": [
|
||||
{ "time": "18:00", "event": "KKK: Comic Comedian Evening", "cost": "tickets out!" },
|
||||
{ "time": "18:00", "event": "Hits for Quiz", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"Thursday 14th": [
|
||||
{ "time": "18:00", "event": "Drunk Impro 4K, VRØVL", "cost": "tickets out!" },
|
||||
{ "time": "19:00", "event": "Shrek 2 Screening", "cost": "free" },
|
||||
{ "time": "20:00", "event": "Live Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"Friday 15th": [
|
||||
{ "time": "21:00", "event": "Sing-a-long karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Afterparty", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
]
|
||||
"2025-08-11": [
|
||||
{ "time": "18:00", "event": "Opening party with DJ", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Sing-a-long karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"2025-08-12": [
|
||||
{ "time": "18:00", "event": "Barbecue", "cost": "free" },
|
||||
{ "time": "19:00", "event": "Qualified Guessing Quiz", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Live Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"2025-08-13": [
|
||||
{
|
||||
"time": "18:00",
|
||||
"event": "KKK: Comic Comedian Evening",
|
||||
"cost": "tickets out!",
|
||||
"url": "https://www.ticketmaster.no/event/studio-komisk-komedie-kveld-billetter/920472981"
|
||||
},
|
||||
{ "time": "18:00", "event": "Hits for Quiz", "cost": "free" },
|
||||
{ "time": "21:00", "event": "Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"2025-08-14": [
|
||||
{
|
||||
"time": "18:00",
|
||||
"event": "Drunk Impro 4K, VRØVL",
|
||||
"cost": "tickets out!",
|
||||
"url": "https://www.ticketmaster.no/event/studio-drunk-impro-i-storsalen-med-4k-billetter/912660512"
|
||||
},
|
||||
{ "time": "19:00", "event": "Shrek 2 Screening", "cost": "free" },
|
||||
{ "time": "20:00", "event": "Live Karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
],
|
||||
"2025-08-15": [
|
||||
{ "time": "21:00", "event": "Sing-a-long karaoke", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Afterparty", "cost": "free" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "cost": "free" }
|
||||
]
|
||||
}
|
||||
|
||||
98
src/data/i18n.ts
Normal file
98
src/data/i18n.ts
Normal file
@ -0,0 +1,98 @@
|
||||
export const translations = {
|
||||
no: {
|
||||
nav: {
|
||||
home: "Hjem",
|
||||
program: "Program",
|
||||
volunteer: "Bli frivillig",
|
||||
about: "Om",
|
||||
langSwitch: "English",
|
||||
title: "STUDiO 2025",
|
||||
},
|
||||
hero: {
|
||||
title: "Studentfestivalen i Oslo 2025",
|
||||
alt: "Studentfestivalen i Oslo Logo",
|
||||
},
|
||||
faq: {
|
||||
title: "Ofte stilte spørsmål",
|
||||
q1: "Hvor arrangeres festivalen?",
|
||||
a1: 'På <a href="https://neuf.no/praktisk#adkomst">Chateau Neuf</a>, Majorstuen, Oslo',
|
||||
q2: "Hvem er festivalen for?",
|
||||
a2: "Alle nye og gamle studenter, men arrangementene er åpne for alle som ønsker å delta.",
|
||||
q3: "Koster det penger å delta?",
|
||||
a3: "Gratis inngang hver dag og nesten alle arrangementene er gratis. Kun 2 arrangementer krever kjøp av billett.",
|
||||
q4: "Må jeg har med student ID for å komme inn?",
|
||||
a4: "Nei, men generell legitimasjon er påkrevd.",
|
||||
q5: "Hva er alder årsgrensen på festivalen?",
|
||||
a5: "Alt er ID18+",
|
||||
},
|
||||
about: {
|
||||
title: "Om STUDiO 2025",
|
||||
p1: "STUDiO 2025 er en studentfestival som arrangeres under fadderuka i Oslo fra 11. til 15. august på Chateau Neuf.",
|
||||
p2: "Det blir sosiale og spennende arrangementer hver dag! Festivalen er for alle nye og gamle studenter i Oslo. Opplev høydepunktet i semesteret - ta med fadderbarna eller vennegjengen, eller kom alene og møt nye venner.",
|
||||
p3: "Ikke gå glipp av den største studiekickoffen i Oslo!",
|
||||
p4: "Flere av arrangementene våre er gratis, og alt er ID 18+.",
|
||||
p5: 'Dersom du ønsker å lære mer om historien til Studio, samt Det Norske Studentersamfund kan du leser mer på <a href="https://viteboka.studentersamfundet.no/Studentfestivalen_i_Oslo">Viteboka</a>',
|
||||
},
|
||||
program: {
|
||||
today: "Hva skjer i dag?",
|
||||
programMore: "For arrangementer etter Studio trykk her",
|
||||
},
|
||||
vors: {
|
||||
text: "Sett på låta for litt stemning før dere kommer 🔥",
|
||||
},
|
||||
footer: {
|
||||
address: "Slemdalsveien 15, 0369 Oslo",
|
||||
org: "Studentfestivalen i Oslo 2025",
|
||||
dnsAlt: "Logo for Det Norske Studentersamfund",
|
||||
},
|
||||
},
|
||||
en: {
|
||||
nav: {
|
||||
home: "Home",
|
||||
program: "Program",
|
||||
volunteer: "Volunteer",
|
||||
about: "About",
|
||||
langSwitch: "Norsk",
|
||||
title: "STUDiO 2025",
|
||||
},
|
||||
hero: {
|
||||
title: "The Student Festival in Oslo 2025",
|
||||
alt: "The Student Festival in Oslo Logo",
|
||||
},
|
||||
faq: {
|
||||
title: "Frequently Asked Questions",
|
||||
q1: "Where is the festival being held?",
|
||||
a1: 'At <a href="https://neuf.no/praktisk#adkomst">Chateau Neuf</a>, Majorstuen, Oslo',
|
||||
q2: "Who is the festival for?",
|
||||
a2: "All new and returning students, but the events are open to everyone who wants to join.",
|
||||
q3: "Does it cost money?",
|
||||
a3: "Free entry every day and almost all events are free. Only 2 events require a ticket.",
|
||||
q4: "Do I need a student ID to enter?",
|
||||
a4: "No, but general identification is required.",
|
||||
q5: "What is the age limit for the festival?",
|
||||
a5: "Everything is 18+",
|
||||
},
|
||||
about: {
|
||||
title: "About STUDiO 2025",
|
||||
p1: "STUDiO 2025 is a student festival held during the buddy week in Oslo from August 11th to 15th at Chateau Neuf.",
|
||||
p2: "There will be social and exciting events every day! The festival is for all new and returning students in Oslo. Experience the highlight of the semester - bring your buddy group or friends, or come alone and meet new people.",
|
||||
p3: "Don't miss the biggest student kickoff in Oslo!",
|
||||
p4: "Many of our events are free, and everything is 18+.",
|
||||
p5: 'If you want to learn more about the history of Studio, as well as The Norwegian Student Society, you can read more on <a href="https://viteboka.studentersamfundet.no/Studentfestivalen_i_Oslo">Viteboka</a>',
|
||||
},
|
||||
program: {
|
||||
today: "What's happening today?",
|
||||
programMore: "For events after Studio click here",
|
||||
},
|
||||
vors: {
|
||||
text: "Play the song to get in the mood before you arrive 🔥",
|
||||
},
|
||||
footer: {
|
||||
address: "Slemdalsveien 15, 0369 Oslo",
|
||||
org: "Student Festival in Oslo 2025",
|
||||
dnsAlt: "Logo for the Norwegian Student Society",
|
||||
},
|
||||
},
|
||||
} as const;
|
||||
|
||||
export type Lang = keyof typeof translations;
|
||||
@ -1,10 +1,10 @@
|
||||
{
|
||||
"Mandag 11. august": [
|
||||
{ "time": "18:00", "event": "Aapningsfest med DJ", "price": "gratis" },
|
||||
"2025-08-11": [
|
||||
{ "time": "18:00", "event": "Åpningsfest med DJ", "price": "gratis" },
|
||||
{ "time": "21:00", "event": "Allsangkaraoke", "price": "gratis" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "price": "gratis" }
|
||||
],
|
||||
"Tirsdag 12. august": [
|
||||
"2025-08-12": [
|
||||
{ "time": "18:00", "event": "Grillfest", "price": "gratis" },
|
||||
{
|
||||
"time": "19:00",
|
||||
@ -14,7 +14,7 @@
|
||||
{ "time": "21:00", "event": "Live karaoke", "price": "gratis" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "price": "gratis" }
|
||||
],
|
||||
"Onsdag 13. august": [
|
||||
"2025-08-13": [
|
||||
{
|
||||
"time": "18:00",
|
||||
"event": "KKK: Komisk Komedie-Kveld",
|
||||
@ -25,10 +25,10 @@
|
||||
{ "time": "21:00", "event": "Karaoke", "price": null },
|
||||
{ "time": "22:00", "event": "Silent Disco", "price": null }
|
||||
],
|
||||
"Torsdag 14. august": [
|
||||
"2025-08-14": [
|
||||
{
|
||||
"time": "18:00",
|
||||
"event": "Drunk Impro 4K, VROVL",
|
||||
"event": "Drunk Impro 4K, VRØVL",
|
||||
"price": "billetter ute!",
|
||||
"url": "https://www.ticketmaster.no/event/studio-drunk-impro-i-storsalen-med-4k-billetter/912660512"
|
||||
},
|
||||
@ -36,7 +36,7 @@
|
||||
{ "time": "20:00", "event": "Live karaoke", "price": "gratis" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "price": "gratis" }
|
||||
],
|
||||
"Fredag 15. august": [
|
||||
"2025-08-15": [
|
||||
{ "time": "21:00", "event": "Allsangkaraoke", "price": "gratis" },
|
||||
{ "time": "22:00", "event": "Afterparty", "price": "gratis" },
|
||||
{ "time": "22:00", "event": "Silent Disco", "price": "gratis" }
|
||||
|
||||
@ -2,22 +2,23 @@
|
||||
import "@styles/global.css";
|
||||
import Nav from '@components/Nav.astro';
|
||||
import Footer from '@components/Footer.astro';
|
||||
const { lang = 'no' } = Astro.props;
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="no">
|
||||
<html lang={lang}>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<link rel="icon" type="image/svg+xml" href="/logo.png" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>STUDiO 2025 - Studentfestivalen i Oslo</title>
|
||||
</head>
|
||||
<body class="grid grid-rows-[auto_1fr_auto] jusify-center">
|
||||
<Nav />
|
||||
<div class="max-w-7xl grid place-self-center gap-8">
|
||||
<body class="grid grid-rows-[auto_1fr_auto] jusify-center gap-12">
|
||||
<Nav lang={lang} />
|
||||
<div id="content" class="max-w-7xl grid place-self-center gap-8 px-4">
|
||||
<slot />
|
||||
</div>
|
||||
<Footer />
|
||||
<Footer lang={lang} />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import About from '@components/About.astro';
|
||||
import AboutComponent from '@components/About.astro';
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<About />
|
||||
<Layout lang="no">
|
||||
<AboutComponent lang="no" />
|
||||
</Layout>
|
||||
@ -1,38 +0,0 @@
|
||||
---
|
||||
import data from '/src/data/en-program.json';
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
---
|
||||
|
||||
<Layout>
|
||||
{Object.entries(data).map(([dayName, items], index) => (
|
||||
<div class="day">
|
||||
<h2>{dayName}</h2>
|
||||
<ul>
|
||||
{items.map((item, itemIndex) => (
|
||||
<li class="item">
|
||||
{item.time} - {item.event} - {item.price}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
))}
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.day {
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.day:nth-child(odd) {
|
||||
background-color: #F8BC90;
|
||||
}
|
||||
.day:nth-child(even) {
|
||||
background-color: #0A0F6D;
|
||||
color: #fff; /* Optional: Adjust text color for better readability */
|
||||
}
|
||||
.item {
|
||||
margin: 5px 0;
|
||||
}
|
||||
</style>
|
||||
8
src/pages/en/about.astro
Normal file
8
src/pages/en/about.astro
Normal file
@ -0,0 +1,8 @@
|
||||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import AboutComponent from '@components/About.astro';
|
||||
---
|
||||
|
||||
<Layout lang="en">
|
||||
<AboutComponent lang="en" />
|
||||
</Layout>
|
||||
16
src/pages/en/index.astro
Normal file
16
src/pages/en/index.astro
Normal file
@ -0,0 +1,16 @@
|
||||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import Program from '@components/Program.astro';
|
||||
import Links from '@components/Links.astro';
|
||||
import FAQ from '@components/FAQ.astro';
|
||||
import Hero from '@components/Hero.astro';
|
||||
import Vors from '@components/Vors.astro';
|
||||
---
|
||||
|
||||
<Layout lang="en">
|
||||
<Hero lang="en" />
|
||||
<Links lang="en" class="text-5xl text-black" />
|
||||
<Program lang="en" />
|
||||
<FAQ lang="en" />
|
||||
<Vors lang="en" />
|
||||
</Layout>
|
||||
9
src/pages/en/program.astro
Normal file
9
src/pages/en/program.astro
Normal file
@ -0,0 +1,9 @@
|
||||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import ProgramComponent from '@components/Program.astro';
|
||||
import data from '@data/en-program.json';
|
||||
---
|
||||
|
||||
<Layout lang="en">
|
||||
<ProgramComponent lang="en" data={data} />
|
||||
</Layout>
|
||||
@ -7,10 +7,10 @@ import Hero from '@components/Hero.astro';
|
||||
import Vors from '@components/Vors.astro';
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<Hero />
|
||||
<Links />
|
||||
<Program />
|
||||
<FAQ />
|
||||
<Vors />
|
||||
<Layout lang="no">
|
||||
<Hero lang="no" />
|
||||
<Links lang="no" class="text-5xl text-black" />
|
||||
<Program lang="no" />
|
||||
<FAQ lang="no" />
|
||||
<Vors lang="no" />
|
||||
</Layout>
|
||||
|
||||
@ -1,42 +1,9 @@
|
||||
---
|
||||
import data from '/src/data/program.json';
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import ProgramComponent from '@components/Program.astro';
|
||||
import data from '@data/program.json';
|
||||
---
|
||||
|
||||
<Layout>
|
||||
{Object.entries(data).map(([dayName, items], index) => (
|
||||
<div class="day">
|
||||
<h2>{dayName}</h2>
|
||||
<ul>
|
||||
{items.map((item, itemIndex) => (
|
||||
<li class="item">
|
||||
{item.time} - {item.event} - {item.url ? (
|
||||
<a href={item.url} target="_blank" rel="noopener noreferrer">{item.price}</a>
|
||||
) : (
|
||||
item.price
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
))}
|
||||
<Layout lang="no">
|
||||
<ProgramComponent lang="no" data={data} />
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.day {
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.day:nth-child(odd) {
|
||||
background-color: #F8BC90;
|
||||
}
|
||||
.day:nth-child(even) {
|
||||
background-color: #0A0F6D;
|
||||
color: #fff; /* Optional: Adjust text color for better readability */
|
||||
}
|
||||
.item {
|
||||
margin: 5px 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +1,19 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap");
|
||||
@import url("https://fonts.google.com/specimen/Montserrat?query=montserrat");
|
||||
|
||||
@import "tailwindcss";
|
||||
|
||||
:root {
|
||||
--font-avenir: "Avenir Next", sans-serif;
|
||||
--background: #E5E2D7;
|
||||
--text: #333333;
|
||||
--accent: #C13131;
|
||||
--font-avenir: "montserrat", sans-serif;
|
||||
--accent: #c13131;
|
||||
|
||||
--dyp-tegl: #720328;
|
||||
--griserosa: #cd96ab;
|
||||
--betongraa: #e5e2d7;
|
||||
--gyllen-oransje: #ff6915;
|
||||
--gyllen-beige: #f8bc90;
|
||||
--slottsblaa: #0a0f6d;
|
||||
--svart: #161516;
|
||||
}
|
||||
|
||||
@theme {
|
||||
@ -12,32 +21,52 @@
|
||||
--color-background: var(--background);
|
||||
--color-text: var(--text);
|
||||
--color-accent: var(--accent);
|
||||
|
||||
--color-dyp-tegl: var(--dyp-tegl);
|
||||
--color-griserosa: var(--griserosa);
|
||||
--color-betongraa: var(--betongraa);
|
||||
--color-gyllen-oransje: var(--gyllen-oransje);
|
||||
--color-gyllen-beige: var(--gyllen-beige);
|
||||
--color-slottsblaa: var(--slottsblaa);
|
||||
--color-svart: var(--svart);
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@apply m-0;
|
||||
@apply w-full;
|
||||
@apply h-full;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply text-lg;
|
||||
font-family: var(--font-avenir);
|
||||
color: var(--color-text);
|
||||
background-color: var(--color-background);
|
||||
@apply bg-betongraa;
|
||||
font-family: var(--font-avenir);
|
||||
@apply text-svart;
|
||||
@apply text-lg;
|
||||
@apply leading-relaxed;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--color-accent);
|
||||
text-decoration: none;
|
||||
a.active {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
nav a {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
}
|
||||
nav a.active {
|
||||
font-weight: bolder;
|
||||
text-decoration: underline;
|
||||
}
|
||||
#content a {
|
||||
@apply text-gyllen-oransje;
|
||||
}
|
||||
#content a:hover {
|
||||
@apply text-slottsblaa;
|
||||
@apply underline;
|
||||
}
|
||||
|
||||
#program-list:nth-child(odd) a {
|
||||
@apply text-accent;
|
||||
}
|
||||
#program-list:nth-child(odd) a:hover {
|
||||
@apply text-dyp-tegl;
|
||||
@apply underline;
|
||||
}
|
||||
|
||||
#program-list:nth-child(even) a:hover {
|
||||
@apply text-accent;
|
||||
@apply underline;
|
||||
}
|
||||
|
||||
@ -1,12 +1,7 @@
|
||||
{
|
||||
"extends": "astro/tsconfigs/strict",
|
||||
"include": [
|
||||
".astro/types.d.ts",
|
||||
"**/*"
|
||||
],
|
||||
"exclude": [
|
||||
"dist"
|
||||
],
|
||||
"include": [".astro/types.d.ts", "**/*"],
|
||||
"exclude": ["dist"],
|
||||
"compilerOptions": {
|
||||
"jsx": "react-jsx",
|
||||
"jsxImportSource": "react",
|
||||
@ -14,10 +9,11 @@
|
||||
"paths": {
|
||||
"@assets/*": ["src/assets/*"],
|
||||
"@components/*": ["src/components/*"],
|
||||
"@data/*": ["src/data/*"],
|
||||
"@elements/*": ["src/components/elements/*"],
|
||||
"@layouts/*": ["src/layouts/*"],
|
||||
"@sections/*": ["src/components/sections/*"],
|
||||
"@styles/*": ["src/styles/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user