From bcc01476c3630919a4ec26f4892984e6c1ce8c75 Mon Sep 17 00:00:00 2001
From: Dariusz Niemczyk <palid@phoelid.me>
Date: Fri, 4 Apr 2025 17:15:43 +0200
Subject: [PATCH] feat: add new pages texts

---
 src/app/[locale]/pages/[slug]/page.tsx |   8 ++
 src/components/event-map.lazy.tsx      |   2 +-
 src/components/landing-page.tsx        | 160 ++++++++++++++++++++++---
 src/components/nav.tsx                 |  13 +-
 src/i18n/translations.ts               | 141 ++++++++++++++--------
 5 files changed, 244 insertions(+), 80 deletions(-)

diff --git a/src/app/[locale]/pages/[slug]/page.tsx b/src/app/[locale]/pages/[slug]/page.tsx
index 15ffbfc..d064e7e 100644
--- a/src/app/[locale]/pages/[slug]/page.tsx
+++ b/src/app/[locale]/pages/[slug]/page.tsx
@@ -37,6 +37,14 @@ export function generateStaticParams() {
       locale: "en",
       slug: "privacy",
     },
+    {
+      locale: "pl",
+      slug: "rules",
+    },
+    {
+      locale: "en",
+      slug: "rules",
+    },
   ];
 }
 
