Nos partenaires

Actualités du mois

Articles en UNE

Actus zataz

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">

<div id="dsb-launcher" aria-label="Ouvrir le menu Data Security Breach" title="Ouvrir le menu Data Security Breach">DSB</div>

<div id="dsb-floating-popup" class="dsb-popup dsb-open" aria-label="Menu flottant Data Security Breach">
  <div id="dsb-popup-header" class="dsb-popup-header">
    <span class="dsb-title">DATA SECURITY BREACH</span>

    <button id="dsb-popup-bookmark" class="dsb-top-btn dsb-bookmark-btn" type="button" aria-label="Bookmarker cette popup" title="Bookmarker cette popup">
      ★
    </button>
  </div>

  <div id="dsb-popup-body" class="dsb-popup-body">
    <div class="dsb-main-actions">
      <a class="dsb-btn dsb-main-btn" href="https://www.datasecuritybreach.fr" target="_blank" rel="noopener noreferrer">
        DATA SECURITY BREACH
      </a>

      <div class="dsb-btn-row">
        <a class="dsb-btn dsb-third-btn" href="mailto:newsletter@datasecuritybreach.fr?subject=Inscription%20news%20letter%20Data%20Security%20Breach">
          News letter
        </a>

        <a class="dsb-btn dsb-third-btn" href="https://www.datasecuritybreach.fr" target="_blank" rel="noopener noreferrer">
          Le site
        </a>
      </div>

      <div class="dsb-tooltip-wrap" id="dsb-tooltip-wrap">
        <a class="dsb-btn dsb-emergency-btn" href="https://www.datasecuritybreach.fr" target="_blank" rel="noopener noreferrer" aria-label="Besoin d'une aide cyber">
          Besoin d'une aide cyber ?
        </a>

        <span class="dsb-tooltip" id="dsb-tooltip">
          <strong><u>Data Security Breach ne fait aucune sollicitation par téléphone.</u></strong><br>
          Pour toute demande, merci d’utiliser le site officiel.<br>
          Indiquez un mail valide pour être recontacté.
        </span>
      </div>
    </div>
  </div>

  <div id="dsb-bookmark-message" class="dsb-bookmark-message" aria-live="polite">
    <strong>Bookmarker cette popup Data Security Breach</strong><br>
    Appuyez sur <span id="dsb-bookmark-shortcut">Ctrl + D</span> pour ajouter cette page à vos favoris.
  </div>
</div>

