import { graphql } from "@/gql";
//import { NewsFragment } from "@/gql/graphql";
import { getClient } from "@/app/client";
import Link from "next/link";
import { PageHeader } from "@/components/general/PageHeader";
import { IconListBlock } from "@/components/blocks/IconListBlock";

export default async function Page() {
  return (
    <main className="site-main" id="main">
      <PageHeader heading="Praktisk info" />
      <p className="lead">
        Velkommen til oss! Enten du skal på teater, konsert, foredrag, eller er
        student eller pensjonist, gleder vi oss til å se deg på Chateau Neuf.
        Her finner du informasjon om hvordan du kommer deg til oss, og hva vi
        kan by på av tjenester.
      </p>
      <div className="anchorLinks">
        <span className="circlehead">Hopp til:</span>
        <ul>
          <li>
            <a href="#adresse-og-adkomst" className="button">
              Adresse og adkomst
            </a>
          </li>
          <li>
            <a href="#apningstider" className="button">
              Åpningstider
            </a>
          </li>
          <li>
            <a href="#billetter" className="button">
              Billetter
            </a>
          </li>
          <li>
            <a href="#" className="button">
              Booking og utleie
            </a>
          </li>
          <li>
            <a href="#" className="button">
              Hittegods
            </a>
          </li>
          <li>
            <a href="#" className="button">
              Tilgjengelighet
            </a>
          </li>
          <li>
            <a href="#" className="button">
              Vergeordning
            </a>
          </li>
          <li>
            <a href="#" className="button">
              Servering
            </a>
          </li>
        </ul>
      </div>
      <section className="pageSection" id="adresse-og-adkomst">
        <h1>Adresse og adkomst</h1>
        <div className="pageSectionGroup">
          <h2>Adresse</h2>
          <p>
            Chateau Neuf
            <br />
            Slemdalsveien
            <br />
            15 0369 Oslo
          </p>
          <a href="#">Åpne i Google Maps &rarr;</a>
          <div className="iframe-wrap">
            <iframe
              loading="lazy"
              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3997.986159638909!2d10.708115532212085!3d59.932257000000334!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46416ddb5278789f%3A0xadda2b97f9d1cad6!2sChateau+Neuf+-+The+Norwegian+Students'+Society!5e0!3m2!1sen!2sno!4v1554374857442!5m2!1sen!2sno"
              allowFullScreen
              width="600"
              height="450"
              frameBorder="0"
            ></iframe>
          </div>
        </div>
        <div className="pageSectionGroup">
          <h2>Adkomst</h2>
          <p>Skal vi si noe kort om hvordan du enklest kommer deg til Neuf?</p>
          <h3>Kollektivt</h3>
          <h3>Parkering</h3>
        </div>
      </section>
      <section className="pageSection" id="apningstider">
        <h1>Åpningstider</h1>
        <div className="openingHoursGroup">
          <h2>Serveringssteder</h2>
          <div className="openingHoursItem">
            <h3>Glassbaren (1. etasje)</h3>
            <table className="openingHours">
              <tr>
                <td>Man—Tor</td>
                <td>15:00—00:30</td>
              </tr>
              <tr>
                <td>Fre</td>
                <td>15:00—02:30</td>
              </tr>
              <tr>
                <td>Lør—Søn</td>
                <td>Åpent ved arrangement</td>
              </tr>
            </table>
          </div>
          <div className="openingHoursItem">
            <h3>Bokcaféen (2. etasje)</h3>
            <table className="openingHours">
              <tr>
                <td>Tir—Tor</td>
                <td>19:00—23:30</td>
              </tr>
              <tr>
                <td>Fre</td>
                <td>19:00—01:30</td>
              </tr>
            </table>
          </div>
        </div>
        <div className="openingHoursGroup">
          <h2>Ekspedisjonen</h2>
          <div className="openingHoursItem">
            <h3>Slottsmester og telefon</h3>
            <table className="openingHours">
              <tr>
                <td>Man—Fre</td>
                <td>15:00—00:00</td>
              </tr>
              <tr>
                <td>Lør</td>
                <td>14:00—00:00</td>
              </tr>
            </table>
            <p>Ekspedisjonen er også åpen under arrangementer på huset.</p>
            <Link href="/kontakt">Se kontaktinfo til ekspedisjonen &rarr;</Link>
          </div>
        </div>
      </section>
      <section className="pageSectionAlt" id="billetter">
        <h1>Billetter</h1>
      </section>
      <IconListBlock />
    </main>
  );
}