Modification de Tâches Sites

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <title>Ma ToDo List - Sites Web</title>
  <style>
    body { font-family: Arial, sans-serif; padding: 20px; background: #f8f8f8; }
    h2 { margin-top: 30px; }
    .site-section { background: #fff; padding: 15px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 0 8px rgba(0,0,0,0.1); }
    ul { list-style-type: none; padding-left: 0; }
    li { margin: 5px 0; }
    input[type="checkbox"] { margin-right: 10px; }
    .done { text-decoration: line-through; color: gray; }
  </style>
</head>
<body>

<h1>✅ Ma ToDo List de Sécurité Web</h1>

<div class="site-section">
  <h2>🔒 lesbourdons.ch</h2>
  <ul>
    <li><label><input type="checkbox"> Ajouter le header <code>X-Frame-Options: SAMEORIGIN</code></label></li>
    <li><label><input type="checkbox"> Ajouter le header <code>X-Content-Type-Options: nosniff</code></label></li>
    <li><label><input type="checkbox"> Ajouter <code>Referrer-Policy: strict-origin-when-cross-origin</code></label></li>
    <li><label><input type="checkbox"> Ajouter <code>Strict-Transport-Security</code></label></li>
    <li><label><input type="checkbox"> Forcer redirection HTTPS via .htaccess</label></li>
  </ul>
</div>

<div class="site-section">
  <h2>🔐 mtk-collec.ch</h2>
  <ul>
    <li><label><input type="checkbox"> Vérifier la disponibilité du site à distance</label></li>
    <li><label><input type="checkbox"> Corriger timeout (hébergement sur NAS)</label></li>
    <li><label><input type="checkbox"> Ajouter Content-Security-Policy (et tester C3.js)</label></li>
    <li><label><input type="checkbox"> Corriger Referrer-Policy: utiliser <code>strict-origin-when-cross-origin</code></label></li>
  </ul>
</div>

<div class="site-section">
  <h2>🎨 amecreative.ch</h2>
  <ul>
    <li><label><input type="checkbox"> Vérifier tous les headers de sécurité</label></li>
    <li><label><input type="checkbox"> Activer <code>Strict-Transport-Security</code></label></li>
    <li><label><input type="checkbox"> Ajouter Permissions-Policy pour bloquer micro/caméra</label></li>
    <li><label><input type="checkbox"> Tester sur <a href="https://securityheaders.com" target="_blank">securityheaders.com</a></label></li>
  </ul>
</div>

<script>
  // Marquer les tâches cochées comme "faites"
  document.querySelectorAll('input[type="checkbox"]').forEach(cb => {
    cb.addEventListener('change', () => {
      cb.parentElement.classList.toggle('done', cb.checked);
    });
  });
</script>

</body>
</html>