<style>
  #dsb-launcher,
  #dsb-floating-popup,
  #dsb-floating-popup * {
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Arial, sans-serif;
  }

  #dsb-launcher {
    position: fixed;
    right: 16px;
    bottom: 16px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2147483645;
    color: #fff7e8;
    font-weight: 900;
    font-size: 15px;
    letter-spacing: 0.5px;
    background: linear-gradient(180deg, #ff9b2f, #e66f12);
    border: 1px solid rgba(255, 247, 232, 0.45);
    box-shadow: 0 14px 32px rgba(0, 26, 46, 0.55);
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

  #dsb-launcher.dsb-visible {
    display: flex;
  }

  #dsb-floating-popup.dsb-popup {
    --dsb-scale: 0.68;

    position: fixed;
    top: 88px;
    right: 24px;
    width: 480px;
    max-width: calc(100vw - 20px);
    border-radius: 16px;
    z-index: 2147483646;
    color: #eef9ff;
    background:
      radial-gradient(circle at top left, rgba(255, 140, 35, 0.16), transparent 38%),
      linear-gradient(180deg, #063b5c, #021f33 62%, #011827);
    border: 1px solid rgba(128, 214, 255, 0.20);
    box-shadow:
      0 20px 48px rgba(0, 20, 36, 0.62),
      0 8px 22px rgba(0, 20, 36, 0.42),
      inset 0 1px 0 rgba(255, 255, 255, 0.08);
    overflow: hidden;
    display: block;
    -webkit-tap-highlight-color: transparent;
    transform: scale(var(--dsb-scale));
    transform-origin: top left;
    will-change: left, top, transform;
  }

  .dsb-popup-header {
    height: 54px;
    display: grid;
    grid-template-columns: 1fr 36px;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    cursor: move;
    user-select: none;
    -webkit-user-select: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.035));
    border-bottom: 1px solid rgba(128, 214, 255, 0.16);
    touch-action: none;
  }

  .dsb-title {
    text-align: center;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 1.2px;
    color: #eef9ff;
    text-transform: uppercase;
  }

  .dsb-top-btn {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(128, 214, 255, 0.22);
    border-radius: 9px;
    background: linear-gradient(180deg, #07476e, #032a45);
    color: #eef9ff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    font-weight: 900;
    line-height: 1;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 6px 13px rgba(0, 20, 36, 0.32);
  }

  .dsb-bookmark-btn {
    font-size: 18px;
    color: #ffbd73;
  }

  .dsb-top-btn:hover {
    filter: brightness(1.12);
  }

  .dsb-popup-body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .dsb-main-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .dsb-btn-row {
    display: flex;
    gap: 9px;
    width: 100%;
  }

  .dsb-btn {
    display: flex;
    width: 100%;
    min-height: 46px;
    padding: 12px;
    text-decoration: none;
    text-align: center;
    border-radius: 11px;
    font-size: 19px;
    font-weight: 750;
    letter-spacing: 0.15px;
    color: #eef9ff;
    background: linear-gradient(180deg, rgba(7, 71, 110, 0.95), rgba(3, 42, 69, 0.95));
    border: 1px solid rgba(128, 214, 255, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 9px 17px rgba(0, 20, 36, 0.28);
    transition: transform 0.18s ease, filter 0.18s ease, box-shadow 0.18s ease;
    align-items: center;
    justify-content: center;
    line-height: 1.15;
  }

  .dsb-third-btn {
    flex: 1 1 50%;
    font-size: 17px;
  }

  .dsb-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.08);
  }

  .dsb-main-btn {
    background: linear-gradient(180deg, #ff9b2f, #e66f12);
    color: #061f32;
    border: 1px solid rgba(255, 247, 232, 0.38);
    box-shadow:
      inset 0 1px 0 rgba(255, 247, 232, 0.42),
      0 10px 22px rgba(230, 111, 18, 0.32);
    animation: dsbPremiumBreath 2.6s ease-in-out infinite;
  }

  .dsb-main-btn:hover {
    background: linear-gradient(180deg, #ffad4d, #f07b18);
    box-shadow:
      inset 0 1px 0 rgba(255, 247, 232, 0.46),
      0 12px 25px rgba(230, 111, 18, 0.42);
  }

  @keyframes dsbPremiumBreath {
    0%, 100% {
      transform: scale(1);
      opacity: 0.97;
    }

    50% {
      transform: scale(1.018);
      opacity: 1;
    }
  }

  .dsb-emergency-btn {
    background: linear-gradient(180deg, #eef9ff, #bfeaff);
    color: #06304c;
    border: 1px solid rgba(255, 155, 47, 0.32);
    font-weight: 900;
  }

  .dsb-emergency-btn:hover {
    background: linear-gradient(180deg, #ffffff, #d8f4ff);
    color: #021f33;
  }

  .dsb-tooltip-wrap {
    position: relative;
    width: 100%;
  }

  .dsb-tooltip {
    position: static;
    display: none;
    width: 100%;
    margin-top: 8px;
    padding: 12px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 650;
    line-height: 1.38;
    text-align: center;
    background: #011827;
    color: #eef9ff;
    border: 1px solid rgba(128, 214, 255, 0.20);
    box-shadow: 0 13px 25px rgba(0, 20, 36, 0.42);
    pointer-events: none;
  }

  .dsb-tooltip strong {
    font-weight: 900;
  }

  .dsb-tooltip u {
    text-underline-offset: 3px;
    text-decoration-thickness: 2px;
  }

  .dsb-tooltip-wrap:hover .dsb-tooltip,
  .dsb-tooltip-wrap.dsb-tooltip-open .dsb-tooltip {
    display: block;
  }

  .dsb-bookmark-message {
    position: absolute;
    top: 62px;
    right: 12px;
    left: 12px;
    padding: 12px;
    border-radius: 12px;
    background: #011827;
    color: #eef9ff;
    border: 1px solid rgba(128, 214, 255, 0.24);
    box-shadow: 0 15px 28px rgba(0, 20, 36, 0.54);
    font-size: 15px;
    line-height: 1.35;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: 2147483647;
  }

  .dsb-bookmark-message.dsb-bookmark-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  .dsb-bookmark-message strong {
    color: #ffbd73;
  }

  #dsb-bookmark-shortcut {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 6px;
    background: rgba(255, 155, 47, 0.18);
    color: #ffbd73;
    font-weight: 900;
  }

  @media (max-width: 768px) {
    #dsb-floating-popup.dsb-popup {
      top: auto;
      right: 10px;
      bottom: 80px;
      left: 10px;
      width: auto;
      max-width: none;
      border-radius: 13px;
      transform: scale(var(--dsb-scale));
      transform-origin: bottom right;
    }

    .dsb-popup-header {
      cursor: default;
      height: 40px;
      grid-template-columns: 1fr 28px;
      padding: 7px 9px;
    }

    .dsb-title {
      font-size: 13px;
      letter-spacing: 0.8px;
    }

    .dsb-top-btn {
      width: 26px;
      height: 26px;
      border-radius: 7px;
      font-size: 14px;
    }

    .dsb-popup-body {
      padding: 10px;
      gap: 8px;
      max-height: calc(100vh - 130px);
    }

    .dsb-main-actions {
      gap: 8px;
    }

    .dsb-btn-row {
      flex-direction: column;
      gap: 7px;
    }

    .dsb-btn {
      font-size: 14px;
      padding: 9px;
      min-height: 36px;
      border-radius: 8px;
    }

    .dsb-third-btn {
      font-size: 14px;
    }

    .dsb-tooltip {
      font-size: 12px;
      padding: 8px;
      margin-top: 6px;
      border-radius: 8px;
    }

    .dsb-tooltip u {
      text-underline-offset: 2px;
      text-decoration-thickness: 1.5px;
    }

    .dsb-bookmark-message {
      top: 48px;
      right: 8px;
      left: 8px;
      font-size: 12px;
      padding: 8px 9px;
      border-radius: 9px;
    }
  }
</style>

<script>
(function () {
  const STORAGE_KEY = "dsb_popup_ocean_orange_v1";
  const BOOKMARK_HASH = "data-security-breach-popup";

  function ready(fn) {
    if (document.readyState === "loading") {
      document.addEventListener("DOMContentLoaded", fn);
    } else {
      fn();
    }
  }

  ready(function () {
    const popup = document.getElementById("dsb-floating-popup");
    const launcher = document.getElementById("dsb-launcher");
    const header = document.getElementById("dsb-popup-header");
    const bookmarkBtn = document.getElementById("dsb-popup-bookmark");
    const bookmarkMessage = document.getElementById("dsb-bookmark-message");
    const bookmarkShortcut = document.getElementById("dsb-bookmark-shortcut");
    const tooltipWrap = document.getElementById("dsb-tooltip-wrap");

    if (!popup || !launcher || !header || !tooltipWrap) {
      return;
    }

    document.body.appendChild(launcher);
    document.body.appendChild(popup);

    let dragging = false;
    let startX = 0;
    let startY = 0;
    let startLeft = 0;
    let startTop = 0;
    let bookmarkTimer = null;

    function isMobile() {
      return window.innerWidth <= 768;
    }

    function isMac() {
      return /Mac|iPhone|iPad|iPod/i.test(navigator.platform || navigator.userAgent);
    }

    function clamp(value, min, max) {
      return Math.min(Math.max(value, min), max);
    }

    function loadState() {
      try {
        return JSON.parse(localStorage.getItem(STORAGE_KEY)) || {};
      } catch (e) {
        return {};
      }
    }

    function saveState() {
      if (isMobile()) {
        localStorage.setItem(STORAGE_KEY, JSON.stringify({}));
        return;
      }

      const rect = popup.getBoundingClientRect();

      localStorage.setItem(STORAGE_KEY, JSON.stringify({
        left: Math.round(rect.left),
        top: Math.round(rect.top)
      }));
    }

    function keepInViewport() {
      if (isMobile()) {
        popup.style.left = "";
        popup.style.top = "";
        popup.style.right = "";
        popup.style.bottom = "";
        return;
      }

      const rect = popup.getBoundingClientRect();

      const maxLeft = Math.max(0, window.innerWidth - rect.width);
      const maxTop = Math.max(0, window.innerHeight - rect.height);

      const left = clamp(rect.left, 0, maxLeft);
      const top = clamp(rect.top, 0, maxTop);

      popup.style.left = left + "px";
      popup.style.top = top + "px";
      popup.style.right = "auto";
      popup.style.bottom = "auto";
    }

    function applyState() {
      const state = loadState();

      if (!isMobile()) {
        popup.style.right = "auto";
        popup.style.bottom = "auto";

        const rect = popup.getBoundingClientRect();
        const visualWidth = rect.width || 326;
        const visualHeight = rect.height || 120;

        const defaultLeft = window.innerWidth - visualWidth - 24;
        const defaultTop = 88;

        const left = typeof state.left === "number" ? state.left : defaultLeft;
        const top = typeof state.top === "number" ? state.top : defaultTop;

        popup.style.left = clamp(left, 0, Math.max(0, window.innerWidth - visualWidth)) + "px";
        popup.style.top = clamp(top, 0, Math.max(0, window.innerHeight - visualHeight)) + "px";
      }

      keepInViewport();
    }

    function showBookmarkMessage() {
      if (!bookmarkMessage || !bookmarkShortcut) return;

      bookmarkShortcut.textContent = isMac() ? "⌘ + D" : "Ctrl + D";

      bookmarkMessage.classList.add("dsb-bookmark-visible");

      clearTimeout(bookmarkTimer);
      bookmarkTimer = setTimeout(function () {
        bookmarkMessage.classList.remove("dsb-bookmark-visible");
      }, 5200);
    }

    function bookmarkPopup() {
      const cleanUrl = window.location.href.split("#")[0];
      const bookmarkUrl = cleanUrl + "#" + BOOKMARK_HASH;
      const bookmarkTitle = "Data Security Breach";

      try {
        history.replaceState(null, document.title, "#" + BOOKMARK_HASH);
      } catch (e) {}

      try {
        if (window.external && typeof window.external.AddFavorite === "function") {
          window.external.AddFavorite(bookmarkUrl, bookmarkTitle);
          return;
        }
      } catch (e) {}

      try {
        if (window.sidebar && typeof window.sidebar.addPanel === "function") {
          window.sidebar.addPanel(bookmarkTitle, bookmarkUrl, "");
          return;
        }
      } catch (e) {}

      showBookmarkMessage();
    }

    if (bookmarkBtn) {
      bookmarkBtn.addEventListener("click", function (event) {
        event.preventDefault();
        event.stopPropagation();
        bookmarkPopup();
      });
    }

    launcher.addEventListener("click", function () {
      keepInViewport();
      saveState();
    });

    header.addEventListener("pointerdown", function (event) {
      if (isMobile()) return;
      if (event.target.closest("button, a")) return;

      const rect = popup.getBoundingClientRect();

      dragging = true;
      startX = event.clientX;
      startY = event.clientY;
      startLeft = rect.left;
      startTop = rect.top;

      popup.style.left = startLeft + "px";
      popup.style.top = startTop + "px";
      popup.style.right = "auto";
      popup.style.bottom = "auto";

      try {
        header.setPointerCapture(event.pointerId);
      } catch (e) {}
    });

    header.addEventListener("pointermove", function (event) {
      if (!dragging || isMobile()) return;

      const rect = popup.getBoundingClientRect();

      const maxLeft = Math.max(0, window.innerWidth - rect.width);
      const maxTop = Math.max(0, window.innerHeight - rect.height);

      const nextLeft = clamp(startLeft + event.clientX - startX, 0, maxLeft);
      const nextTop = clamp(startTop + event.clientY - startY, 0, maxTop);

      popup.style.left = nextLeft + "px";
      popup.style.top = nextTop + "px";
    });

    function stopDragging() {
      if (!dragging) return;

      dragging = false;
      keepInViewport();
      saveState();
    }

    header.addEventListener("pointerup", stopDragging);
    header.addEventListener("pointercancel", stopDragging);

    tooltipWrap.addEventListener("click", function (event) {
      const emergencyBtn = event.target.closest(".dsb-emergency-btn");

      if (!emergencyBtn) return;

      if (window.matchMedia("(hover: none)").matches) {
        event.preventDefault();
        event.stopPropagation();
        tooltipWrap.classList.toggle("dsb-tooltip-open");
      }
    });

    document.addEventListener("click", function (event) {
      if (!tooltipWrap.contains(event.target)) {
        tooltipWrap.classList.remove("dsb-tooltip-open");
      }

      if (bookmarkMessage && !bookmarkMessage.contains(event.target) && !event.target.closest("#dsb-popup-bookmark")) {
        bookmarkMessage.classList.remove("dsb-bookmark-visible");
      }
    });

    window.addEventListener("resize", function () {
      keepInViewport();
      saveState();
    });

    applyState();
  });
})();
</script>