@networkpro/web 1.5.2 → 1.6.0

package/src/hooks.server.js

@@ -0,0 +1,91 @@
+/* ==========================================================================
+src/hooks.server.js
+
+Copyright © 2025 Network Pro Strategies (Network Pro™)
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * SvelteKit server hook to set Content Security Policy (CSP) header.
+ * @type {import('@sveltejs/kit').Handle}
+ */
+export async function handle({ event, resolve }) {
+  // Create the response
+  const response = await resolve(event);
+
+  // Check if the environment is for testing
+  const isTestEnvironment =
+    process.env.NODE_ENV === "test" || process.env.ENV_MODE === "ci";
+
+  // Set the Content Security Policy header
+  if (isTestEnvironment) {
+    // Relaxed CSP for testing: Allow inline scripts and eval
+    response.headers.set(
+      "Content-Security-Policy",
+      [
+        "default-src 'self';",
+        "script-src 'self' 'unsafe-inline' 'unsafe-eval' ws://localhost:*;", // Allow inline and eval scripts, and websockets for local testing
+        "style-src 'self' 'unsafe-inline';", // Allow inline styles
+        "img-src 'self' data:;", // Allow images from same origin and data URIs
+        "connect-src 'self';", // Allow connections only to same origin
+        "font-src 'self' data:;", // Allow fonts from same origin and data URIs
+        "form-action 'self';", // Allow forms to post to same origin
+        "base-uri 'self';", // Restrict base URIs to same origin
+        "object-src 'none';", // Block all object sources
+        "frame-ancestors 'none';", // Prevent framing of the site
+        "upgrade-insecure-requests;", // Automatically upgrade HTTP to HTTPS
+        "report-uri /api/mock-csp;", // Mock CSP reports for testing
+      ].join(" "),
+    );
+  } else {
+    // Production or development environment: use a more restrictive CSP
+    response.headers.set(
+      "Content-Security-Policy",
+      [
+        "default-src 'self';", // Allow resources from same origin
+        "script-src 'self' 'unsafe-inline';", // Allow inline scripts
+        "style-src 'self' 'unsafe-inline';", // Allow inline styles
+        "img-src 'self' data:;", // Allow images from same origin and data URIs
+        "connect-src 'self';", // Allow connections only to same origin
+        "font-src 'self' data:;", // Allow fonts from same origin and data URIs
+        "form-action 'self';", // Allow forms to post to same origin
+        "base-uri 'self';", // Restrict base URIs to same origin
+        "object-src 'none';", // Block all object sources
+        "frame-ancestors 'none';", // Prevent framing of the site
+        "upgrade-insecure-requests;", // Automatically upgrade HTTP to HTTPS
+        `report-uri ${process.env.ENV_MODE === "prod" ? "/.netlify/functions/cspReport" : "/api/mock-csp"};`, // Add CSP report URI for violations
+      ].join(" "),
+    );
+  }
+
+  // Set other security headers
+  response.headers.set(
+    "Permissions-Policy",
+    [
+      "fullscreen=(self)",
+      "sync-xhr=()",
+      "camera=()",
+      "microphone=()",
+      "geolocation=()",
+      "clipboard-read=()",
+      "clipboard-write=()",
+      "payment=()",
+      "usb=()",
+      "hid=()",
+      "gamepad=()",
+      "serial=()",
+      "publickey-credentials-get=()",
+      "interest-cohort=()",
+      "topics=()",
+    ].join(", "),
+  );
+
+  response.headers.set("X-Content-Type-Options", "nosniff");
+  response.headers.set("Referrer-Policy", "strict-origin-when-cross-origin");
+  response.headers.set("X-Frame-Options", "DENY");
+
+  return response;
+}
+
+// cspell:ignore licdn

package/src/lib/components/Badges.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/Badges.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/ContainerSection.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/ContainerSection.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/FullWidthSection.svelte

@@ -1,13 +1,27 @@
 <!-- ==========================================================================
 src/lib/components/FullWidthSection.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
 
-<div class="full-width-section">
+<script>
+  export let centered = false; // this prop lets us control vertical centering
+</script>
+
+<div class="full-width-section {centered ? 'centered' : ''}">
   <div class="container">
     <slot></slot>
     <!-- Slot to allow child content -->
   </div>
 </div>
+
+<style>
+  .full-width-section.centered {
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    min-height: 80vh;
+  }
+</style>

package/src/lib/components/LegalNav.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/LegalNav.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/Logo.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/Logo.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/MetaTags.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/MetaTags.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/PWAInstallButton.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/PWAInstallButton.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/RedirectPage.svelte

@@ -1,12 +1,14 @@
 <!-- ==========================================================================
 src/lib/components/RedirectPage.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
 
 <script>
   import { onMount } from "svelte";
+  import FullWidthSection from "$lib/components/FullWidthSection.svelte";
 
   export let to;
   export let delay = 3;
@@ -30,14 +32,26 @@ This file is part of Network Pro.
   <meta name="robots" content="noindex, nofollow" />
 </svelte:head>
 
