274 lines
15 KiB
HTML
274 lines
15 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="fr">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|||
|
|
<meta name="msapplication-TileColor" content="#603cba">
|
|||
|
|
<meta name="msapplication-config" content="./favicons/browserconfig.xml">
|
|||
|
|
<meta name="theme-color" content="#ffffff">
|
|||
|
|
<meta name="title" content="Générateur d'attestation de déplacement dérogatoire - COVID-19">
|
|||
|
|
<meta name="description" content="Ce service officiel génère une version numérique de l’attestation déplacement covid-19 à présenter aux forces de sécurité lors d’un contrôle.">
|
|||
|
|
<meta name="keywords" content="covid19, covid-19, attestation, déplacement, officielle, gouvernement">
|
|||
|
|
<meta name="robots" content="index, follow">
|
|||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|||
|
|
<meta name="language" content="French">
|
|||
|
|
<meta property="og:title" content="Générateur d'attestation de déplacement dérogatoire - COVID-19" />
|
|||
|
|
<meta property="og:locale" content="fr_FR" />
|
|||
|
|
<meta property="og:description" content="Ce service officiel génère une version numérique de l’attestation déplacement covid-19 à présenter aux forces de sécurité lors d’un contrôle." />
|
|||
|
|
<link rel="canonical" href="https://media.interieur.gouv.fr/deplacement-covid-19/" />
|
|||
|
|
<meta property="og:url" content="https://media.interieur.gouv.fr/deplacement-covid-19/" />
|
|||
|
|
<meta property="og:site_name" content="Générateur d'attestation de déplacement dérogatoire - COVID-19" />
|
|||
|
|
<script type='application/ld+json'>{"@context":"http://www.schema.org","@type":"GovernmentOrganization","name":"Générateur d'attestation de déplacement dérogatoire - COVID-19","description":"Ce service officiel génère une version numérique de l’attestation déplacement covid-19 à présenter aux forces de sécurité lors d’un contrôle.","address":{"@type":"PostalAddress","addressCountry":"France"}}</script>
|
|||
|
|
|
|||
|
|
<link rel="apple-touch-icon" sizes="180x180" href="./favicons/apple-touch-icon.png">
|
|||
|
|
<link rel="icon" type="image/png" sizes="32x32" href="./favicons/favicon-32x32.png">
|
|||
|
|
<link rel="icon" type="image/png" sizes="16x16" href="./favicons/favicon-16x16.png">
|
|||
|
|
<link rel="manifest" href="./favicons/site.webmanifest">
|
|||
|
|
<link rel="mask-icon" href="./favicons/safari-pinned-tab.svg" color="#21bf73">
|
|||
|
|
|
|||
|
|
<title>COVID-19 – Générateur d'attestation de déplacement dérogatoire</title>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<header class="wrapper">
|
|||
|
|
<img class="logo" src="/MIN_Interieur_RVB.svg" alt="">
|
|||
|
|
<div>
|
|||
|
|
<h1 class="flex flex-wrap">
|
|||
|
|
<span class="covid-title">
|
|||
|
|
COVID-19
|
|||
|
|
</span>
|
|||
|
|
<span class="covid-subtitle">
|
|||
|
|
Générateur d'attestation de déplacement dérogatoire
|
|||
|
|
</span>
|
|||
|
|
</h1>
|
|||
|
|
<p class="text-alert">
|
|||
|
|
Les données saisies sont stockées exclusivement sur votre téléphone ou votre ordinateur. Aucune information n'est collectée par le Ministère de l'Intérieur.
|
|||
|
|
L'attestation pdf générée contient un QR Code. Ce code-barres graphique permet de lire les informations portées dans votre attestation au moment de leur saisie.
|
|||
|
|
Il peut être déchiffré à l'aide de tout type de lecteur de QR code générique.
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
<div class="wrapper">
|
|||
|
|
|
|||
|
|
<form id="form-profile">
|
|||
|
|
<h2 class="titre-2">Remplissez en ligne votre attestation numérique :</h2>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-firstname" id="field-firstname-label">Prénom</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-firstname"
|
|||
|
|
name="firstname"
|
|||
|
|
autocomplete="given-name"
|
|||
|
|
placeholder="Jean"
|
|||
|
|
aria-labelledby="field-firstname-label"
|
|||
|
|
required
|
|||
|
|
autofocus
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-lastname" id="field-lastname-label">Nom</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-lastname"
|
|||
|
|
name="lastname"
|
|||
|
|
autocomplete="family-name"
|
|||
|
|
placeholder="Dupont"
|
|||
|
|
aria-labelledby="field-lastname-label"
|
|||
|
|
required
|
|||
|
|
autofocus
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-birthday" id="field-birthday-label">Date de naissance (au format jj/mm/aaaa)</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
inputmode="numeric"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-birthday"
|
|||
|
|
name="birthday"
|
|||
|
|
autocomplete="bday"
|
|||
|
|
placeholder="01/01/1970"
|
|||
|
|
maxlength="10"
|
|||
|
|
aria-labelledby="field-birthday-label"
|
|||
|
|
required
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-lieunaissance" id="field-lieunaissance-label">Lieu de naissance</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-lieunaissance"
|
|||
|
|
name="lieunaissance"
|
|||
|
|
aria-labelledby="field-lieunaissance-label"
|
|||
|
|
placeholder="Lyon"
|
|||
|
|
required
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-address" id="field-address-label">Adresse</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-address"
|
|||
|
|
name="address"
|
|||
|
|
autocomplete="address-line1"
|
|||
|
|
aria-labelledby="field-address-label"
|
|||
|
|
placeholder="999 avenue de france"
|
|||
|
|
required
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-town" id="field-town-label">Ville</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="text"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-town"
|
|||
|
|
name="town"
|
|||
|
|
autocomplete="address-level1"
|
|||
|
|
aria-labelledby="field-town-label"
|
|||
|
|
placeholder="Paris"
|
|||
|
|
required
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-zipcode" id="field-zipcode-label" >Code Postal</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input
|
|||
|
|
type="number"
|
|||
|
|
min="00000"
|
|||
|
|
max="99999"
|
|||
|
|
class="form-control"
|
|||
|
|
id="field-zipcode"
|
|||
|
|
name="zipcode"
|
|||
|
|
autocomplete="zipcode"
|
|||
|
|
minlength="4"
|
|||
|
|
maxlength="5"
|
|||
|
|
aria-labelledby="field-zipcode-label"
|
|||
|
|
placeholder="75001"
|
|||
|
|
required
|
|||
|
|
>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
<p class="exemple"></p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<h3>Choisissez un motif de sortie</h3>
|
|||
|
|
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-travail" value="travail">
|
|||
|
|
<label class="form-check-label" for="checkbox-travail">Déplacements entre le domicile et le lieu d’exercice de l’activité professionnelle, lorsqu'ils sont indispensables à l'exercice d’activités ne pouvant être organisées sous forme de télétravail ou déplacements professionnels ne pouvant être différés.</label>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-courses" value="courses">
|
|||
|
|
<label class="form-check-label" for="checkbox-courses">Déplacements pour effectuer des achats de fournitures nécessaires à l’activité professionnelle et des achats de première nécessité dans des établissements dont les activités demeurent autorisées <a href="https://www.service-public.fr/particuliers/actualites/A13921" target="_blank">(liste sur gouvernement.fr)</a>.</label>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-sante" value="sante">
|
|||
|
|
<label class="form-check-label" for="checkbox-sante">Consultations et soins ne pouvant être assurés à distance et ne pouvant être différés ; consultations et soins des patients atteints d'une affection de longue durée.</label>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-famille" value="famille">
|
|||
|
|
<label class="form-check-label" for="checkbox-famille">Déplacements pour motif familial impérieux, pour l’assistance aux personnes vulnérables ou la garde d’enfants.</label>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-sport" value="sport">
|
|||
|
|
<label class="form-check-label" for="checkbox-sport">Déplacements brefs, dans la limite d'une heure quotidienne et dans un rayon maximal d'un kilomètre autour du domicile, liés soit à l'activité physique individuelle des personnes, à l'exclusion de toute pratique sportive collective et de toute proximité avec d'autres personnes, soit à la promenade avec les seules personnes regroupées dans un même domicile, soit aux besoins des animaux de compagnie.</label>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-judiciaire" value="judiciaire">
|
|||
|
|
<label class="form-check-label" for="checkbox-judiciaire">Convocation judiciaire ou administrative.</label>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-check">
|
|||
|
|
<input class="form-check-input" type="checkbox" name="field-reason" id="checkbox-missions" value="missions">
|
|||
|
|
<label class="form-check-label" for="checkbox-missions">Participation à des missions d’intérêt général sur demande de l’autorité administrative.</label>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-datesortie">Date de sortie</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input type="date" class="form-control" id="field-datesortie" name="datesortie" placeholder="JJ/MM/YYYY" required>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group">
|
|||
|
|
<label for="field-heure">Heure de sortie</label>
|
|||
|
|
<div class="input-group align-items-center">
|
|||
|
|
<input type="time" class="form-control" id="field-heuresortie" name="heure" required>
|
|||
|
|
<span class="validity"></span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<p class="text-center mt-5">
|
|||
|
|
<button type="submit" class="btn btn-primary btn-attestation"> <span class="btn-text">Générer mon attestation</span></button>
|
|||
|
|
</p>
|
|||
|
|
<div class="bg-primary d-none" id="snackbar">
|
|||
|
|
L'attestation est téléchargée sur votre appareil.
|
|||
|
|
</div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<div class="">
|
|||
|
|
<p class="label-mi">
|
|||
|
|
Ministère de l'Intérieur - DNUM - SDIT
|
|||
|
|
</p>
|
|||
|
|
<img class="center" src="/logo_dnum.svg" alt="logo dnum">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<footer class="main-footer">
|
|||
|
|
<div class="footer-links">
|
|||
|
|
<a href="./confidentialite.html" title="Confidentialité - nouvelle page" target="_blank" class="footer-link">Confidentialité</a>
|
|||
|
|
<a href="https://www.interieur.gouv.fr/Infos-du-site/Mentions-legales" title="Mentions légales - nouvelle page" target="_blank" class="footer-link">Mentions légales</a>
|
|||
|
|
<a href="https://www.gouvernement.fr/info-coronavirus" title="Information du gouvernement sur le Covid-19 - nouvelle page" target="_blank" class="footer-link">Informations du gouvernement sur le Covid-19</a>
|
|||
|
|
<div class="footer-link" >Plus d’infos au<a class="num-08" href="tel:0800130000"> 0 800 130 000</a></div>
|
|||
|
|
<p class="footer-link" id="version"></p>
|
|||
|
|
</div>
|
|||
|
|
</footer>
|
|||
|
|
|
|||
|
|
<div class="alert alert-danger d-none" role="alert" id="alert-facebook">
|
|||
|
|
ATTENTION !! Vous utilisez actuellement le navigateur Facebook, ce générateur ne fonctionne pas correctement au
|
|||
|
|
sein de ce navigateur ! Merci d'ouvrir Chrome sur Android ou bien Safari sur iOS.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<script src="./certificate.js"></script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|