index.astro

---
import BaseLayout from "../layouts/BaseLayout.astro";
import Section from "../components/Section.astro";
import BearLink from "../components/BearLink.astro";

import Banner from "../sections/banner.astro";
import News from "../sections/news.astro";
import Speakers from "../sections/speakers.astro";
import Agenda from "../sections/agenda.astro";
import Friends from "../sections/friends.astro";
import { Content as Description } from "../sections/description.md";
import { Content as Theme } from "../sections/theme.md";
import { Content as Event } from "../sections/event.md";
import Organizers from "../sections/organizers.astro";
import { day1, day2 } from "../data/agenda";
---

<BaseLayout>
  <Banner />
  <main id="main">
    <Section variant="light" content="text">
      <News />
    </Section>
    <Section id="speakers" variant="dark" content="list">
      <Speakers />
    </Section>
    <Section variant="light" content="text">
      <Theme />
      <span class="absolute right-[16%] top-[-110px] z-10 hidden lg:block">
        <img
          class="w-[200px]"
          src="/img/props/rocket.svg"
          alt=""
          aria-hidden="true"
        />
      </span>
      <h2>Agenda</h2>
      <p>
        This is just a draft version of the agenda.
      </p>
      <Agenda title="Day 1: Thursday May 29" agendaItems={day1} />
      <Agenda title="Day 2: Friday May 30" agendaItems={day2} />
    </Section>
    <Section variant="dark" content="text">
      <Description />
      <span class="absolute left-[-120px] top-[100px] z-10 hidden lg:block">
        <BearLink rotate={90} animation="scaleAndSlide" />
      </span>
    </Section>
    <Section id="sponsors" variant="light" content="list">
      <Friends />
    </Section>
    <Section variant="dark" content="text">
      <Event />
      <span class="absolute right-1/4 top-[-100px] z-10 hidden lg:block">
        <a
          class="duration-speed-move block transition-transform ease-out after:hidden hover:scale-110"
          target="_blank"
          rel="noreferrer noopener"
          href="https://www.google.com/maps?saddr&daddr=Grand%20Hotel%20Italia,%20Strada%20Trifoiului%202,%20Cluj-Napoca%20400478,%20Romania"
          title="Get event location on Google Maps"
        >
          <img class="w-[200px]" src="/img/props/earth.svg" alt="" />
        </a>
      </span>
    </Section>
    <Section variant="light" content="list">
      <Organizers />
    </Section>
  </main>
</BaseLayout>