-<div class="container">
-  <h1>Redirecting…</h1>
-  <p>You'll be taken to the destination in just a moment.</p>
-  <div class="loading-spinner" aria-hidden="true"></div>
-  <p>If nothing happens, <a href={to}>click here</a>.</p>
-</div>
+<!-- MAIN CONTENT -->
+
+<FullWidthSection centered>
+  <div class="redirect-content">
+    <h1>Redirecting…</h1>
+    <p>You'll be taken to the destination in just a moment.</p>
+    <div class="loading-spinner" aria-hidden="true"></div>
+    <p>If nothing happens, <a href={to}>click here</a>.</p>
+  </div>
+</FullWidthSection>
+
+<!-- END MAIN CONTENT -->
 
 <style>
+  .redirect-content {
+    text-align: center;
+    font-family: system-ui, sans-serif;
+    margin-top: 2rem; /* adjust as needed */
+  }
+
   .loading-spinner {
     width: 48px;
     height: 48px;
@@ -53,10 +67,4 @@ This file is part of Network Pro.
       transform: rotate(360deg);
     }
   }
-
-  .container {
-    text-align: center;
-    font-family: system-ui, sans-serif;
-    margin-top: 5rem;
-  }
 </style>

package/src/lib/components/SocialMedia.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/SocialMedia.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->

package/src/lib/components/foss/FossFeatures.svelte

@@ -1,14 +1,15 @@
 <!-- ==========================================================================
 src/lib/components/foss/FossFeatures.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
 
 <script>
   /**
-   * Array of feature strings that describe the FOSS item
-   * @type {string[]}
+   * Array of feature objects that describe the FOSS item
+   * @type {Array<{ emoji: string, label: string, description: string }>}
    */
   export let features = [];
 </script>
@@ -16,9 +17,62 @@ This file is part of Network Pro.
 <!-- BEGIN FOSS FEATURES -->
 {#if features && features.length > 0}
   <ul>
-    {#each features as feature}
-      <li>{feature}</li>
+    {#each features as feature, index}
+      <li class="emoji">
+        {#if index === 0}
+          <span class="headline">
+            {feature.emoji}
+            <span class="label">{feature.label}</span>
+            {#if feature.description && feature.description.trim()}
+              <span class="description">&mdash; {feature.description}</span>
+            {/if}
+          </span>
+        {:else}
+          {feature.emoji}
+          <span class="label">{feature.label}</span>
+          {#if feature.description && feature.description.trim()}
+            <span class="description">&mdash; {feature.description}</span>
+          {/if}
+        {/if}
+      </li>
     {/each}
   </ul>
 {/if}
+
 <!-- END FOSS FEATURES -->
+
+<style>
+  ul {
+    margin: 0;
+    list-style-type: none;
+    padding-left: 0;
+  }
+
+  ul li {
+    font-weight: 600;
+    margin-bottom: 0.5em;
+  }
+
+  .emoji {
+    margin-right: 8px;
+  }
+
+  .headline {
+    display: block; /* Ensure it is on its own line */
+    font-weight: bold; /* Keep the first item bold */
+    font-style: italic; /* Only make the first item italic */
+    margin-bottom: 4px; /* Add space between headline and the rest */
+  }
+
+  .label {
+    font-weight: bold; /* Keep the label bold */
+    font-family: inherit; /* Ensure it uses the same font-family as normal text */
+  }
+
+  .description {
+    display: inline; /* Keep description inline */
+    font-weight: normal; /* Ensure the description is normal (not bold) */
+    font-family: inherit; /* Ensure it uses the same font-family as normal text */
+    font-style: normal; /* Remove italic for the description */
+  }
+</style>

package/src/lib/components/foss/FossItemContent.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/foss/FossItemContent.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
@@ -88,7 +89,7 @@ This file is part of Network Pro.
   <h3>{fossItem.headline}</h3>
 
   <!-- Trusted input, from internal CMS -->
-  {@html fossItem.detailsDescription}
+  {@html fossItem.headlineDescription}
 
   <FossFeatures features={fossItem.features} />
 

package/src/lib/components/layout/Footer.svelte

@@ -1,17 +1,20 @@
 <!-- ==========================================================================
 src/lib/components/layout/Footer.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
 
+<!-- cspell:ignore ccby gnugpl -->
+
 <script>
   import { base } from "$app/paths";
   // Import icons for licenses
   import { bySvg, ccSvg } from "$lib";
 
   // Log the base path to verify its value
-  //console.log("Base path:", base);
+  console.log("Base path:", base);
 
   // Dynamic links for licensing and trademark
   const ccbyLink = `${base}/license#cc-by`;

package/src/lib/components/layout/HeaderDefault.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/layout/HeaderDefault.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
@@ -9,7 +10,7 @@ This file is part of Network Pro.
   import { base } from "$app/paths";
 
   // Log the base path to verify its value
-  //console.log("Base path:", base);
+  console.log("Base path:", base);
 
   const homeLink = base || "/";
   const aboutLink = `${base}/about`;

package/src/lib/components/layout/HeaderHome.svelte

@@ -1,6 +1,7 @@
 <!-- ==========================================================================
 src/lib/components/layout/HeaderHome.svelte
 
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== -->
@@ -9,7 +10,7 @@ This file is part of Network Pro.
   import { base } from "$app/paths";
 
   // Log the base path to verify its value
-  //console.log("Base path:", base);
+  console.log("Base path:", base);
 
   const aboutLink = `${base}/about`;
   const fossLink = `${base}/foss-spotlight`;