mirror of
https://github.com/betagouv/mon-entreprise
synced 2025-02-08 21:05:01 +00:00
3c3da81238
Nous générons deux bundles à partir de notre code JavaScript, un pour les navigateurs modernes et un pour les anciens navigateurs. Vu que notre site est statique nous utilisons la technique de l'attribut module/nomodule dans la balise script pour que le navigateur télécharge la bonne version du bundle. Safari 10.1 ne supportant pas l'attribut nomodule, nous utilisions une prothèse pour ajouter ce support. Il semble que ce code ne fonctionnait pas bien car c'est toujours la version "legacy" du bundle qui était utilisée sur les versions modernes de Safari (11, 12, 13). Il y a actuellement un problème de Tracking sur la version Legacy suite à la migration vers Typescript. J'ai du mal à comprendre d'où vient le problème, mais en attendant un premier remède consiste à servir la version normale du bundle aux navigateurs Safari récents. Note: il semble que Safari téléchargeait les deux bundles ! Ce commit devrait donc baisser significativement le volume de fichiers à télécharger.
319 lines
8 KiB
HTML
319 lines
8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<base href="/" />
|
|
<meta name="viewport" content="initial-scale=1" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="180x180"
|
|
href="/favicon/apple-touch-icon.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="32x32"
|
|
href="/favicon/favicon-32x32.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="16x16"
|
|
href="/favicon/favicon-16x16.png"
|
|
/>
|
|
<link rel="shortcut icon" href="/favicon/favicon.ico" />
|
|
<meta name="msapplication-TileColor" content="#da532c" />
|
|
<meta name="msapplication-config" content="/favicon/browserconfig.xml" />
|
|
|
|
<meta
|
|
name="google-site-verification"
|
|
content="y1B_PVRQAlMoLd7La3AlOt_0Ja8Lp-lrkoXGat9-uMA"
|
|
/>
|
|
<meta
|
|
name="google-site-verification"
|
|
content="C03WwnrJP0FLqf83ibMBA7_N-TLQcwsJaAhqKXppxaE"
|
|
/>
|
|
<meta
|
|
name="google-site-verification"
|
|
content="QciT8g0vom7kg0Qz6aFIS9s_5r7-21ip0Ho6cuEN1KA"
|
|
/>
|
|
<!-- vérification pour Bing Webmaster -->
|
|
<meta name="msvalidate.01" content="65161AFDF93A706CED3F68C7621C00D7" />
|
|
<meta
|
|
name="description"
|
|
content="<%= htmlWebpackPlugin.options.description %>"
|
|
data-react-helmet="true"
|
|
/>
|
|
<meta property="og:type" content="website" />
|
|
<meta
|
|
property="og:title"
|
|
content="<%= htmlWebpackPlugin.options.title %>"
|
|
/>
|
|
<meta
|
|
property="og:description"
|
|
content="<%= htmlWebpackPlugin.options.description %>"
|
|
/>
|
|
|
|
<meta
|
|
property="og:image"
|
|
content="<%= htmlWebpackPlugin.options.shareImage %>"
|
|
/>
|
|
<!-- data-helmet pour que React Helmet puisse écraser ce meta par défaut -->
|
|
<link
|
|
href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,600|Montserrat:400,600"
|
|
rel="stylesheet"
|
|
type="text/css"
|
|
/>
|
|
<link rel="manifest" href="/manifest.webmanifest" />
|
|
<title>
|
|
<%= htmlWebpackPlugin.options.title %>
|
|
</title>
|
|
|
|
<% for (var css in htmlWebpackPlugin.files.css) { %>
|
|
<link href="<%= htmlWebpackPlugin.files.css[css] %>" rel="stylesheet" />
|
|
<% } %>
|
|
<style>
|
|
html[data-useragent*='MSIE'] #outdated-browser,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/8']
|
|
#outdated-browser,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/7']
|
|
#outdated-browser,
|
|
html[data-useragent*='Trident'] #outdated-browser {
|
|
display: block !important;
|
|
}
|
|
|
|
html[data-useragent*='MSIE'] #loading,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/8'] #loading,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/7'] #loading,
|
|
html[data-useragent*='Trident'] #loading {
|
|
display: none !important;
|
|
}
|
|
|
|
html[data-useragent*='MSIE'] #js,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/8'] #js,
|
|
html[data-useragent*='Safari'][data-useragent*='Version/7'] #js,
|
|
html[data-useragent*='Trident'] #js {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Prevent FOUC effect */
|
|
#js {
|
|
opacity: 0;
|
|
}
|
|
|
|
/* CSS Loader */
|
|
|
|
#loading {
|
|
animation: appear 0.6s;
|
|
transform: translateY(35vh);
|
|
width: 100%;
|
|
}
|
|
#lds-ellipsis {
|
|
margin: auto;
|
|
position: relative;
|
|
width: 64px;
|
|
animation: appear 1.5s;
|
|
height: 64px;
|
|
}
|
|
#lds-ellipsis div {
|
|
position: absolute;
|
|
top: 27px;
|
|
width: 11px;
|
|
height: 11px;
|
|
border-radius: 50%;
|
|
background: rgb(41, 117, 209);
|
|
animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
|
}
|
|
|
|
#lds-ellipsis div:nth-child(1) {
|
|
left: 6px;
|
|
animation: lds-ellipsis1 0.6s infinite;
|
|
}
|
|
|
|
#lds-ellipsis div:nth-child(2) {
|
|
left: 6px;
|
|
animation: lds-ellipsis2 0.6s infinite;
|
|
}
|
|
|
|
#lds-ellipsis div:nth-child(3) {
|
|
left: 26px;
|
|
animation: lds-ellipsis2 0.6s infinite;
|
|
}
|
|
|
|
#lds-ellipsis div:nth-child(4) {
|
|
left: 45px;
|
|
animation: lds-ellipsis3 0.6s infinite;
|
|
}
|
|
|
|
@keyframes appear {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
80% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes lds-ellipsis1 {
|
|
0% {
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes lds-ellipsis3 {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
transform: scale(0);
|
|
}
|
|
}
|
|
|
|
@keyframes lds-ellipsis2 {
|
|
0% {
|
|
transform: translate(0, 0);
|
|
}
|
|
100% {
|
|
transform: translate(19px, 0);
|
|
}
|
|
}
|
|
</style>
|
|
<meta name="theme-color" content="#2975d1" />
|
|
</head>
|
|
|
|
<body>
|
|
<div id="loading">
|
|
<img
|
|
src="<%= htmlWebpackPlugin.options.logo %>"
|
|
alt="Un service de l'État français"
|
|
style="width: 300px; margin: auto; margin-bottom: 0.6rem; display:block"
|
|
/>
|
|
<div id="lds-ellipsis">
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- USER AGENT DATA ATTRIBUTE -->
|
|
<script>
|
|
var b = document.documentElement
|
|
b.setAttribute('data-useragent', navigator.userAgent)
|
|
</script>
|
|
|
|
<!-- APP -->
|
|
<div id="js"></div>
|
|
|
|
<!-- OUTDATED BROWSER WARNING -->
|
|
<div
|
|
id="outdated-browser"
|
|
style="position: fixed; top: 0; left: 0; bottom: 0; right: 0; display: none; background-color: white"
|
|
>
|
|
<div
|
|
style="margin: 100px auto; max-width: 800px; text-align: center; font-family: 'Montserrat', sans-serif; font-weight: 300;"
|
|
>
|
|
<img
|
|
src="images/marianne.svg"
|
|
alt="Un service de l'État français"
|
|
style="width: 200px; margin-bottom: 2rem;"
|
|
/>
|
|
<h1>
|
|
Votre navigateur n'est plus supporté.
|
|
</h1>
|
|
<h2>
|
|
Nous vous invitons à réessayer avec un autre, ou depuis un mobile
|
|
récent.
|
|
</h2>
|
|
<br />
|
|
<br />
|
|
<h3>
|
|
Si besoin, vous pouvez en installer un nouveau depuis
|
|
<a style="color: #2975d1" href="http://outdatedbrowser.com/fr"
|
|
>cette page</a
|
|
>
|
|
</h3>
|
|
<h3>
|
|
<a
|
|
href="javascript:void(0);"
|
|
onclick="
|
|
var b = document.documentElement;
|
|
b.setAttribute('data-useragent', 'force-navigation-anyway');
|
|
"
|
|
>Continuer quand même vers le site</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
<!-- Matomo : track only production code-->
|
|
<% if (htmlWebpackPlugin.options.injectTrackingScript) { %>
|
|
<script type="text/javascript">
|
|
var _paq = window._paq || []
|
|
_paq.push([
|
|
function() {
|
|
var self = this
|
|
function getOriginalVisitorCookieTimeout() {
|
|
var now = new Date(),
|
|
nowTs = Math.round(now.getTime() / 1000),
|
|
visitorInfo = self.getVisitorInfo()
|
|
var createTs = parseInt(visitorInfo[2])
|
|
var cookieTimeout = 33696000 // 13 mois en secondes
|
|
var originalTimeout = createTs + cookieTimeout - nowTs
|
|
return originalTimeout
|
|
}
|
|
this.setVisitorCookieTimeout(getOriginalVisitorCookieTimeout())
|
|
}
|
|
])
|
|
|
|
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
|
|
_paq.push(['setDocumentTitle', document.domain + '/' + document.title])
|
|
_paq.push([
|
|
'setDomains',
|
|
['*.mon-entreprise.fr', '*.mycompanyinfrance.fr']
|
|
])
|
|
_paq.push(['trackPageView'])
|
|
_paq.push(['enableHeartBeatTimer', 30])
|
|
_paq.push(['enableLinkTracking'])
|
|
;(function() {
|
|
var u = 'https://stats.data.gouv.fr/'
|
|
_paq.push(['setTrackerUrl', u + 'piwik.php'])
|
|
_paq.push(['setSiteId', '39'])
|
|
var d = document,
|
|
g = d.createElement('script'),
|
|
s = d.getElementsByTagName('script')[0]
|
|
g.type = 'text/javascript'
|
|
g.async = true
|
|
g.defer = true
|
|
g.src = u + 'piwik.js'
|
|
s.parentNode.insertBefore(g, s)
|
|
})()
|
|
</script>
|
|
<% } %>
|
|
<!-- End Matomo Code -->
|
|
|
|
<% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
|
|
<script
|
|
type="module"
|
|
src="<%= htmlWebpackPlugin.files.chunks[chunk].entry %>"
|
|
></script>
|
|
<% } %>
|
|
|
|
<!-- Polyfill and source for old browser -->
|
|
<!-- Add polyfill.io for a very narrow web feature
|
|
IntersectionObserver : SAFARI 11 & 12.0 https://caniuse.com/#search=intersectionobserver
|
|
Intl : SAFARI 9 & 10.0 https://caniuse.com/#search=Intl
|
|
-->
|
|
<script src="https://polyfill.io/v3/polyfill.min.js?features=Intl.~locale.en%2CIntl.~locale.fr%2CIntersectionObserver"></script>
|
|
<% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
|
|
<script nomodule src="<%= chunk %>.legacy.bundle.js"></script>
|
|
<% } %>
|
|
</body>
|
|
</html>
|