Files
web/components/Current/Header/De.tsx

107 lines
6.2 KiB
TypeScript

import { currentAboutLinks, currentSponsoringLinks, currentWifiLinks } from "@/constants/current/links"
import Desktop from "./LanguageSwitcher/Desktop"
import Mobile from "./LanguageSwitcher/Mobile"
import type { HeaderProps } from "@/types/components/current/header"
import type { LanguageSwitcherLink } from "@/types/components/current/languageSwitcher"
const paths: Record<string, LanguageSwitcherLink[]> = {
"/kundenbetreuung/haufig-gestellte-fragen/nutzung-der-internetseite": currentAboutLinks,
"/scandic-entdecken/wlan": currentWifiLinks,
"/sponsoring": currentSponsoringLinks,
}
const currentLanguage = "Deutsch"
export default function DeHeader({ pathname }: HeaderProps) {
const links = paths?.[pathname] ?? null
return (
<header className="header" role="banner">
<div className="offline-banner hidden">
Sie sind offline. Manche Inhalte könnten nicht aktuell sein.
<button type="button" className="reload">Neu laden</button>
</div>
<div className="l-section main-header navigation-bar" data-js="main-nav-bar">
<div className="navigation-bar__top navigation-bar__top--ghostwhite-light">
<div className="l-section__inner">
<a href="https://www.scandichotels.de" className="scandic-main-page-link">Back to scandichotels.de</a>
<ul className="nav-secondary navbar-login">
<li className="nav-secondary__item hidden-xxsmall hidden-xsmall hidden-small">
{links ? <Desktop currentLanguage={currentLanguage} links={links} /> : null}
</li>
<li className=" hidden-xxsmall hidden-xsmall hidden-small nav-secondary__item">
<a className="nav-secondary__item__link" href="https://www.scandichotels.de/hotelreservation/get-booking">Buchung ansehen/ändern</a>
</li>
<li className=" hidden-xxsmall hidden-xsmall hidden-small nav-secondary__item">
<a className="nav-secondary__item__link" href="https://www.scandichotels.de/karriere-bei-scandic-hotels">Karriere bei Scandic</a>
</li>
<li className=" hidden-xxsmall hidden-xsmall hidden-small nav-secondary__item">
<a className="nav-secondary__item__link" href="https://www.scandichotels.de/geschaftsreisen">Firmenkunden</a>
</li>
<li className=" hidden-xxsmall hidden-xsmall hidden-small nav-secondary__item">
<a className="nav-secondary__item__link" href="https://www.scandichotels.de/scandic-friends">Über Scandic Friends</a>
</li>
</ul>
</div>
</div>
<div className="navigation-bar__main">
<div className="l-section__inner l-section__inner--small-no-padding" itemScope={undefined} itemType="http://schema.org/Organization">
<meta itemProp="name" content="Scandic" />
<button type="button" className="navigation-bar__main__expander" data-js="main-nav-toggler" data-target="#main-menu" aria-pressed="false">
<span className="icon-bars"></span><span className="hidden--accessible">Menu</span>
</button>
<a id="scandic-logo" className="navigation-bar__main__logo hidden-medium " href="https://www.scandichotels.de" itemProp="url">
<span className="hidden--accessible">Back to scandichotels.de</span>
<img src="/Static/img/scandic-logotype.svg" data-js="scandiclogoimg" alt="Scandic Hotels logo" height="22" data-nosvgsrc="/Static/img/scandic-logotype.png" itemProp="logo" />
</a>
<ul id="navbar-header-design" className="hidden hidden-medium hidden-large nav-primary__header">
<li className="nav-primary__scandicfriendslogo">
<img src="/Static/img/icons/scandic-friends/icon-scandic-friends.svg" width="35" height="35" />
</li>
</ul>
<nav>
<ul id="main-menu" className="nav-primary is-collapsed" data-collapsable="main-menu">
<li className="nav-primary__item nav-primary__item--primary hidden-large hidden-small hidden-xsmall hidden-xxsmall" aria-hidden="true">
<a className="navigation-bar__main__logo" href="https://www.scandichotels.de">
<img src="/Static/img/scandic-logotype.svg" data-js="scandiclogoimg" alt="Scandic Hotels logo" height="22" data-nosvgsrc="/Static/img/scandic-logotype.png" />
<span className="hidden--accessible">Back to scandichotels.de</span>
</a>
</li>
<li className="nav-primary__item nav-primary__item--primary ">
<a href="https://www.scandichotels.de/hotelsuche">Hotels & Reiseziele</a>
</li>
<li className="nav-primary__item nav-primary__item--primary ">
<a href="https://www.scandichotels.de/reisemagazin">Reisemagazin</a>
</li>
<li className="nav-primary__item nav-primary__item--primary ">
<a href="https://www.scandichotels.de/tagungen-und-events">Tagungen & Events</a>
</li>
<li className="nav-primary__item nav-primary__item--primary ">
<a href="https://www.scandichotels.de/scandic-entdecken">Scandic entdecken</a>
</li>
<li className="nav-primary__item nav-primary__item--primary ">
<a href="https://www.scandichotels.de/angebote-arrangements">Angebote</a>
</li>
<li className="nav-primary__item nav-primary__item--secondary hidden-medium hidden-large ">
<a href="https://www.scandichotels.de/scandic-friends">Über Scandic Friends</a>
</li>
<li className="nav-primary__item nav-primary__item--secondary hidden-medium hidden-large ">
<a href="https://www.scandichotels.de/geschaftsreisen">Geschäftsreisen</a>
</li>
<li className="nav-primary__item hidden-medium hidden-large">
{links ? <Mobile currentLanguage={currentLanguage} links={links} /> : null}
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
)
}