62 lines
2.7 KiB
HTML
62 lines
2.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
|
<title>Cocotte</title>
|
|
<meta name="robots" content="noindex,nofollow" />
|
|
<link rel="alternate" hreflang="en" href="./en/" />
|
|
<link rel="alternate" hreflang="fr" href="./fr/" />
|
|
<link rel="alternate" hreflang="x-default" href="./en/" />
|
|
<link rel="stylesheet" href="./_shared.css" />
|
|
<style>
|
|
/* Lang splash: visible page with mark + lang picker.
|
|
* JS auto-redirects after a short delay (preserves the original behavior).
|
|
* Without JS, splash stays — user picks a language manually. */
|
|
body { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; }
|
|
.splash-mark { font-family: var(--display, "Cormorant Garamond", "Times New Roman", serif); font-size: clamp(48px, 8vw, 88px); line-height: 1; letter-spacing: -0.01em; margin: 0 0 12px; color: var(--ink, #1a1a1a); }
|
|
.splash-lede { font-size: 14px; color: var(--ink-2, #555); margin: 0 0 48px; letter-spacing: .04em; text-align: center; }
|
|
.splash-lang { display: flex; gap: 0; align-items: center; }
|
|
.splash-lang a {
|
|
font-family: var(--display, "Cormorant Garamond", "Times New Roman", serif);
|
|
font-size: 22px;
|
|
letter-spacing: .02em;
|
|
color: var(--ink, #1a1a1a);
|
|
text-decoration: none;
|
|
padding: 14px 36px;
|
|
border-bottom: 1px solid transparent;
|
|
transition: border-bottom-color .15s;
|
|
}
|
|
.splash-lang a:hover { border-bottom-color: var(--accent, #c00060); }
|
|
.splash-lang .sep { color: var(--ink-2, #ccc); font-size: 14px; padding: 0 4px; }
|
|
.splash-foot { margin-top: 64px; font-size: 11px; color: var(--ink-2, #999); letter-spacing: .14em; text-transform: uppercase; }
|
|
</style>
|
|
<script>
|
|
(function () {
|
|
if (window.localStorage) localStorage.removeItem("cocotte.lang");
|
|
var langs = (navigator.languages && navigator.languages.length)
|
|
? navigator.languages
|
|
: [navigator.language || "en"];
|
|
var wantsFr = langs.some(function (l) {
|
|
return String(l).toLowerCase().indexOf("fr") === 0;
|
|
});
|
|
/* Slight delay so the splash mark is briefly visible — gives the visitor
|
|
* a sense of the brand before redirecting. */
|
|
setTimeout(function () {
|
|
location.replace(wantsFr ? "./fr/" : "./en/");
|
|
}, 400);
|
|
})();
|
|
</script>
|
|
<noscript><meta http-equiv="refresh" content="3;url=./en/" /></noscript>
|
|
</head>
|
|
<body>
|
|
<h1 class="splash-mark">Cocotte</h1>
|
|
<p class="splash-lede">Choose your language · Choisissez votre langue</p>
|
|
<nav class="splash-lang">
|
|
<a href="./en/" hreflang="en">English</a>
|
|
<span class="sep">·</span>
|
|
<a href="./fr/" hreflang="fr">Français</a>
|
|
</nav>
|
|
<p class="splash-foot">— The House of Cocotte</p>
|
|
</body>
|
|
</html>
|