Add contact form with spam protection

Add social media links to contact page

Move history content to dedicated page

Add SMTP configuration file

Update frontpage link styling

.gitignore

@@ -1,2 +1,3 @@
 app*
 content/robots.txt
+custom/smtp-config.php

content/frontpage.php

@@ -7,7 +7,7 @@
 <article>
     <h1>Hvem er vi?</h1>
     <p>Vi er en frivillig interesseorganisasjon som arbeider for at pasienter som kan ha nytte av medisinsk cannabis skal motta likeverdig og trygg behandling med oppfølging fra lege. Medikamentgruppen skal være økonomisk tilgjengelig gjennom offentlig refusjonsordninger og pasienter skal ikke miste grunnleggende rettigheter når de mottar lovlig medisin!</p>
-    <a class="button" href="/kontakt/">Les mer om oss</a>
+    <a class="button bigger" href="/om-oss">Les vår historie</a>
 </article>
 
 <section class="cta-section escape">

content/kontakt/00-some.md

@@ -0,0 +1,7 @@
+## Følg oss på sosiale medier
+
+- [Facebook](https://www.facebook.com/StoppLidelsen/)
+- [Instagram](https://www.instagram.com/stopplidelsen/)
+- [Mastodon](https://oslo.town/@stopplidelsen)
+
+<a class="button" href="/om-oss">Les mer om oss</a>

content/kontakt/01-kontaktskjema.php

@@ -0,0 +1,263 @@
+<?php
+// Contact form processing with spam prevention
+$formSubmitted = false;
+$formSuccess = false;
+$formErrors = [];
+$formData = ['name' => '', 'email' => '', 'message' => ''];
+
+// Process form submission
+if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['contact_form_submit'])) {
+    $formSubmitted = true;
+
+    // Spam Prevention 1: Honeypot field (should be empty)
+    if (!empty($_POST['website'])) {
+        $formErrors[] = 'Spam detected.';
+    }
+
+    // Spam Prevention 2: Time-based check (form must be visible for at least 3 seconds)
+    $formStartTime = isset($_POST['form_start_time']) ? (int)$_POST['form_start_time'] : 0;
+    $timeDiff = time() - $formStartTime;
+    if ($timeDiff < 3) {
+        $formErrors[] = 'Form submitted too quickly.';
+    }
+
+    // Spam Prevention 3: Referrer check (only if referrer is present and clearly from different domain)
+    if (!empty($_SERVER['HTTP_REFERER'])) {
+        $referrer = parse_url($_SERVER['HTTP_REFERER'], PHP_URL_HOST);
+        $currentHost = $_SERVER['HTTP_HOST'];
+        // Only block if referrer exists and doesn't match (allows empty referrer for privacy browsers)
+        if ($referrer && $referrer !== $currentHost && $referrer !== 'localhost') {
+            $formErrors[] = 'Invalid form submission.';
+        }
+    }
+
+    // Spam Prevention 4: Rate limiting (session-based)
+    if (session_status() === PHP_SESSION_NONE) {
+        session_start();
+    }
+
+    $lastSubmitTime = isset($_SESSION['last_contact_submit']) ? $_SESSION['last_contact_submit'] : 0;
+    if (time() - $lastSubmitTime < 60) {
+        $formErrors[] = 'Vennligst vent litt før du sender inn igjen.';
+    }
+
+    // Get and sanitize form data
+    $formData['name'] = trim($_POST['name'] ?? '');
+    $formData['email'] = trim($_POST['email'] ?? '');
+    // Normalize line endings in message (convert \r\n to \n)
+    $formData['message'] = trim(str_replace("\r\n", "\n", $_POST['message'] ?? ''));
+
+    // Validation
+    if (empty($formData['name'])) {
+        $formErrors[] = 'Vennligst oppgi navn.';
+    } elseif (strlen($formData['name']) > 100) {
+        $formErrors[] = 'Navnet er for langt.';
+    }
+
+    if (empty($formData['email'])) {
+        $formErrors[] = 'Vennligst oppgi e-postadresse.';
+    } elseif (!filter_var($formData['email'], FILTER_VALIDATE_EMAIL)) {
+        $formErrors[] = 'Ugyldig e-postadresse.';
+    } elseif (strlen($formData['email']) > 100) {
+        $formErrors[] = 'E-postadressen er for lang.';
+    }
+
+    if (empty($formData['message'])) {
+        $formErrors[] = 'Vennligst skriv en melding.';
+    } elseif (strlen($formData['message']) < 10) {
+        $formErrors[] = 'Meldingen er for kort (minimum 10 tegn).';
+    } elseif (strlen($formData['message']) > 5000) {
+        $formErrors[] = 'Meldingen er for lang (maksimum 5000 tegn).';
+    }
+
+    // Spam Prevention 5: Check for suspicious patterns
+    $spamPatterns = [
+        '/\[url=/i',
+        '/\[link=/i',
+        '/<a href=/i',
+        '/viagra|cialis|casino|poker|lottery/i',
+        '/http.*http.*http/i', // Multiple URLs
+    ];
+
+    $fullText = $formData['name'] . ' ' . $formData['email'] . ' ' . $formData['message'];
+    foreach ($spamPatterns as $pattern) {
+        if (preg_match($pattern, $fullText)) {
+            $formErrors[] = 'Meldingen inneholder ikke tillatt innhold.';
+            break;
+        }
+    }
+
+    // If no errors, send email
+    if (empty($formErrors)) {
+        // Load SMTP configuration
+        $smtpConfig = require __DIR__ . '/../../custom/smtp-config.php';
+
+        // Prepare email body
+        $emailBody = "Ny henvendelse fra kontaktskjemaet på stopplidelsen.no\n\n";
+        $emailBody .= "Navn: " . $formData['name'] . "\n";
+        $emailBody .= "E-post: " . $formData['email'] . "\n";
+        $emailBody .= "IP-adresse: " . $_SERVER['REMOTE_ADDR'] . "\n";
+        $emailBody .= "Tidspunkt: " . date('Y-m-d H:i:s') . "\n\n";
+        $emailBody .= "Melding:\n" . $formData['message'] . "\n";
+
+        $mailSent = false;
+
+        // Try PHPMailer.Lite if SMTP is configured
+        if ($smtpConfig['enabled']) {
+            // Pre-flight check: Test SMTP connection before attempting to send
+            $smtpConnectable = false;
+            $fp = @fsockopen($smtpConfig['host'], $smtpConfig['port'], $errno, $errstr, 10);
+            if ($fp) {
+                // Successfully connected
+                $smtpConnectable = true;
+                fclose($fp);
+            } else {
+                error_log("SMTP Pre-flight check failed: Cannot connect to {$smtpConfig['host']}:{$smtpConfig['port']} - Error: $errno - $errstr");
+                $formErrors[] = 'Det oppstod en feil ved sending av meldingen. Vennligst prøv igjen senere.';
+            }
+
+            if ($smtpConnectable) {
+                try {
+                    require_once __DIR__ . '/../../custom/vendor/PHPMailer.Lite.php';
+
+                    $mail = new \codeworxtech\PHPMailerLite\PHPMailerLite();
+
+                    // Enable debug output in development
+                    // $mail->debug = 1; // Uncomment to see SMTP debug output
+
+                    $mail->SetSMTPhost($smtpConfig['host']);
+                    $mail->SetSMTPport($smtpConfig['port']);
+                    $mail->SetSMTPuser($smtpConfig['username']);
+                    $mail->SetSMTPpass($smtpConfig['password']);
+
+                    $mail->SetSender([$smtpConfig['from_email'] => $smtpConfig['from_name']]);
+                    $mail->AddRecipient([$smtpConfig['to_email'] => $smtpConfig['to_name']]);
+                    $mail->AddReplyTo([$formData['email'] => $formData['name']]);
+                    $mail->SetSubject('Ny henvendelse fra kontaktskjema');
+                    $mail->SetBodyText($emailBody);
+
+                    // Capture any output from PHPMailer.Lite (it might exit() on error)
+                    ob_start();
+                    $mailSent = @$mail->Send('smtp');
+                    $smtpOutput = ob_get_clean();
+
+                    // Check if there was an error in the output
+                    if (!$mailSent || stripos($smtpOutput, 'error') !== false || stripos($smtpOutput, '&#10007;') !== false) {
+                        $mailSent = false;
+                        error_log("SMTP Send failed. Output: " . strip_tags($smtpOutput));
+                        $formErrors[] = 'Det oppstod en feil ved sending av meldingen. Vennligst prøv igjen senere.';
+                    }
+                } catch (\Exception $e) {
+                    $mailSent = false;
+                    error_log("PHPMailer Exception: " . $e->getMessage());
+                    $formErrors[] = 'Det oppstod en feil ved sending av meldingen. Vennligst prøv igjen senere.';
+                }
+            }
+        } else {
+            // Fallback to native mail() function
+            $headers = "From: kontaktskjema@stopplidelsen.no\r\n";
+            $headers .= "Reply-To: " . $formData['email'] . "\r\n";
+            $headers .= "X-Mailer: PHP/" . phpversion() . "\r\n";
+            $headers .= "Content-Type: text/plain; charset=UTF-8\r\n";
+
+            $mailSent = mail('ruben@stopplidelsen.no', 'Ny henvendelse fra kontaktskjema', $emailBody, $headers);
+        }
+
+        if ($mailSent) {
+            $formSuccess = true;
+            $_SESSION['last_contact_submit'] = time();
+
+            // Clear form data on success
+            $formData = ['name' => '', 'email' => '', 'message' => ''];
+        } else {
+            if (empty($formErrors)) {
+                $formErrors[] = 'Det oppstod en feil ved sending av meldingen. Vennligst prøv igjen senere.';
+            }
+        }
+    }
+}
+
+// Generate form start time token
+$currentTime = time();
+?>
+
+<article class="contain">
+    <h2>Kontaktskjema</h2>
+
+    <p>Har du spørsmål, innspill eller ønsker å delta i arbeidet vårt? Fyll ut skjemaet nedenfor! Men husk at det kan ta tid før du får svar, vi er ikke så mange og driver alt på frivillig basis.</p>
+
+    <section class="contact-form">
+        <?php if ($formSuccess): ?>
+            <div class="form-success">
+                <p><strong>Takk for din henvendelse!</strong></p>
+                <p>Vi har mottatt meldingen din og vil svare så snart som mulig.</p>
+            </div>
+        <?php endif; ?>
+
+        <?php if (!empty($formErrors)): ?>
+            <div class="form-errors">
+                <p><strong>Vennligst rett opp følgende:</strong></p>
+                <ul>
+                    <?php foreach ($formErrors as $error): ?>
+                        <li><?= htmlspecialchars($error) ?></li>
+                    <?php endforeach; ?>
+                </ul>
+            </div>
+        <?php endif; ?>
+
+        <?php if (!$formSuccess): ?>
+            <form method="post" action="<?= htmlspecialchars($_SERVER['REQUEST_URI']) ?>" class="contact-form-inner">
+                <!-- Honeypot field (hidden from users, bots will fill it) -->
+                <div style="position: absolute; left: -5000px;" aria-hidden="true">
+                    <label for="website">Website</label>
+                    <input type="text" id="website" name="website" tabindex="-1" autocomplete="off">
+                </div>
+
+                <!-- Time-based token -->
+                <input type="hidden" name="form_start_time" value="<?= $currentTime ?>">
+
+                <div class="form-group">
+                    <label for="contact_name">Navn <span class="required">*</span></label>
+                    <input
+                        type="text"
+                        id="contact_name"
+                        name="name"
+                        value="<?= htmlspecialchars($formData['name']) ?>"
+                        required
+                        maxlength="100"
+                    >
+                </div>
+
+                <div class="form-group">
+                    <label for="contact_email">E-postadresse <span class="required">*</span></label>
+                    <input
+                        type="email"
+                        id="contact_email"
+                        name="email"
+                        value="<?= htmlspecialchars($formData['email']) ?>"
+                        required
+                        maxlength="100"
+                    >
+                </div>
+
+                <div class="form-group">
+                    <label for="contact_message">Melding <span class="required">*</span></label>
+                    <textarea
+                        id="contact_message"
+                        name="message"
+                        rows="8"
+                        required
+                        minlength="10"
+                        maxlength="5000"
+                    ><?= htmlspecialchars($formData['message']) ?></textarea>
+                    <small>Minimum 10 tegn, maksimum 5000 tegn.</small>
+                </div>
+
+                <div class="form-group">
+                    <button type="submit" name="contact_form_submit" class="button">Send melding</button>
+                </div>
+            </form>
+        <?php endif; ?>
+    </section>
+
+</article>

content/kontakt/page.html

@@ -1,13 +0,0 @@
-<article class="contain">
-    <h1>Kontakt oss</h1>
-    <p>Skriv til oss på <strong>kontakt</strong> <em>æt</em> <strong>stopplidelsen</strong> <em>dåt</em> <strong>no</strong></a> (mailadresse er skrevet litt kryptisk for å omgå spam) og følg oss på <a href="https://www.facebook.com/StoppLidelsen/">Facebook</a>, <a href="https://www.instagram.com/stopplidelsen/">Instagram</a> og <a href="https://oslo.town/@stopplidelsen">Mastodon</a>.</p>
-    <h2>Vår historie - en felles kamp for endring</h2>
-    <p>"Stopp lidelsen" er en interesseorganisasjon som ble stiftet vinteren 2024/25 for å løse den utfordrende situasjonen norske pasienter, leger og forskere står i når det gjelder bruk av medisinsk cannabis (MC) i behandling. Vi er en liten, men dedikert gruppe – Sofie, Britt-Inger, Geir Roger og Ruben – som har kjempet for reell endring i mange år. Alle i organisasjonen jobber frivillig, og selv om vi har begrenset kapasitet, har vi et stort hjerte for saken. Vår bakgrunn spenner fra fagpersoner, pasienter og pårørende til lang erfaring fra pasientforeninger.
-    <p>Vi bygger videre på arbeidet fra medlemsorganisasjonen "Foreningen for cannabismedisin", som ble opprettet i 2016. Der lærte vi mye, men vi opplevde også utfordringer. I 2019 måtte vi dessverre sette medlemsorganisasjonen på pause etter å ha brent oss ut. Det var en hard lærdom, men den viste oss at vi måtte gjøre ting annerledes for å lykkes.</p>
-<p>Nå har vi valgt å organisere oss som en interessegruppe, med et klart mål: å skape politisk og samfunnsmessig endring. Vi samarbeider tett med leger, helsepersonell og forskere både i Norge og internasjonalt.</p>
-    <p>Men vi klarer ikke dette alene.</p>
-    <p>Uansett om du er pasient, pårørende, helsepersonell eller bare en som bryr deg – alle kan bidra. Vi er avhengige av at du hjelper til med å spre budskapet, åpne dører til politikere, fagpersoner og pasientforeninger, eller bidra med din tid og kunnskap på andre måter.
-<p>"Stopp lidelsen" er en frivillig organisasjon som drives helt og fullt på frivillig basis. Vi ber om forståelse dersom du ikke får umiddelbart svar på henvendelser – vi gjør vårt beste for å svare alle så fort som mulig.
-<p>Men for å lykkes, er vi avhengige av at du blir med oss i kampen. Dette er ikke bare vår sak – det er vår felles sak. Bare sammen kan vi skape det presset som trengs for å endre regelverket og gi pasienter tilgang til den behandlingen de fortjener.</p>
-    <a class="button" href="vedtekter.pdf">Last ned våre vedtekter (PDF)</a>
-</article>

content/om-oss/historie.md

@@ -0,0 +1,17 @@
+# Vår historie
+
+**Stopp lidelsen** er en interesseorganisasjon som ble stiftet vinteren 2024/25 for å løse den utfordrende situasjonen norske pasienter, leger og forskere står i når det gjelder bruk av medisinsk cannabis (MC) i behandling. Vi er en liten, men dedikert gruppe – Sofie, Britt-Inger, Geir Roger og Ruben – som har kjempet for reell endring i mange år. Alle i organisasjonen jobber frivillig, og selv om vi har begrenset kapasitet, har vi et stort hjerte for saken. Vår bakgrunn spenner fra fagpersoner, pasienter og pårørende til lang erfaring fra pasientforeninger.
+
+Vi bygger videre på arbeidet fra medlemsorganisasjonen "Foreningen for cannabismedisin", som ble opprettet i 2016. Der lærte vi mye, men vi opplevde også utfordringer. I 2019 måtte vi dessverre sette medlemsorganisasjonen på pause etter å ha brent oss ut. Det var en hard lærdom, men den viste oss at vi måtte gjøre ting annerledes for å lykkes.
+
+Nå har vi valgt å organisere oss som en interessegruppe, med et klart mål: å skape politisk og samfunnsmessig endring. Vi samarbeider tett med leger, helsepersonell og forskere både i Norge og internasjonalt.
+
+Men vi klarer ikke dette alene.
+
+Uansett om du er pasient, pårørende, helsepersonell eller bare en som bryr deg – alle kan bidra. Vi er avhengige av at du hjelper til med å spre budskapet, åpne dører til politikere, fagpersoner og pasientforeninger, eller bidra med din tid og kunnskap på andre måter.
+
+"Stopp lidelsen" er en frivillig organisasjon som drives helt og fullt på frivillig basis. Vi ber om forståelse dersom du ikke får umiddelbart svar på henvendelser – vi gjør vårt beste for å svare alle så fort som mulig.
+
+Men for å lykkes, er vi avhengige av at du blir med oss i kampen. Dette er ikke bare vår sak – det er vår felles sak. Bare sammen kan vi skape det presset som trengs for å endre regelverket og gi pasienter tilgang til den behandlingen de fortjener.
+
+<a class="button" href="vedtekter.pdf">Last ned våre vedtekter (PDF)</a>

custom/smtp-config.php.example

@@ -0,0 +1,19 @@
+<?php
+/**
+ * SMTP Configuration for PHPMailer.Lite
+ * 
+ * Fill in your SMTP settings here.
+ * This file should be added to .gitignore to keep credentials private.
+ */
+
+return [
+    'enabled' => false, // Set to true when you have SMTP configured
+    'host' => 'smtp.example.com', // Your SMTP server
+    'port' => 587, // Common ports: 587 (TLS), 465 (SSL), 25 (unsecured)
+    'username' => 'your-email@example.com', // SMTP username
+    'password' => 'your-password', // SMTP password
+    'from_email' => 'kontaktskjema@stopplidelsen.no',
+    'from_name' => 'Stopp Lidelsen Kontaktskjema',
+    'to_email' => 'kontakt@stopplidelsen.no',
+    'to_name' => 'Stopp Lidelsen',
+];

custom/styles/base.css

@@ -28,6 +28,7 @@ h1, h2, h3, h4, h5, h6 {
   margin-top: 1.3em;
   text-wrap: pretty;
 }
+
 a {
     color: var(--color-green);
     text-decoration: none;
@@ -48,7 +49,7 @@ a {
 
 .contain, :where(main>article, main>aside, main>section) {
   display: grid;
-  grid-template-columns: minmax(.4rem, 1fr) minmax(0, 42rem) minmax(.3rem, 1fr);
+  grid-template-columns: minmax(.8rem, 1fr) minmax(0, 42rem) minmax(.3rem, 1fr);
   > * {
     grid-column: 2;
   }
@@ -113,6 +114,7 @@ main {
       line-height: 1.35em;
     }
   }
+
   .button {
     margin-top: 1.3rem;
     justify-self: start;
@@ -124,7 +126,7 @@ main {
   display: inline-block;
   text-decoration: none;
   border-radius: 2rem;
-  padding: 0.35rem 1rem;
+  padding: 0.55rem 1rem;
   background-color: transparent;
   color: var(--color-grey);
   outline: 0.08rem var(--color-grey) solid;
@@ -173,13 +175,103 @@ main {
 
   &.bigger {
     font-size: 1.2em;
-    padding: calc(0.35rem * 1.2) calc(1rem * 1.2);
+    /*padding: calc(0.35rem * 1.2) calc(1rem * 1.2);*/
     border-radius: calc(1rem * 1.2);
   }
+  &.centered {
+    justify-self: center;
+  }
 }
 
 /* FOOTER  */
 
+/* CONTACT FORM */
+.contact-form {
+  margin-top: 2rem;
+  margin-bottom: 2rem;
+  
+  .form-success {
+    background-color: #d4edda;
+    border: 1px solid #c3e6cb;
+    color: #155724;
+    padding: 1rem;
+    border-radius: 0.25rem;
+    margin-bottom: 1rem;
+  }
+  
+  .form-errors {
+    background-color: #f8d7da;
+    border: 1px solid #f5c6cb;
+    color: #721c24;
+    padding: 1rem;
+    border-radius: 0.25rem;
+    margin-bottom: 1rem;
+    
+    ul {
+      margin: 0.5rem 0 0 0;
+      padding-left: 1.5rem;
+    }
+  }
+  
+  .contact-form-inner {
+    .form-group {
+      margin-bottom: 1.3rem;
+      
+      label {
+        display: block;
+        font-weight: 600;
+        margin-bottom: 0.3rem;
+        color: var(--color-grey);
+        
+        .required {
+          color: #dc3545;
+        }
+      }
+      
+      input[type="text"],
+      input[type="email"],
+      textarea {
+        width: 100%;
+        padding: 0.6rem;
+        border: 1px solid #ccc;
+        border-radius: 0.25rem;
+        font-family: inherit;
+        font-size: 1rem;
+        box-sizing: border-box;
+        
+        &:focus {
+          outline: none;
+          border-color: var(--color-green);
+          box-shadow: 0 0 0 0.2rem rgba(0, 156, 128, 0.25);
+        }
+      }
+      
+      textarea {
+        resize: vertical;
+        min-height: 150px;
+      }
+      
+      small {
+        display: block;
+        margin-top: 0.3rem;
+        color: #6c757d;
+        font-size: 0.875rem;
+      }
+      
+      button[type="submit"] {
+        cursor: pointer;
+        border: none;
+        font-size: 1rem;
+        font-family: inherit;
+        
+        &:hover {
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}
+
 footer {
   color: var(--color-green-light);
   a {