feat(WEB-38, WEB-9, WEB-19): add static page for sponsoring, add Header and add Footer

This commit is contained in:
Christel Westerberg
2024-01-12 16:03:50 +01:00
parent 0a208923f8
commit bb90e2bf50
69 changed files with 3739 additions and 27 deletions

View File

@@ -0,0 +1,323 @@
/* 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>
);
}