Merged in feat/footer (pull request #11)

Feat/footer

* chore: correct type

* fix: remove redundant return type

* chore: align code formatting

* chore: format code to avoid diffing noise

* chore: clean up format diffing noise

* chore: move props tying to types folder

* fix: update app_downloads usage and types

* fix: improve footer query and typings

* refactor: add Image.graphql

* fix: correct typings
This commit is contained in:
Arvid Norlin
2024-02-08 14:22:13 +00:00
committed by Simon.Emanuelsson
parent 7926568eae
commit 2bd4e25403
22 changed files with 504 additions and 1723 deletions

View File

@@ -3,13 +3,13 @@ import { notFound } from "next/navigation";
import { request } from "@/lib/request"
import { GetCurrentBlockPage } from "@/lib/graphql/Query/CurrentBlockPage.graphql"
import Aside from "@/components/Current/Aside";
import Blocks from "@/components/Current/Blocks";
import Header from "@/components/Current/Header";
import Hero from "@/components/Current/Hero";
import Aside from "@/components/Current/Aside"
import Blocks from "@/components/Current/Blocks"
import Header from "@/components/Current/Header"
import Hero from "@/components/Current/Hero"
import type { PageArgs, LangParams, UriParams } from "@/types/params";
import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage";
import type { PageArgs, LangParams, UriParams } from "@/types/params"
import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage"
export default async function CurrentContentPage({
params,
@@ -17,10 +17,13 @@ export default async function CurrentContentPage({
}: PageArgs<LangParams, UriParams>) {
try {
if (!searchParams.uri) {
throw new Error("Bad URI");
throw new Error("Bad URI")
}
const response = await request<GetCurrentBlockPageData>(GetCurrentBlockPage, { locale: params.lang, url: searchParams.uri })
const response = await request<GetCurrentBlockPageData>(GetCurrentBlockPage, {
locale: params.lang,
url: searchParams.uri,
})
if (!response.data?.all_current_blocks_page?.total) {
console.log("#### DATA ####")
@@ -36,17 +39,13 @@ export default async function CurrentContentPage({
<>
<Header lang={params.lang} pathname={searchParams.uri} />
{images?.totalCount ? <Hero images={images.edges} /> : null}
<main
className="main l-sections-wrapper"
id="maincontent"
role="main"
>
<main className="main l-sections-wrapper" id="maincontent" role="main">
<Blocks blocks={page.blocks} />
<Aside blocks={page.aside} />
</main>
</>
);
)
} catch (err) {
return notFound();
return notFound()
}
}

View File

@@ -1,320 +0,0 @@
/* eslint-disable @next/next/no-img-element */
import Script from "next/script";
export default function DaFooter() {
return (
<footer className="global-footer">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<img
src="/Static/img/scandic-logotype-white.svg"
data-js="scandiclogoimg"
alt="Scandic hotels logo"
height="22"
data-nosvgsrc="/Static/img/scandic-logotype-white.png"
/>
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">Om Scandic</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Kundeservice</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Hurtige links</div>
</li>
</ul>
<div
data-js-collapsible="global-footer"
className="collapsible-global-footer"
>
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Om Scandic</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/our-company/">
Vores firma | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/oplev-scandic/baeredygtighed">
Bæredygtighed
</a>
</li>
<li>
<a href="http://www.scandichotelsgroup.com/da/media/local-pressroom/denmark/">
Pressehenvendelser
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/job-hos-scandic">
Job hos Scandic - Danmarks bedste arbejdsplads til
inklusion
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/vare-samarbeidspartnere">
Vores samarbejdspartnere
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/sponsorering">
Vi sponsorerer
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Kundservice</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.dk/kundeservice">
Kontakt os
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/sporgsmal-og-svar">
FAQ - Ofte stillede spørgsmål
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/sporgsmal-og-svar/kaledyr-pa-scandic">
Kæledyr Scandic
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/priser-og-bookingvilkar/cookiepolitik">
Cookiepolitik
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/priser-og-bookingvilkar/persondatapolitik">
Persondatapolitik
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/priser-og-bookingvilkar">
Priser og bookingvilkår
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Hurtige links</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.dk/hoteller">
Hoteller & destinationer
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/oplev-scandic">
Altid Scandic
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/scandic-friends">
Scandic Friends - fordele
</a>
</li>
<li>
<a href="https://www.tripadvisor.dk/Search?q=scandic&geo=189512&pid=3826&typeaheadRedirect=true&redirect=&startTime=1460358392897&uiOrigin=MASTHEAD&returnTo=http%253A__2F____2F__www__2E__tripadvisor__2E__dk__2F__&searchSessionId=98F0A837F27C505A0DBF6FE003B6563A1460365582994ssid">
Vores anbefalinger TripAdvisor
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/oplev-scandic/garanti-for-bedste-pris">
Garanti for bedste pris
</a>
</li>
<li>
<a href="https://www.scandichotels.dk/kundeservice/lost-found">
Lost & Found
</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<p>
<strong>OM SCANDIC</strong>
</p>
<p>
Scandic er Nordens største hotelkæde med et netværk af 280
hoteller med 58.000 hotelværelser i drift og under udvikling,
fordelt i seks lande. Hver dag har vores 15.000 team members ét
fælles mål for øje; nemlig at sikre unikke hoteloplevelser, som
giver vores gæster lyst til at komme igen.
<br />
<br />
</p>
<p style={{ textAlign: "center" }}>
<strong>HENT SCANDIC APP&apos;EN</strong>
</p>
<table
style={{
height: "62px",
width: "100%",
borderCollapse: "collapse",
}}
>
<tbody>
<tr style={{ height: "62px" }}>
<td
style={{ width: "50%", height: "62px", textAlign: "right" }}
>
<a
title="Appstore"
href="https://apps.apple.com/dk/app/scandic-hotels/id1267218985"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/yailhjw5c75x6aocmedo/app_store_danish.png"
alt=""
/>
</a>
</td>
<td
style={{ width: "50%", height: "62px", textAlign: "left" }}
>
<a
title="Google Play"
href="https://play.google.com/store/apps/details?id=com.scandichotels.app"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/rtihmdtlmpefspf57yns/android_danish.png"
alt=""
/>
</a>
</td>
</tr>
</tbody>
</table>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">
Følg os de sociale medier
</h3>
<a
href="https://www.facebook.com/ScandicDanmark/"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Facebook"
>
<svg
focusable="false"
className="icon icon--facebook icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons facebook-icon"
>
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a
href="https://twitter.com/scandicglobal"
rel="noopener"
target="_blank"
className="social-media-icon"
>
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg
focusable="false"
className="icon icon--twitter icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons twitter-icon"
>
<title id="twitter-icon">Twitter</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a
href="https://www.instagram.com/scandichotels/"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Instagram"
>
<svg
focusable="false"
className="icon icon--instagram icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons instagram-icon"
>
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Anmeldelser fra</h3>
<img
src="/Static/img/tripadvisor_logo_white_160x24.png"
alt="Trip Advisor logotype"
/>
</div>
</div>
</div>
</footer>
);
}

View File

@@ -1,177 +0,0 @@
import Script from "next/script";
export default function DeFooter() {
return (
<footer className="global-footer ">
<div className="global-footer__content">
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">Über Scandic Hotels</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Service</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Links</div>
</li>
</ul>
<div data-js-collapsible="global-footer" className="collapsible-global-footer">
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Über Scandic Hotels</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/our-company/">Unser Unternehmen - scandichotelsgroup.com</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/en/category/investors/">Investoren - scandichotelsgroup.com</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/en/sustainability/">Nachhaltigkeit - scandichotelsgroup.com</a>
</li>
<li>
<a href="https://www.scandichotels.de/karriere-bei-scandic-hotels">Karriere</a>
</li>
<li>
<a href="http://www.scandichotelsgroup.com/de/media/local-pressroom/germany/">Presse</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Service</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.de/kundenbetreuung">Kontakt</a>
</li>
<li>
<a href="https://www.scandichotels.de/kundenbetreuung/haufig-gestellte-fragen">FAQ</a>
</li>
<li>
<a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/cookie-richtlinie-von-scandic">Cookie Policy</a>
</li>
<li>
<a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/datenschutzrichtlinie">Datenschutz</a>
</li>
<li>
<a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/nutzungsbedingungen-fur-die-scandic-webseite">Nutzungsbedingungen</a>
</li>
<li>
<a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien">Preise und Richtlinien</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Links</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.de/hotelsuche">Hotels & Reiseziele</a>
</li>
<li>
<a href="https://www.scandichotels.de/scandic-entdecken">Scandic entdecken</a>
</li>
<li>
<a href="https://www.scandichotels.de/scandic-friends">Scandic Friends</a>
</li>
<li>
<a href="https://www.scandichotels.de/scandic-entdecken/bestpreisgarantie">Bestpreisgarantie</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<p className="newFooterTitle"><strong>ÜBER UNS</strong></p>
<div className="padTop15">
<p>Scandic ist das größte nordische Hotelunternehmen mit einem Netzwerk aus mehr als 280 Hotels mit rund 58.000 Hotelzimmern in Betrieb sowie in Entwicklung in sechs Ländern. Scandic beschäftigt mehr als 15.000 Teammitglieder mit dem Ziel großartige Hotelerlebnisse zu schaffen, damit unsere Gäste gerne wiederkommen.</p>
<p style={{ textAlign: "center" }}><strong>NUTZEN SIE DIE SCANDIC APP</strong></p>
<table style={{ height: "62px", width: "100%", borderCollapse: "collapse" }}>
<tbody>
<tr style={{ height: "62px" }}>
<td style={{ width: "50%", height: "62px", textAlign: "right" }}>
<a title="Appstore" href="https://apps.apple.com/de/app/scandic-hotels/id1267218985" target="_blank" rel="noopener">
<img src="/imageVault/publishedmedia/1fy3s2u7wrj1bg1lj3y9/app_store_german.png" alt="" />
</a>
</td>
<td style={{ width: "50%", height: "62px", textAlign: "left" }}>
<a title="Google Play" href="https://play.google.com/store/apps/details?id=com.scandichotels.app" target="_blank" rel="noopener">
<img src="/imageVault/publishedmedia/1z4omiwjctzza78u8tmi/android_german.png" alt="" />
</a>
</td>
</tr>
</tbody>
</table>
</div>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">Folgen Sie unseren Social Media Kanälen</h3>
<a href="https://www.facebook.com/scandicgermany" rel="noopener" target="_blank" className="social-media-icon" title="on Facebook">
<svg focusable="false" className="icon icon--facebook icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons facebook-icon">
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a href="https://www.instagram.com/scandichotels/" rel="noopener" target="_blank" className="social-media-icon" title="on Instagram">
<svg focusable="false" className="icon icon--instagram icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons instagram-icon">
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Bewertungen auf</h3>
<img src="/Static/img/tripadvisor_logo_white_160x24.png" alt="Trip Advisor logotype" />
</div>
</div>
</div>
</footer>
)
}

View File

@@ -1,335 +0,0 @@
/* eslint-disable @next/next/no-img-element */
import Script from "next/script";
export default function EnFooter() {
return (
<footer className="global-footer">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<img
src="/Static/img/scandic-logotype-white.svg"
data-js="scandiclogoimg"
alt="Scandic hotels logo"
height="22"
data-nosvgsrc="/Static/img/scandic-logotype-white.png"
/>
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">About Scandic</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Customer Service</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Quick links</div>
</li>
</ul>
<div
data-js-collapsible="global-footer"
className="collapsible-global-footer"
>
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">About Scandic</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/our-company/">
Our company | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/en/category/investors/">
Investors | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/en/sustainability/">
Sustainability | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/media/">
Press room
</a>
</li>
<li>
<a href="https://www.scandichotels.com/work-with-us">
Work with us
</a>
</li>
<li>
<a href="https://www.scandichotels.com/partners">
Partners
</a>
</li>
<li>
<a href="https://www.scandichotels.com/sponsoring">
Sponsoring
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Customer Service</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.com/customer-service">
Contact us
</a>
</li>
<li>
<a href="https://www.scandichotels.com/customer-service/frequently-asked-questions">
FAQ - Frequently Asked Questions
</a>
</li>
<li>
<a href="https://www.scandichotels.com/customer-service/rates-and-policies/cookie-policy">
Cookie Policy
</a>
</li>
<li>
<a href="https://www.scandichotels.com/customer-service/rates-and-policies/privacy-policy">
Privacy Policy
</a>
</li>
<li>
<a href="https://www.scandichotels.com/customer-service/rates-and-policies/website-terms-conditions">
Website Terms & Conditions
</a>
</li>
<li>
<a href="https://www.scandichotels.com/customer-service/rates-and-policies">
Rates and other policies
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Quick links</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.com/hotels">
Hotels & Destinations
</a>
</li>
<li>
<a href="https://www.scandichotels.com/conferences-meetings/better-meetings">
Meeting concept
</a>
</li>
<li>
<a href="https://www.scandichotels.com/explore-scandic">
Explore Scandic
</a>
</li>
<li>
<a href="https://www.scandichotels.com/scandic-friends">
Scandic Friends
</a>
</li>
<li>
<a href="https://www.tripadvisor.com/UserReview-p2178">
Review us on TripAdvisor
</a>
</li>
<li>
<a href="https://www.scandichotels.com/explore-scandic/best-price-guaranteed">
Best Price Guaranteed
</a>
</li>
<li>
<a href="https://www.scandichotels.com/explore-scandic/accessibility">
Special needs
</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<p className="newFooterTitle">
<strong>ABOUT US</strong>
</p>
<div className="padTop15">
<p>
Scandic is the largest Nordic hotel operator with a network of
about 280 hotels with 58,000 hotel rooms in operation and under
development in six countries. Every day over 15 000 team members
go to work with one thought on their mind: to create great hotel
experiences that keep our guests coming back.
</p>
<p style={{ textAlign: "center" }}>
<strong>GET THE SCANDIC APP</strong>
</p>
<table
style={{
height: "62px",
width: "100%",
borderCollapse: "collapse",
}}
>
<tbody>
<tr style={{ height: "62px" }}>
<td
style={{
width: "50%",
height: "62px",
textAlign: "right",
}}
>
<a
title="Appstore"
href="https://apps.apple.com/us/app/scandic-hotels/id1267218985"
target="_blank"
rel="noopener"
>
<img
src="/contentassets/8738808a3a9541d798f95ada5bc92f15/app-store-english.png"
alt=""
/>
</a>
</td>
<td
style={{
width: "50%",
height: "62px",
textAlign: "left",
}}
>
<a
title="Google Play"
href="https://play.google.com/store/apps/details?id=com.scandichotels.app"
target="_blank"
rel="noopener"
>
<img
src="/contentassets/8738808a3a9541d798f95ada5bc92f15/android-english.png"
alt=""
/>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">Follow us on social media</h3>
<a
href="https://www.facebook.com/scandic"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Facebook"
>
<svg
focusable="false"
className="icon icon--facebook icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons facebook-icon"
>
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a
href="https://twitter.com/scandicglobal"
rel="noopener"
target="_blank"
className="social-media-icon"
>
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg
focusable="false"
className="icon icon--twitter icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons twitter-icon"
>
<title id="twitter-icon">Twitter</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a
href="https://www.instagram.com/scandichotels/"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Instagram"
>
<svg
focusable="false"
className="icon icon--instagram icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons instagram-icon"
>
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Reviews from</h3>
<img
src="/Static/img/tripadvisor_logo_white_160x24.png"
alt="Trip Advisor logotype"
/>
</div>
</div>
</div>
</footer>
);
}

View File

@@ -1,323 +0,0 @@
/* eslint-disable @next/next/no-img-element */
import Script from "next/script";
export default function FiFooter() {
return (
<footer className="global-footer">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<img
src="/Static/img/scandic-logotype-white.svg"
data-js="scandiclogoimg"
alt="Scandic hotels logo"
height="22"
data-nosvgsrc="/Static/img/scandic-logotype-white.png"
/>
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">Scandicista</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Asiakaspalvelu</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Pikalinkit</div>
</li>
</ul>
<div
data-js-collapsible="global-footer"
className="collapsible-global-footer"
>
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Scandicista</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/our-company/">
Yrityksemme | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/investors/">
Sijoittajat | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="http://www.scandichotelsgroup.com/fi/media/local-pressroom/finland/">
Mediapankki
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/tyo">
Työ Scandicissa
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/koe-scandic/kestava-kehitys-ja-vastuullisuus">
Vastuullisuus ja kestävä kehitys
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/yhteistyokumppanit">
Yhteistyö
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/sponsorointi">
Sponsorointi
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Asiakaspalvelu</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu">
Ota yhteyttö
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu/usein-kysytyt-kysymykset">
Usein kysytyt kysymykset
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu/hinnat-ja-varausehdot/evasteita-koskevat-ehdot">
Evösteitö koskevat ehdot
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu/hinnat-ja-varausehdot/tietosuojaseloste">
Tietosuojaseloste
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu/hinnat-ja-varausehdot/sivujen-kayttoehdot">
Verkkosivun ehdot ja söönnöt
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/asiakaspalvelu/hinnat-ja-varausehdot">
Hinnat ja varausehdot
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Pikalinkit</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.fi/hotellit">
Hotellit ja kohteet
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/koe-scandic">
Koe Scandic
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/scandic-friends">
Scandic Friends
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/koe-scandic/sports">
Scandic Sports
</a>
</li>
<li>
<a href="https://www.tripadvisor.fi/UserReview-p2178">
Arvioi meitö TripAdvisorissa
</a>
</li>
<li>
<a href="https://www.scandichotels.fi/koe-scandic/parhaan-hinnan-takuu">
Parhaan hinnan takuu
</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<p>
<strong>MEISTÄ</strong>
</p>
<p>
Scandic on Pohjoismaiden suurin hotelliketju, jolla on noin 280
hotellia ja 58 000 huonetta toiminnassa ja kehitteillä kuudessa
maassa. Joka päivä yli 15 000 tiimiläistämme luovat upeita
hotellielämyksiä, jotta hotellivieraamme haluaisivat tulla meille
aina uudestaan.
</p>
<p>
<strong>LATAA SCANDIC-SOVELLUS</strong>
</p>
<table
style={{
width: "100%",
borderCollapse: "collapse",
height: "38px",
}}
>
<tbody>
<tr style={{ height: "38px" }}>
<td
style={{ width: "50%", textAlign: "right", height: "38px" }}
>
<a
title="App storesta"
href="https://apps.apple.com/fi/app/scandic-hotels/id1267218985"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/3x8q0spg79rpnf6tkhl2/app_store_finnish.png"
alt=""
/>
</a>
</td>
<td
style={{ width: "50%", textAlign: "left", height: "38px" }}
>
<a
title="Google Play"
href="https://play.google.com/store/apps/details?id=com.scandichotels.app"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/hmfwx856co5s5rmd2vu1/Android-finnish.png"
alt=""
/>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">
Seuraa meitö sosiaalisessa mediassa
</h3>
<a
href="https://www.facebook.com/scandicsuomi"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Facebook"
>
<svg
focusable="false"
className="icon icon--facebook icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons facebook-icon"
>
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a
href="https://twitter.com/scandicglobal"
rel="noopener"
target="_blank"
className="social-media-icon"
>
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg
focusable="false"
className="icon icon--twitter icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons twitter-icon"
>
<title id="twitter-icon">Twitter</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a
href="https://www.instagram.com/scandichotels/"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Instagram"
>
<svg
focusable="false"
className="icon icon--instagram icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons instagram-icon"
>
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Arviot</h3>
<img
src="/Static/img/tripadvisor_logo_white_160x24.png"
alt="Trip Advisor logotype"
/>
</div>
</div>
</footer>
);
}

View File

@@ -0,0 +1,34 @@
import { FooterNavigationProps } from "@/types/components/current/footer"
import { InternalLink, ExternalLink } from "@/types/requests/footer"
function getLink(linkObject: InternalLink | ExternalLink) {
if (linkObject.__typename === "FooterNavigationLinksInternalLink") {
return {
title: linkObject.internal_link.link_text,
href: linkObject.internal_link.pageConnection.edges[0].node.url,
}
}
return linkObject.external_link.link
}
export default function Navigation({ linkGroups }: FooterNavigationProps) {
return (
<ul className="l-footer-sections global-footer__content__sections">
{linkGroups.map((group) => {
return (
<li className="global-footer-section" key={group.title}>
<div className="link-list">
<h3 className="link-list-header">{group.title}</h3>
<ul className="list-footer-pages">
{group.links.map((link) => {
const linkItem = getLink(link)
return <li key={linkItem.title}>{linkItem.title}</li>
})}
</ul>
</div>
</li>
)
})}
</ul>
)
}

View File

@@ -1,193 +0,0 @@
import Script from "next/script";
export default function NoFooter() {
return (
<footer className="global-footer ">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<img src="/Static/img/scandic-logotype-white.svg" data-js="scandiclogoimg" alt="Scandic hotels logo" height="22" data-nosvgsrc="/Static/img/scandic-logotype-white.png" />
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">Om Scandic</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Kundeservice</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Snarveier</div>
</li>
</ul>
<div data-js-collapsible="global-footer" className="collapsible-global-footer">
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Om Scandic</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/our-company/">Om oss | Scandic Hotels Group AB</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/en/category/investors/">Investorer | Scandic Hotels Group AB</a>
</li>
<li>
<a href="http://www.scandichotelsgroup.com/no/media/local-pressroom/norway/">Presse og media</a>
</li>
<li>
<a href="https://www.scandichotels.no/jobb-hos-oss">Jobb hos oss</a>
</li>
<li>
<a href="https://www.scandichotels.no/partnere">Partnere</a>
</li>
<li>
<a href="https://www.scandichotels.no/vi-sponser">Vi sponser</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Kundeservice</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.no/kundeservice">Kontakt oss</a>
</li>
<li>
<a href="https://www.scandichotels.no/kundeservice/sporsmal-og-svar">Spørsmål og svar</a>
</li>
<li>
<a href="https://www.scandichotels.no/kundeservice/priser-og-bestillingsvilkar/cookie-policy">Cookie Policy</a>
</li>
<li>
<a href="https://www.scandichotels.no/kundeservice/priser-og-bestillingsvilkar/personvernpolicy">Personvern</a>
</li>
<li>
<a href="https://www.scandichotels.no/kundeservice/priser-og-bestillingsvilkar/betingelser-for-nettstedet">Betingelser for nettstedet</a>
</li>
<li>
<a href="https://www.scandichotels.no/kundeservice/priser-og-bestillingsvilkar">Priser og bestillingsvilkår</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Snarveier</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.no/hotell">Hoteller og destinasjoner</a>
</li>
<li>
<a href="https://www.scandichotels.no/utforsk-scandic">Utforsk Scandic</a>
</li>
<li>
<a href="https://www.scandichotels.no/scandic-friends">Om Scandic Friends</a>
</li>
<li>
<a href="https://www.scandichotels.no/utforsk-scandic/garanti-for-beste-pris">Scandics Best Rate Guarantee</a>
</li>
<li>
<a href="https://www.tripadvisor.com/UserReview-p2178">Vurder oss Trip Advisor</a>
</li>
<li>
<a href="https://www.scandichotels.no/utforsk-scandic/spesielle-behov">Spesielle behov</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<h5>OM SCANDIC</h5>
<p>Scandic er Nordens ledende hotellkjede med et nettverk av 280 hoteller, i drift eller under oppføring, fordelt nærmere 58 000 hotellrom i 6 land.</p>
<p>Hver dag går over 15 000 teammedlemmer jobb med én tanke i hodet: å skape gode hotellopplevelser slik at gjestene våre ønsker å komme tilbake.</p>
<p>Som Nordens mest bærekraftige hotellkjede fokuserer vi alltid miljøet, samfunnsansvar og tilgjengelighet.</p>
<h5 style={{ textAlign: "center" }}><strong>LAST NED SCANDICS APP</strong></h5>
<table style={{ width: "100%", borderCollapse: "collapse" }}>
<tbody>
<tr>
<td style={{ width: "50%", textAlign: "right" }}>
<img src="/imageVault/publishedmedia/0tafgfwoub4e11f1ruxe/app_store_norwegian.png" alt="" />
</td>
<td style={{ width: "50%", textAlign: "left" }}>
<img src="/imageVault/publishedmedia/i744peso0pw2dpss4lqs/android_norwegian.png" alt="" />
</td>
</tr>
</tbody>
</table>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">Følg oss sosiale medier</h3>
<a href="https://www.facebook.com/ScandicNorge/" rel="noopener" target="_blank" className="social-media-icon" title="Scandic on Facebook">
<svg focusable="false" className="icon icon--facebook icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons facebook-icon">
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a href="https://twitter.com/scandicglobal" rel="noopener" target="_blank" className="social-media-icon">
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg focusable="false" className="icon icon--twitter icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons twitter-icon">
<title id="twitter-icon">Twitter</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a href="https://www.instagram.com/scandichotels/" rel="noopener" target="_blank" className="social-media-icon" title="Scandic on Instagram">
<svg focusable="false" className="icon icon--instagram icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons instagram-icon">
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Omtaler fra</h3>
<img src="/Static/img/tripadvisor_logo_white_160x24.png" alt="Trip Advisor logotype" />
</div>
</div>
</div>
</footer>
)
}

View File

@@ -1,318 +0,0 @@
/* eslint-disable @next/next/no-img-element */
import Script from "next/script";
export default function SvFooter() {
return (
<footer className="global-footer">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<img
src="/Static/img/scandic-logotype-white.svg"
data-js="scandiclogoimg"
alt="Scandic hotels logo"
height="22"
data-nosvgsrc="/Static/img/scandic-logotype-white.png"
/>
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
<li className="global-footer-section">
<div className="link-list-top-header">Om Scandic Hotels</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Kundservice</div>
</li>
<li className="global-footer-section">
<div className="link-list-top-header">Snabblänkar</div>
</li>
</ul>
<div
data-js-collapsible="global-footer"
className="collapsible-global-footer"
>
<ul className="l-footer-sections global-footer__content__sections">
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Om Scandic Hotels</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotelsgroup.com/sv/vart-foretag/">
Vårt företag | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/sv/sektion/investerare/">
Investerare | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="https://www.scandichotelsgroup.com/sv/hallbarhet/">
Hållbarhet | Scandic Hotels Group AB
</a>
</li>
<li>
<a href="http://www.scandichotelsgroup.com/sv/media/local-pressroom/sweden/">
Pressrum
</a>
</li>
<li>
<a href="https://www.scandichotels.se/jobba-hos-oss">
Jobba hos oss
</a>
</li>
<li>
<a href="https://www.scandichotels.se/vara-samarbetspartner">
Våra samarbetspartner
</a>
</li>
<li>
<a href="https://www.scandichotels.se/vi-sponsrar">
Vi sponsrar
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Kundservice</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.se/kundservice">
Kundservice
</a>
</li>
<li>
<a href="https://www.scandichotels.se/kundservice/fragor-och-svar">
Frågor och svar
</a>
</li>
<li>
<a href="https://www.scandichotels.se/kundservice/priser-och-bokningsregler/bokningsregler">
Bokningsregler
</a>
</li>
<li>
<a href="https://www.scandichotels.se/kundservice/priser-och-bokningsregler/webbplatsvillkor">
Webbplatsvillkor
</a>
</li>
<li>
<a href="https://www.scandichotels.se/kundservice/priser-och-bokningsregler/cookie-policy">
Cookie Policy
</a>
</li>
<li>
<a href="https://www.scandichotels.se/kundservice/priser-och-bokningsregler/integritetspolicy">
Integritetspolicy
</a>
</li>
</ul>
</div>
</li>
<li className="global-footer-section">
<div className="link-list">
<h3 className="link-list-header">Snabblänkar</h3>
<ul className="list-footer-pages">
<li>
<a href="https://www.scandichotels.se/hotell">
Hotell & destinationer
</a>
</li>
<li>
<a href="https://www.scandichotels.se/utforska-scandic">
Utforska Scandic
</a>
</li>
<li>
<a href="https://www.scandichotels.se/scandic-friends">
Scandic Friends
</a>
</li>
<li>
<a href="https://www.tripadvisor.se/UserReview-p2178">
Lämna ditt omdöme TripAdvisor
</a>
</li>
<li>
<a href="https://www.scandichotels.se/utforska-scandic/basta-prisgaranti">
Bästa pris-garanti
</a>
</li>
<li>
<a href="https://www.scandichotels.se/utforska-scandic/speciella-behov">
Speciella behov
</a>
</li>
</ul>
</div>
</li>
</ul>
<div className="global-footer__content__bottom">
<h5>Om Scandic</h5>
<p>
Scandic är den största hotelloperatören i Norden med ett nätverk
av omkring 280 hotell i sex länder, fördelat cirka 58 000
hotellrum i drift och under utveckling. Varje dag arbetar över 15
000 medarbetare med ett enda mål i åtanke: att skapa bra
hotellupplevelser som gör att våra gäster vill komma tillbaka.
<br />
<br />
</p>
<h5 style={{ textAlign: "center" }}>LADDA NER SCANDICS APP</h5>
<table
style={{
height: "62px",
width: "100%",
borderCollapse: "collapse",
}}
>
<tbody>
<tr style={{ height: "62px" }}>
<td
style={{ width: "50%", height: "62px", textAlign: "right" }}
>
<a
title="Appstore"
href="https://apps.apple.com/us/app/scandic-hotels/id1267218985"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/h1atrvlh5w7r4p492z3q/app_store_swedish.png"
alt=""
/>
</a>
</td>
<td
style={{ width: "50%", height: "62px", textAlign: "left" }}
>
<a
title="Google Play"
href="https://play.google.com/store/apps/details?id=com.scandichotels.app"
target="_blank"
rel="noopener"
>
<img
src="/imageVault/publishedmedia/qm0yb8no57jeh33t4wet/android_swedish.png"
alt=""
/>
</a>
</td>
</tr>
</tbody>
</table>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">Följ oss i sociala medier</h3>
<a
href="https://www.facebook.com/scandicsverige"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Facebook"
>
<svg
focusable="false"
className="icon icon--facebook icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons facebook-icon"
>
<title id="facebook-icon">Facebook</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a
href="https://twitter.com/scandicsverige"
rel="noopener"
target="_blank"
className="social-media-icon"
>
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg
focusable="false"
className="icon icon--twitter icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons twitter-icon"
>
<title id="twitter-icon">Twitter</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a
href="https://www.instagram.com/scandichotels/"
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Instagram"
>
<svg
focusable="false"
className="icon icon--instagram icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons instagram-icon"
>
<title id="instagram-icon">Instagram</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">Omdömen från</h3>
<img
src="/Static/img/tripadvisor_logo_white_160x24.png"
alt="Trip Advisor logotype"
/>
</div>
</div>
</div>
</footer>
);
}

View File

@@ -1,29 +1,228 @@
import { langEnum } from "@/types/lang";
import Da from "./Da";
import De from "./De";
import En from "./En";
import Fi from "./Fi";
import No from "./No";
import Sv from "./Sv";
import { request } from "@/lib/request";
import type { LangParams } from "@/types/params";
import { GetFooterData } from "@/types/requests/footer";
import { GetFooter } from "@/lib/graphql/Query/Footer.graphql";
import Script from "next/script";
import Image from "next/image";
import Navigation from "./Navigation";
export default function Footer({ lang }: LangParams) {
switch (lang) {
case langEnum.da:
return <Da />;
case langEnum.de:
return <De />;
case langEnum.en:
return <En />;
case langEnum.fi:
return <Fi />;
case langEnum.no:
return <No />;
case langEnum.sv:
return <Sv />;
default:
return null;
}
export default async function Footer({ lang }: LangParams) {
const response = await request<GetFooterData>(GetFooter, {
locale: lang,
});
const footerData = response.data.all_footer.items[0];
return (
<footer className="global-footer">
<div className="global-footer__content">
<h2 className="global-footer__content__heading">
<Image
src={footerData.logoConnection.edges[0].node.url}
data-js="scandiclogoimg"
alt={footerData.logoConnection.edges[0].node.title}
height="22"
width="102"
data-nosvgsrc="/Static/img/scandic-logotype-white.png" // what here?
/>
<span className="hidden--accessible">Scandic</span>
</h2>
<ul className="l-footer-sections">
{footerData.navigation.map((group) => {
return (
<li className="global-footer-section" key={group.title}>
<div className="link-list-top-header">{group.title}</div>
</li>
)
})}
</ul>
<div data-js-collapsible="global-footer" className="collapsible-global-footer">
<Navigation linkGroups={footerData.navigation} />
<div className="global-footer__content__bottom">
<p className="newFooterTitle">
<strong>{footerData.about.title}</strong>
</p>
<div className="padTop15">
<p>{footerData.about.text}</p>
<p style={{ textAlign: "center" }}>
<strong>{footerData.app_downloads.title}</strong>
</p>
<table
style={{
height: "62px",
width: "100%",
borderCollapse: "collapse",
}}
>
<tbody>
<tr style={{ height: "62px" }}>
<td
style={{
width: "50%",
height: "62px",
textAlign: "right",
}}
>
<a
title="Appstore"
href={footerData.app_downloads.app_store.href}
target="_blank"
rel="noopener"
>
<Image
height={45}
width={135}
src={footerData.app_downloads.app_store.imageConnection.edges[0].node.url}
alt={
footerData.app_downloads.app_store.imageConnection.edges[0].node.title
}
/>
</a>
</td>
<td
style={{
width: "50%",
height: "62px",
textAlign: "left",
}}
>
<a
title="Google Play"
href={footerData.app_downloads.google_play.href}
target="_blank"
rel="noopener"
>
<Image
height={45}
width={135}
src={
footerData.app_downloads.google_play.imageConnection.edges[0].node.url
}
alt={
footerData.app_downloads.google_play.imageConnection.edges[0].node.title
}
/>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<style
dangerouslySetInnerHTML={{
__html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
display: none;
}`,
}}
/>
<p>
<Script
id="inline-script"
dangerouslySetInnerHTML={{
__html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
let removeSavedCardElem = function () {
if (!isNetsHotel) {
return;
}
if (document.querySelector(".credit-card-form__saved-select")) {
if (!document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form").classNameList.add("hidden");
}
document.querySelector(".credit-card-form__saved-select").remove();
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
}
setTimeout( function() {
if (document.querySelector(".credit-card-form__select")) {
document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
document.querySelector(".credit-card-form__select").classNameList.add("hidden");
}
if (document.querySelector(".credit-card-form__new")) {
document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
}
}, 300);
}
removeSavedCardElem();
setTimeout(removeSavedCardElem, 500);
const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
document.querySelector(".save-credit-card__form").style.display = "none";
document.querySelector(".save-credit-card__form").remove();
}`,
}}
/>
</p>
</div>
<div className="global-footer__social-media" id="social-icons">
<h3 className="heading-5 u-uppercase">{footerData.social_media.title}</h3>
<a
href={footerData.social_media.facebook.href}
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Facebook"
>
<svg
focusable="false"
className="icon icon--facebook icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons facebook-icon"
>
<title id="facebook-icon">{footerData.social_media.facebook.title}</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
</svg>
</a>
<a
href={footerData.social_media.twitter.href}
rel="noopener"
target="_blank"
className="social-media-icon"
>
<span className="hidden--accessible">{`Model.SafeGet(m => m.FooterHeader) on Twitter`}</span>
<svg
focusable="false"
className="icon icon--twitter icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons twitter-icon"
>
<title id="twitter-icon">{footerData.social_media.twitter.title}</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-twitter"></use>
</svg>
</a>
<a
href={footerData.social_media.instagram.href}
rel="noopener"
target="_blank"
className="social-media-icon"
title="Scandic on Instagram"
>
<svg
focusable="false"
className="icon icon--instagram icon--white"
viewBox="0 0 150 150"
role="img"
aria-labelledby="social-icons instagram-icon"
>
<title id="instagram-icon">{footerData.social_media.instagram.title}</title>
<use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
</svg>
</a>
</div>
<div className="global-footer__trip-advisor">
<h3 className="heading-5 u-uppercase">{footerData.trip_advisor.title}</h3>
<Image
width={160}
height={24}
src={footerData.trip_advisor.logoConnection.edges[0].node.url}
alt="Trip Advisor logotype"
/>
</div>
</div>
</div>
</footer>
)
}

View File

@@ -19,7 +19,7 @@ fragment ListItemExternalLink on CurrentBlocksPageBlocksListBlockListItemsListIt
}
}
fragment ListItemInternalLink on CurrentBlocksPageBlocksListBlockListItemsListItemInternalLink {
fragment ListItemInternalLink on CurrentBlocksPageBlocksListBlockListItemsListItemInternalLink {
list_item_internal_link {
link_text
list_item_style
@@ -39,7 +39,7 @@ fragment ListItemInternalLink on CurrentBlocksPageBlocksListBlockListItemsListI
fragment ListBlock on CurrentBlocksPageBlocksList {
list {
list_items {
__typename
__typename
...ListItem
...ListItemExternalLink
...ListItemInternalLink

View File

@@ -0,0 +1,27 @@
#import "../Image.graphql"
fragment AppDownloads on Footer {
app_downloads {
title
app_store {
href
imageConnection {
edges {
node {
...Image
}
}
}
}
google_play {
href
imageConnection {
edges {
node {
...Image
}
}
}
}
}
}

View File

@@ -0,0 +1,10 @@
fragment Logo on Footer {
logoConnection {
edges {
node {
title
url
}
}
}
}

View File

@@ -0,0 +1,34 @@
#import "../PageLinks.graphql"
fragment Navigation on Footer {
navigation {
links {
... on FooterNavigationLinksInternalLink {
__typename
internal_link {
link_text
pageConnection {
edges {
node {
__typename
...TempPageLink
...CurrentBlocksPageLink
}
}
}
}
}
... on FooterNavigationLinksExternalLink {
__typename
external_link {
link {
href
title
}
}
}
}
title
}
}

View File

@@ -0,0 +1,17 @@
fragment SocialMedia on Footer {
social_media {
title
facebook {
href
title
}
instagram {
href
title
}
twitter {
href
title
}
}
}

View File

@@ -0,0 +1,14 @@
#import "../Image.graphql"
fragment TripAdvisor on Footer {
trip_advisor {
logoConnection {
edges {
node {
...Image
}
}
}
title
}
}

View File

@@ -14,4 +14,4 @@ fragment Hero on Hero {
}
}
}
}
}

View File

@@ -0,0 +1,13 @@
fragment Image on SysAsset {
description
dimension {
height
width
}
metadata
title
url
system {
uid
}
}

View File

@@ -0,0 +1,26 @@
#import "../Fragments/Footer/AppDownloads.graphql"
#import "../Fragments/Footer/Logo.graphql"
#import "../Fragments/Footer/Navigation.graphql"
#import "../Fragments/Footer/SocialMedia.graphql"
#import "../Fragments/Footer/TripAdvisor.graphql"
query GetFooter($locale: String!) {
all_footer(limit: 1, locale: $locale) {
items {
title
system {
locale
uid
}
about {
text
title
}
...AppDownloads
...Logo
...Navigation
...SocialMedia
...TripAdvisor
}
}
}

View File

@@ -1,10 +1,9 @@
import "server-only"
import { request as graphqlRequest } from "graphql-request"
import { env } from "@/env/server.mjs"
import type { Data } from "@/types/request"
import type { DocumentNode } from "graphql";
import type { DocumentNode } from "graphql"
export async function request<T>(query: string | DocumentNode, variables?: {}): Promise<Data<T>> {
try {
@@ -17,7 +16,7 @@ export async function request<T>(query: string | DocumentNode, variables?: {}):
print(query as DocumentNode),
variables,
{
"access_token": env.CMS_ACCESS_TOKEN,
access_token: env.CMS_ACCESS_TOKEN,
"Content-Type": "application/json",
}
)
@@ -25,8 +24,12 @@ export async function request<T>(query: string | DocumentNode, variables?: {}):
/**
* TODO: Send to Monitoring (Logging and Metrics)
*/
console.log({ complexityLimit: rawResponse.headers.get("x-query-complexity") })
console.log({ referenceDepth: rawResponse.headers.get("x-reference-depth") })
console.log({
complexityLimit: rawResponse.headers.get("x-query-complexity"),
})
console.log({
referenceDepth: rawResponse.headers.get("x-reference-depth"),
})
console.log({ resolverCost: rawResponse.headers.get("x-resolver-cost") })
return {
@@ -37,7 +40,7 @@ export async function request<T>(query: string | DocumentNode, variables?: {}):
const response = await graphqlRequest<T>({
document: query,
requestHeaders: {
"access_token": env.CMS_ACCESS_TOKEN,
access_token: env.CMS_ACCESS_TOKEN,
"Content-Type": "application/json",
},
url: env.CMS_URL,
@@ -49,4 +52,4 @@ export async function request<T>(query: string | DocumentNode, variables?: {}):
console.error(error)
throw new Error("Something went wrong")
}
}
}

View File

@@ -0,0 +1,5 @@
import { NavigationItem } from "@/types/requests/footer"
export type FooterNavigationProps = {
linkGroups: NavigationItem[]
}

View File

@@ -8,12 +8,7 @@ export type Text = {
text: {
content: {
json: RTERootObject
embedded_itemsConnection: Edges<
| ExternalLink
| PageLink
| SysAsset
>
embedded_itemsConnection: Edges<ExternalLink | PageLink | SysAsset>
}
}
}

71
types/requests/footer.ts Normal file
View File

@@ -0,0 +1,71 @@
import type { AllRequestResponse } from "./utils/all"
import type { Edges } from "./utils/edges"
import { Asset } from "./utils/asset"
import { PageLink } from "./utils/pageLink"
type AppDownloadLink = {
title: string
url: string
}
type AppDownload = {
href: string
imageConnection: Edges<Asset>
}
export type InternalLink = {
__typename: "FooterNavigationLinksInternalLink"
internal_link: {
link_text: string
pageConnection: Edges<PageLink>
}
}
export type ExternalLink = {
__typename: "FooterNavigationLinksExternalLink"
external_link: {
link: {
href: string
title: string
}
}
}
export type NavigationItem = {
links: (ExternalLink | InternalLink)[]
title: string
}
type SocialMedium = {
href: string
title: string
}
export type Footer = {
title: string
about: {
title: string
text: string
}
app_downloads: {
title: string
app_store: AppDownload
google_play: AppDownload
}
logoConnection: Edges<Asset>
navigation: NavigationItem[]
social_media: {
title: string
facebook: SocialMedium
instagram: SocialMedium
twitter: SocialMedium
}
trip_advisor: {
title: string
logoConnection: Edges<Asset>
}
}
export type GetFooterData = {
all_footer: AllRequestResponse<Footer>
}