HEX

File: /home/wbwebdes/domains/abuse.wb-webdesign.com/public_html/index.html
<!DOCTYPE html>
<html lang="nl">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Meld Misbruik – WB Webdesign</title>
    <link rel="icon" href="assets/favicon.png" type="image/svg+xml" />
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet" />
    <style>
        * {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            font-family: 'Inter', sans-serif;
            color: white;
            background: url('assets/background.png') no-repeat center center fixed;
            background-size: cover;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            position: relative;
        }

        .language-switch {
            position: absolute;
            top: 20px;
            right: 20px;
            z-index: 10;
        }

        .language-switch select {
            background-color: rgba(255, 255, 255, 0.9);
            color: #0489d1;
            border: none;
            padding: 8px 12px;
            border-radius: 6px;
            font-weight: 600;
            cursor: pointer;
            font-family: 'Inter', sans-serif;
        }

        .container {
            background-color: rgba(0, 0, 0, 0.65);
            padding: 40px 30px;
            border-radius: 15px;
            max-width: 700px;
            width: 100%;
            box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
            text-align: center;
        }

        .logo {
            max-width: 150px;
            margin-bottom: 25px;
        }

        h1 {
            font-size: 2.4em;
            margin-bottom: 20px;
        }

        p {
            font-size: 1.15em;
            line-height: 1.6;
            margin-bottom: 30px;
        }

        .button {
            display: inline-block;
            background-color: #0489d1;
            color: white;
            padding: 12px 28px;
            text-decoration: none;
            font-size: 1.1em;
            border-radius: 8px;
            transition: background-color 0.3s ease;
        }

        .button:hover {
            background-color: #036fab;
        }

        .email {
            margin-top: 25px;
            font-size: 0.95em;
            color: #ccc;
        }

        .email a {
            color: #0489d1;
            text-decoration: none;
        }

        @media (max-width: 600px) {
            h1 {
                font-size: 1.8em;
            }

            p {
                font-size: 1em;
            }

            .button {
                font-size: 1em;
                padding: 10px 20px;
            }

            .language-switch {
                top: 10px;
                right: 10px;
            }
        }
    </style>
</head>

<body>
    <!-- Vertaal knop -->
    <div class="language-switch">
        <select id="lang-select">
      <option value="nl">🌐 Nederlands</option>
      <option value="en">🌐 English</option>
    </select>
    </div>

    <!-- Inhoud -->
    <div class="container">
        <img src="assets/logo.svg" alt="WB Webdesign logo" class="logo" />
        <h1 id="title">Misbruik Melden</h1>
        <p id="text">
            Heeft u misbruik geconstateerd van een dienst die wordt geleverd door WB Webdesign bij ons of een van onze
            partners?
            Denk hierbij aan het verzenden van spam, phishing, malware, rare teksten op onze website of die van een
            partner of ander
            ongeoorloofd gebruik van onze infrastructuur. Wij nemen misbruikmeldingen serieus en verzoeken u vriendelijk
            om deze bij
            ons te melden via onderstaand formulier, of een mail naar ons abuse report email
        </p>
        <a href="https://portal.wb-webdesign.com/submitticket.php?step=2&deptid=3" class="button" target="_blank"
            rel="noopener noreferrer" id="button">
            Meld Misbruik
        </a>
        <div class="email" id="email-label"></div>
    </div>

    <script>
        const translations = {
      nl: {
        title: "Misbruik Melden",
        text: "Heeft u misbruik geconstateerd van een dienst die wordt geleverd door WB Webdesign bij ons of een van onze partners? Denk hierbij aan het verzenden van spam, phishing, malware, rare teksten op onze website of die van een partner of ander ongeoorloofd gebruik van onze infrastructuur. Wij nemen misbruikmeldingen serieus en verzoeken u vriendelijk om deze bij ons te melden via onderstaand formulier, of een mail naar ons abuse report email",
        button: "Meld Misbruik",
        emailLabel: "Abuse report email:"
      },
      en: {
        title: "Report Abuse",
        text: "Have you discovered abuse of a service provided by WB Webdesign or one of our clients? This includes sending spam, phishing, malware, strange texts on our website or that of a partner or any other unauthorized use of our infrastructure. We take abuse reports seriously and kindly ask that you report them using the form below, or sending an email to our abuse report mail adres",
        button: "Report Abuse",
        emailLabel: "Abuse report email:"
      }
    };

    const user = "i.report.abuse";
    const domain = "wb-webdesign.com";
    const email = user + "@" + domain;

    function setLanguage(lang) {
      const t = translations[lang];
      document.getElementById("title").textContent = t.title;
      document.getElementById("text").textContent = t.text;
      document.getElementById("button").textContent = t.button;
      document.getElementById("email-label").innerHTML = `${t.emailLabel} <a href="mailto:${email}">${email}</a>`;
    }

    // Init taal op basis van dropdown
    const langSelect = document.getElementById("lang-select");
    langSelect.addEventListener("change", () => setLanguage(langSelect.value));

    // Zet standaard taal
    setLanguage("nl");
    </script>
</body>

</html>