radiantrh/offline.html
2025-12-20 22:43:09 +00:00

86 lines
2.7 KiB
HTML

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mode hors ligne - INTER-SANTÉ</title>
<style>
body {
font-family: 'Segoe UI', sans-serif;
background: linear-gradient(135deg, #f3f2f1 0%, #e6e6e6 100%);
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
padding: 20px;
}
.offline-container {
background: white;
border-radius: 12px;
padding: 40px;
text-align: center;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
max-width: 500px;
width: 100%;
}
.offline-icon {
font-size: 64px;
color: #b7472a;
margin-bottom: 20px;
}
h1 {
color: #b7472a;
margin-bottom: 15px;
}
p {
color: #666;
margin-bottom: 25px;
line-height: 1.6;
}
.actions {
display: flex;
gap: 10px;
justify-content: center;
flex-wrap: wrap;
}
button {
background: #b7472a;
color: white;
border: none;
padding: 12px 24px;
border-radius: 6px;
cursor: pointer;
font-weight: 600;
transition: background 0.3s;
}
button:hover {
background: #a53e24;
}
button.secondary {
background: #2b579a;
}
button.secondary:hover {
background: #1e4a8b;
}
</style>
</head>
<body>
<div class="offline-container">
<div class="offline-icon">📶</div>
<h1>Mode hors ligne</h1>
<p>Vous n'êtes pas connecté à Internet. Certaines fonctionnalités peuvent être limitées.</p>
<p>Vous pouvez continuer à utiliser les fonctionnalités disponibles hors ligne.</p>
<div class="actions">
<button onclick="location.reload()">Réessayer</button>
<button class="secondary" onclick="history.back()">Retour</button>
</div>
<div style="margin-top: 30px; font-size: 14px; color: #999;">
<p>INTER-SANTÉ Portail RH • Version hors ligne</p>
</div>
</div>
</body>
</html>