diff --git a/src/components/event-map.lazy.tsx b/src/components/event-map.lazy.tsx
index 2fc774e..5b8f391 100644
--- a/src/components/event-map.lazy.tsx
+++ b/src/components/event-map.lazy.tsx
@@ -20,7 +20,7 @@ export default function Map({ t }: {
         />
         <Marker position={[51.104955057760804, 17.087378768775697]}>
           <Popup>
-            {t.where.location}
+            {t.details.where.location}
           </Popup>
         </Marker>
       </MapContainer>
diff --git a/src/components/landing-page.tsx b/src/components/landing-page.tsx
index 2baf9e0..03813c2 100644
--- a/src/components/landing-page.tsx
+++ b/src/components/landing-page.tsx
@@ -13,6 +13,48 @@ import { NewsletterPopup } from './newsletter-form';
 import { useTheme } from "./providers";
 import { Skeleton } from './ui/skeleton';
 
+function Heading({ children }: { children: ReactElement | string }) {
+  return <h2 className="text-5xl font-bold tracking-tighter max-w-3xl mx-auto">{children}</h2>
+}
+
+function Subheading({ children }: { children: ReactElement | string }) {
+  return <h3 className="text-3xl font-bold tracking-tighter max-w-3xl mx-auto">{children}</h3>
+}
+
+function TinyHeading({ children }: { children: ReactElement | string }) {
+  return <h4 className="text-lg font-bold tracking-tighter max-w-3xl mx-auto mb-2">{children}</h4>
+}
+
+function TinyTextWrapper({ children }: { children: ReactElement }) {
+  return <div className="text-sm text-muted-foreground max-w-3xl mx-auto whitespace-pre-line">
+    {children}
+  </div>
+}
+
+
+function TextWrapper({ children }: { children: ReactElement }) {
+  return <div className="text-lg text-muted-foreground max-w-3xl mx-auto whitespace-pre-line">
+    {children}
+  </div>
+}
+
+function NewSection({
+  id,
+  children,
+  after
+}: {
+  id: string
+  children: ReactElement;
+  after?: ReactElement;
+}) {
+  return (<section id={id} className="bg-background">
+    <div className="container mx-auto px-4 gap-6 flex flex-col">
+      {children}
+      {after}
+    </div>
+  </section>)
+}
+
 function Section({
   id,
   title,
@@ -147,7 +189,6 @@ export default function LandingPage(
 ) {
 
   const { theme } = useTheme()
-
   return (
     <div>
       <MainpageNav t={t} />
@@ -162,29 +203,110 @@ export default function LandingPage(
             <div className={`text-center ${jgs7.className}`}>
               <h1 className="text-5xl sm:text-6xl md:text-8xl font-bold tracking-tighter light:text-background">{t.hero.title}</h1>
               <p className="mt-2 text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl-text:7xl 2xl:text-8xl text-primary">{t.hero.subtitle}</p>
-              <p className="mt-2 text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl-text:7xl 2xl:text-8xl text-primary ">{t.when.date}</p>
-              <NewsletterPopup t={t} />
+              <p className="mt-2 text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl-text:7xl 2xl:text-8xl text-primary ">{t.details.when.date}</p>
+              <div className='flex flex-col space-y-4 max-w-20 items-center justify-center m-auto'>
+                <NewsletterPopup t={t} />
+              </div>
             </div>
           </div>
         </section>
 
-        <Section id="about" title={t.about.title} paragraphs={<p>{t.about.description}</p>} />
-        <Section id="where" title={t.where.title} paragraphs={<p>{t.where.location}</p>} after={<LazyLeafletMap t={t} />} />
+        <NewSection id="about">
+          <>
+            <div>
+              <Heading>{t.about.title}</Heading>
+            </div>
+            <section>
+              <TextWrapper><p>{t.about.description}</p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.details.when.title}</Subheading>
+              <TextWrapper><p className={`text-primary text-3xl ${jgs7.className}`}>{t.details.when.date}</p></TextWrapper>
+              <TextWrapper><p>{t.details.when.extra}</p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.details.where.title}</Subheading>
+              <TextWrapper><p>{t.details.where.location}</p></TextWrapper>
+              <LazyLeafletMap t={t} />
+            </section>
+          </>
+        </NewSection>
 
-        <Section id="when" title={t.when.title} paragraphs={<>
-          <p className={`text-primary text-3xl ${jgs7.className}`}>{t.when.date}</p>
-          <p className="mt-4">{t.when.extra}</p></>}
-        />
-        <Section id="tickets" title={t.tickets.title} paragraphs={<p>{t.tickets.status}</p>} />
-        <Section id="accommodation" title={t.accommodation.title} paragraphs={<p>{t.accommodation.description}</p>} />
-        <Section id="food" title={t.food.title} paragraphs={<p>{t.food.description}</p>} />
-        <Section id="contact" title={t.contact.title} paragraphs={<a href={`mailto:${t.contact.email}`}>{t.contact.email}</a>} />
-        <Section id="credits" title={t.credits.title} paragraphs={<>
-          <p>{t.credits.usedFonts}</p>
-          <p><a className="hover:underline" href="https://velvetyne.fr/fonts/jgs-font/">{t.credits.jgs7}</a></p>
-          <p><a className="hover:underline" href="https://fonts.google.com/specimen/Oxanium">{t.credits.oxanium}</a></p>
-        </>}
-        />
+        <NewSection id="tickets">
+          <>
+            <div>
+              <Heading>{t.tickets.title}</Heading>
+            </div>
+            <section>
+              <TextWrapper><p>{t.tickets.status}</p></TextWrapper>
+            </section>
+          </>
+        </NewSection>
+
+
+        <NewSection id="cfp">
+          <>
+            <div>
+              <Heading>{t.cfp.title}</Heading>
+            </div>
+            <section>
+              <TextWrapper><p>{t.cfp.status}</p></TextWrapper>
+            </section>
+          </>
+        </NewSection>
+
+        <NewSection id="faq">
+          <>
+            <div>
+              <Heading>{t.details.title}</Heading>
+            </div>
+            <section>
+              <Subheading>{t.faq.accommodation.title}</Subheading>
+              <TextWrapper><p>{t.faq.accommodation.description}</p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.faq.accesibility.title}</Subheading>
+              <TextWrapper><p>{t.faq.accesibility.description} <a href="mailto:orga@cebula.camp">{t.contact.email}</a></p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.faq.food.title}</Subheading>
+              <TextWrapper><p>{t.faq.food.description}</p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.faq.transport.title}</Subheading>
+              <TextWrapper><p>{t.faq.transport.description}</p></TextWrapper>
+            </section>
+            <section>
+              <Subheading>{t.faq.documents.title}</Subheading>
+              <TextWrapper><p>
+                <a className='hover:text-primary' href={`/pages/rules`}>📜 {t.faq.documents.rules}</a></p></TextWrapper>
+              <TextWrapper><p>
+                <a className='hover:text-primary' href={`/pages/privacy`}>📜 {t.faq.documents.privacyPolicy}</a></p></TextWrapper>
+            </section>
+          </>
+        </NewSection>
+
+        <NewSection id="contact">
+          <>
+            <div>
+              <Heading>{t.contact.title}</Heading>
+            </div>
+            <section>
+              <TextWrapper><p><a href={`mailto:${t.contact.email}`}>{t.contact.email}</a></p></TextWrapper>
+            </section>
+          </>
+        </NewSection>
+
+        <NewSection id="credits">
+          <>
+            <section className='text-sm'>
+              <TinyHeading>{t.credits.title}</TinyHeading>
+              <TinyTextWrapper><p>{t.credits.usedFonts}</p></TinyTextWrapper>
+              <TinyTextWrapper><p><a className="hover:underline" href="https://velvetyne.fr/fonts/jgs-font/">{t.credits.jgs7}</a></p></TinyTextWrapper>
+              <TinyTextWrapper><p><a className="hover:underline" href="https://fonts.google.com/specimen/Oxanium">{t.credits.oxanium}</a></p></TinyTextWrapper>
+            </section>
+          </>
+        </NewSection>
       </main>
     </div>
   )
diff --git a/src/components/nav.tsx b/src/components/nav.tsx
index 3259d05..e714728 100644
--- a/src/components/nav.tsx
+++ b/src/components/nav.tsx
@@ -7,14 +7,11 @@ import { MobileNav } from "./mobile-nav"
 import { NavContainer } from "./nav-container"
 
 const linksOrder: Array<keyof (typeof translations.pl)["nav"]> = [
-  "hero",
-  "about",
-  "where",
-  "when",
-  "tickets",
-  "accommodation",
-  "food",
-  "contact",
+  'about',
+  'tickets',
+  'cfp',
+  'details',
+  'contact'
 ]
 
 export function MainpageNav({
diff --git a/src/i18n/translations.ts b/src/i18n/translations.ts
index f103c12..d48663b 100644
--- a/src/i18n/translations.ts
+++ b/src/i18n/translations.ts
@@ -8,14 +8,11 @@ const pl = {
   siteTitle: "CebulaCamp 2025",
   nav: {
     title: "CEBULACAMP",
-    hero: "Cebula",
-    about: "O nas",
-    when: "Kiedy",
-    where: "Gdzie",
-    food: "Wyżywienie",
-    contact: "Kontakt",
+    about: "O wydarzeniu",
     tickets: "Bilety",
-    accommodation: "Nocleg",
+    cfp: "Zgłoś prelekcję",
+    details: "FAQ",
+    contact: "Kontakt",
   },
   mobileNav: {
     toggleMenu: "Aktywuj menu",
@@ -26,34 +23,56 @@ const pl = {
     subtitle: "REAKTYWACJA",
   },
   about: {
-    title: "O nas",
+    title: "O wydarzeniu",
     description:
       "Zjazd hakerów, miłośników open source, wolnych duchów. Organizowany przez hakerów dla hakerów. Będzie mate, będzie utopia, będzie chillera.\n\nReaktywacja wydarzenia po długiej przerwie od ostatniej edycji w 2021. Tym razem widzimy się we Wrocławiu, w budynku starej zajezdni tramwajowej który zamienimy na łączone hackcenter i salę prelekcyjną.\n\nSpodziewaj się ciekawych prezentacji, dziwnych instalacji artystycznych i mnóstwa dyskusji. Możesz opowiedzieć o swoim projekcie, zademonstrować skonstruowane zabawki, albo wspólnie coś stworzyć podczas eventu.",
   },
-  where: {
-    title: "Gdzie",
-    location:
-      "Klub „Łącznik”, Tramwajowa 1-3, Wrocław, obok Hackerspace Wrocław",
-  },
-  when: {
-    title: "Kiedy",
-    date: "28-31.08.2025",
-    extra:
-      "Chętnych do pomocy w przygotowaniach zapraszamy już na Day 0, 27 sierpnia",
+  details: {
+    title: "FAQ",
+    where: {
+      title: "Lokalizacja",
+      location:
+        "Wydarzenie odbędzie się w Centrum Kultury Akademickiej i Inicjatyw Lokalnych Czasoprzestrzeń na terenie dawnej zajezdni tramwajowej. Centralnym punktem spotkań będzie klub Łącznik gdzie będzie miejsce na prelekcje i wspólne hackowanie.\n\nKlub „Łącznik”, Tramwajowa 1-3, Wrocław, obok Hackerspace Wrocław",
+    },
+    when: {
+      title: "Kiedy",
+      date: "28-31.08.2025",
+      extra:
+        "Chętnych do pomocy w przygotowaniach zapraszamy już na Day 0, 27 sierpnia",
+    },
   },
   tickets: {
     title: "Bilety",
     status: "Wkrótce ™",
   },
-  accommodation: {
-    title: "Nocleg",
-    description:
-      "W duchu prawdziwego campu przygotowujemy ogrodzone miejsce do rozbicia namiotu z toaletami i prysznicem. Ilość miejsc namiotowych ograniczona, obowiązuje kolejność rezerwacji. Jest także możliwość zakwaterowania we własnym zakresie w pobliskim hotelu lub akademikach.",
+  cfp: {
+    title: "Zgłoś prelekcję",
+    status: "Wkrótce ™",
   },
-  food: {
-    title: "Wyżywienie",
-    description:
-      "We własnym zakresie, w okolicy dostępne są knajpy z dowozem, wieczory planujemy umilić wspólnym grillowaniem.",
+  faq: {
+    accommodation: {
+      title: "Nocleg",
+      description: `Dla uczestników przewidziano możliwość noclegu we własnych namiotach na zielonym trawniku znajdującym się na terenie zajezdni. Teren całej zajezdni jest ogrodzony, natomiast nie jest strzeżony. Toalety i prysznic są dostępne dla wszystkich uczestników, a ich infrastruktura została dostosowana do potrzeb osób o ograniczonej sprawności ruchowej.\n\nOsoby preferujące inne warianty noclegowe mogą skorzystać z oferty Hotelu Zoo lub pobliskich akademików.`,
+    },
+    accesibility: {
+      title: "Dostępność",
+      description: `Cały teren znajduje się na poziomie gruntu. Warto jednak pamiętać, że część nawierzchni jest wyłożona kostką brukową, co może być trudniejsze do pokonania dla osób korzystających z wózków inwalidzkich. Osoby potrzebujące jakiegokolwiek wsparcia w zakresie dostępności prosimy o kontakt: `,
+    },
+    food: {
+      title: "Wyżywienie",
+      description:
+        "W bezpośrednim sąsiedztwie znajduje się Biedronka oraz wiele lokali gastronomicznych oferujących dowóz jedzenia, co zapewni uczestnikom wygodę i dostęp do posiłków przez cały czas trwania wydarzenia. Planujemy również mały kącik kawowo-herbaciany oraz wieczory ze wspólnym grillowaniem.",
+    },
+    transport: {
+      title: "Transport i parking",
+      description:
+        "Jako że wydarzenie organizowane jest terenie zajezdni tramwajowej to mamy w pobliżu przystanek linii tramwajowych i autobusowych dojeżdżających do centrum oraz dworca głównego. Na terenie zajezdni znajduje się parking.",
+    },
+    documents: {
+      title: "Dokumenty",
+      rules: "Regulamin wydarzenia",
+      privacyPolicy: "Polityka prywatności",
+    },
   },
   contact: {
     title: "Kontakt",
@@ -85,14 +104,11 @@ const en = {
   siteTitle: "CebulaCamp 2025",
   nav: {
     title: "CEBULACAMP",
-    hero: "Onion",
-    about: "About us",
-    when: "When",
-    where: "Where",
-    food: "Food",
-    contact: "Contact",
+    about: "About the event",
     tickets: "Tickets",
-    accommodation: "Accomodation",
+    cfp: "Call for papers",
+    details: "FAQ",
+    contact: "Contact",
   },
   mobileNav: {
     toggleMenu: "Toggle menu",
@@ -103,34 +119,55 @@ const en = {
     subtitle: "REACTIVATED",
   },
   about: {
-    title: "About us",
+    title: "About the event",
     description:
       "A gathering of hackers, open source enthusiasts, and free spirits. Organized by hackers for hackers. An utopia of mate and chill vibes.\n\nFirst event since a long pause that started on 2021. This year we'll see eachother in Wrocław, in an old tram depot building which we'll turn into a combined hack center and talk stage.\n\nExpect interesting presentations, weird art installations, and lots of discussions. Talk about your project, show off the stuff you've built, or work on something together during the event.",
   },
-  where: {
-    title: "Where",
-    location:
-      "“Łącznik” Club, Tramwajowa 1-3, Wrocław, next to Hackerspace Wrocław",
-  },
-  when: {
-    title: "When",
-    date: "28-31.08.2025",
-    extra:
-      "Those willing to help with preparations are welcome to join on Day 0, August 27",
+  details: {
+    title: "FAQ",
+    where: {
+      title: "Location",
+      location: `The event will take place at the Centre for Academic Culture and Local Initiatives Czasoprzestrzeń on the premises of the former tram depot. The central meeting point will be the Łącznik club, where there will be a place for lectures and joint hacking.\n\nClub "Łącznik", Tramwajowa 1-3, Wrocław, next to Hackerspace Wrocław.`,
+    },
+    when: {
+      title: "When",
+      date: "28-31.08.2025",
+      extra:
+        "Those willing to help with preparations are welcome to join on Day 0, August 27",
+    },
   },
   tickets: {
     title: "Tickets",
     status: "Soon ™",
   },
-  accommodation: {
-    title: "Accommodation",
-    description:
-      "In the true camp spirit, we're preparing a fenced area for pitching tents with toilets and shower facilities. The number of tent spots is limited, first-come-first-served basis. There's also the possibility of arranging your own accommodation in a nearby hotel or student dormitories.",
+  cfp: {
+    title: "Call for papers",
+    status: "Soon ™",
   },
-  food: {
-    title: "Food",
-    description:
-      "Self-catering, there are restaurants with delivery in the area, and we plan to enhance the evenings with communal barbecues.",
+  faq: {
+    accommodation: {
+      title: "Accommodation",
+      description: `Participants will have the option of staying overnight in their own tents on the green lawn located on the depot grounds. The entire depot area is fenced, but not guarded. Toilets and showers are available to all participants, and their infrastructure has been adapted to the needs of people with limited physical fitness.\n\nPeople who prefer other accommodation options can take advantage of the offer of the Zoo Hotel or nearby dormitories.`,
+    },
+    accesibility: {
+      title: "Accessibility",
+      description: `The entire area is at ground level. However, it is worth remembering that part of the surface is paved with cobblestones, which may be more difficult for people using wheelchairs. People who need any support in terms of accessibility, please contact: `,
+    },
+    food: {
+      title: "Food",
+      description:
+        "In the immediate vicinity there is a Biedronka and many restaurants offering food delivery, which will provide participants with convenience and access to meals throughout the event. We are also planning a small coffee and tea corner and evenings with a joint barbecue.",
+    },
+    transport: {
+      title: "Transport and parking",
+      description:
+        "As the event is organized at the tram depot, there is a tram and bus stop nearby, going to the city center and the main station. There is a parking lot at the depot.",
+    },
+    documents: {
+      title: "Documents",
+      rules: "Rules of the event",
+      privacyPolicy: "Privacy Policy",
+    },
   },
   contact: {
     title: "Contact",