resolve issue with one external link

Reviewed-on: https://git.ctmesh.org/ctmesh/web/pulls/7

_redirects

@@ -1 +1,7 @@
 /discord https://discord.gg/m4F328as3K 302
+/merch https://ctmesh.redbubble.com 302
+/store https://ctmesh.redbubble.com 302
+/map https://map.ctmesh.org 302
+/resources https://ctmesh.org/meshcore-resources 302
+/coverage https://bdl.meshmapper.net 302
+/analyzer https://analyzer.letsmesh.net/packets?region=BDL 302

index.html

@@ -9,12 +9,12 @@
   <meta name="description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
   <meta name="keywords" content="CT Mesh, Mesh, MeshCore, Meshtastic, Connecticut, CT, community, networking, user group, Discord, map, radio">
   <meta name="author" content="CT Mesh">
-  <link rel="shortcut icon" type="image/x-icon" href="favicon.png?4">
+  <link rel="shortcut icon" type="image/x-icon" href="favicon.png?2026-1">
 
   <!-- Open Graph / Facebook -->
   <meta property="og:title" content="CT Mesh">
   <meta property="og:description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
-  <meta property="og:image" content="favicon.png?4">
+  <meta property="og:image" content="favicon.png?2026-1">
   <meta property="og:url" content="https://ctmesh.org">
   <meta property="og:type" content="website">
 
@@ -22,44 +22,59 @@
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="CT Mesh">
   <meta name="twitter:description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
-  <meta name="twitter:image" content="favicon.png?4">
+  <meta name="twitter:image" content="favicon.png?2026-1">
 
   <!-- Fonts and Icons -->
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">  
 
-  <link rel="icon" type="image/png" href="favicon.png?44">
+  <link rel="icon" type="image/png" href="favicon.png?2026-14">
-  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?4">
+  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?2026-1">
   <meta name="msapplication-TileColor" content="#6EBEE1">
-  <meta name="msapplication-TileImage" content="favicon.png?4">
+  <meta name="msapplication-TileImage" content="favicon.png?2026-1">
   <meta name="theme-color" content="#6EBEE1">
 
   <title>CT Mesh</title>
   
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       display: flex;
       align-items: center;
       justify-content: center;
       position: relative;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -70,14 +85,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .splash-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 3em 3em 2em 3em;
-      margin: 1em;
+      margin: 2.5em;
       width: 90%;
       max-width: 700px;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -95,11 +111,26 @@
       justify-content: center;
       gap: 0.5em;
       width: 100%;
-      padding-bottom: 15px;
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -3em -3em 0 -3em;
+      padding: 2.5em 3em 50px 3em;
+      position: relative;
     }
-    .top-section a img {
+    .email-link img {
       width: 35px;
-      filter: invert(15%) sepia(17%) saturate(767%) hue-rotate(198deg) brightness(94%) contrast(91%);
+      filter: brightness(0) invert(0.7);
+    }
+    .wave-divider {
+      position: absolute;
+      bottom: -1px;
+      left: 0;
+      right: 0;
+      line-height: 0;
+    }
+    .wave-divider svg {
+      width: 100%;
+      display: block;
     }
     .logo {
       width: 540px;
@@ -123,6 +154,7 @@
       font-weight: bold;
       padding-bottom: 4px;
       margin: 0;
+      color: #e0e0e0;
     }
     .btn {
       display: flex;
@@ -172,8 +204,11 @@
     }
     .btn-learn,
     .btn-learn:visited {
-      background-color: #FFB347;
+      background-color: #6EBEE1;
-      color: #1F2230;
+      color: #000;
+    }
+    .btn-learn img {
+      filter: brightness(1);
     }
     .btn-meshcore img {
       filter: brightness(0) invert(1);
@@ -263,9 +298,12 @@
       }
       .splash-box {
         padding: 2em;
+        margin: 1em 0;
+        width: calc(100% - 5em);
       }
       .top-section {
-        padding-bottom: 20px;
+        margin: -2em -2em 0 -2em;
+        padding: 2em 2em 50px 2em;
       }
       .logo {
         width: 335px;
@@ -294,6 +332,10 @@
       .splash-box {
         padding: 1.5em;
       }
+      .top-section {
+        margin: -1.5em -1.5em 0 -1.5em;
+        padding: 1.5em 1.5em 50px 1.5em;
+      }
       .logo {
         width: 300px;
       }
@@ -314,35 +356,38 @@
   <div class="overlay"></div>
   <div class="splash-box">
     <div class="top-section">
-      <img src="logo_sm.png" alt="CT Mesh Logo" class="logo" />
+      <img src="logo_sm.png?2026" alt="CT Mesh Logo" class="logo" />
       <div class="text-content">
         <p class="sub-header">A Connecticut Mesh Technologies User Group</p>
-        <a href="mailto:noah@ctmesh.org" rel="nofollow noindex"><img src="email.svg" alt="Email" /></a>
+        <a href="mailto:contact@ctmesh.org" class="email-link" rel="nofollow noindex"><img src="email.svg" alt="Email" /></a>
+      </div>
+      <div class="btn-group" style="margin-bottom: 1em;">
+        <a href="https://ctmesh.org/discord" target="_blank" class="btn btn-discord">
+          <img src="discord.svg" alt="Discord" />
+          <div class="btn-text">
+            Join our Discord
+            <small>Chat with the community</small>
+          </div>
+        </a>
+        <a href="why-run-a-node.html" class="btn btn-learn">
+          <img src="info.svg" alt="Learn about mesh networking" />
+          <div class="btn-text">
+            Why Mesh?
+            <small>Learn about the mesh!</small>
+          </div>
+        </a>
+      </div>
+      <div class="wave-divider">
+        <svg viewBox="0 0 1440 60" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M0,30 C240,60 480,0 720,30 C960,60 1200,0 1440,30 L1440,60 L0,60 Z" fill="#EBEBEB"/>
+        </svg>
       </div>
     </div>
     <div class="btn-groups">
-      <div class="section">
-        <div class="btn-group">
-          <a href="https://ctmesh.org/discord" target="_blank" class="btn btn-discord">
-            <img src="discord.svg" alt="Discord" />
-            <div class="btn-text">
-              Join our Discord
-              <small>Chat with the community</small>
-            </div>
-          </a>
-          <a href="why-run-a-node.html" class="btn btn-learn">
-            <img src="info.svg" alt="Learn about mesh networking" />
-            <div class="btn-text">
-              Why Mesh Matters
-              <small>Learn about the mesh!</small>
-            </div>
-          </a>
-        </div>
-      </div>
       <div class="section">
         <p class="section-title">MeshCore</p>
         <div class="btn-group">
-          <a href="https://meshcore.co.uk/" target="_blank" class="btn btn-meshcore">
+          <a href="https://meshcore.io/" target="_blank" class="btn btn-meshcore">
             <img src="meshcore.svg" alt="MeshCore" />
             <div class="btn-text">
               MeshCore
@@ -376,7 +421,7 @@
               <small>About the project</small>
             </div>
           </a>
-          <a href="https://map.ctmesh.org/?lat=41.734429390721&lng=287.3501586914063&zoom=10" target="_blank" class="btn">
+          <a href="https://meshtastic-map.ctmesh.org/?lat=41.734429390721&lng=287.3501586914063&zoom=10" target="_blank" class="btn">
             <img src="map.svg" alt="Map" />
             <div class="btn-text">
               Node Map

meshcore-resources.html

@@ -10,23 +10,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -37,14 +52,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -122,12 +138,19 @@
       font-size: 15px;
       text-decoration: none;
     }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
       width: 300px;
@@ -136,7 +159,7 @@
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .back-link,
     .back-link:visited {
@@ -193,11 +216,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -210,9 +241,11 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-    </a>
+        <img src="logo_sm.png" alt="CT Mesh" />
+      </a>
+    </div>
     <h1>MeshCore Resources</h1>
 
     <h2>Web Tools</h2>
@@ -226,8 +259,8 @@
     </div>
 
     <h2>Official Links</h2>
-    <p><a href="https://meshcore.co.uk/" target="_blank">meshcore.co.uk</a></p>
+    <p><a href="https://meshcore.io/" target="_blank">meshcore.io</a></p>
-    <p><a href="https://flasher.meshcore.co.uk/" target="_blank">flasher.meshcore.co.uk</a></p>
+    <p><a href="https://flasher.meshcore.io/" target="_blank">flasher.meshcore.io</a></p>
     <div class="note"><strong>Note:</strong> the flasher requires WebSerial or Web Bluetooth support in your browser</div>
 
     <h2>MQTT</h2>

meshtastic-resources.html

@@ -10,23 +10,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -37,14 +52,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -140,12 +156,19 @@
       margin: 0.75em 0 0.5em;
       font-size: 0.95em;
     }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
       width: 300px;
@@ -154,7 +177,7 @@
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .back-link {
       margin-top: 1.5em;
@@ -208,11 +231,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -225,16 +256,18 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-    </a>
+        <img src="logo_sm.png" alt="CT Mesh" />
+      </a>
+    </div>
     <h1>Meshtastic Resources</h1>
 
     <h2>Community-run Web Tools</h2>
     <div class="community-tools">
       <p><em>These tools use data reported to our MQTT server by nodes across the state.</em></p>
       <ul>
-        <li><a href="https://map.ctmesh.org/?lat=41.6558113360196&lng=287.3377990722657&zoom=10" target="_blank">Meshtastic Map</a> - live map of Meshtastic nodes CT Mesh has heard</li>
+        <li><a href="https://meshtastic-map.ctmesh.org/?lat=41.6558113360196&lng=287.3377990722657&zoom=10" target="_blank">Meshtastic Map</a> - live map of Meshtastic nodes CT Mesh has heard</li>
         <li><a href="https://meshtastic.liamcottle.net/?lat=26.58852714730864&lng=285.11718750000006&zoom=2" target="_blank">Global Map</a> - Meshtastic nodes around the world</li>
         <li><a href="https://malla.ctmesh.org/" target="_blank">Malla</a> - deeper packet-level metrics and mesh performance insights fed from MQTT</li>
         <li><a href="https://potato.ctmesh.org/" target="_blank">PotatoMesh</a> <strong>NEW!</strong> - packet, chat, node list, and map fed from RF on Box Mountain</li>
@@ -255,7 +288,7 @@
     <p>Key size: 128 bit</p>
 
     <h2>MQTT</h2>
-    <p>Our MQTT broker is <em>uplink-only</em> and designed for fixed nodes across the state to serve as gateway nodes. Its purpose is not to bridge gaps or extend mesh coverage, but to report local traffic to our own <a href="https://map.ctmesh.org" target="_blank">map</a> and other web-based tools for analytical data and metrics to assess the mesh's performance. <strong>This role is best suited for stable, well-placed nodes with reliable coverage.</strong> If that describes your setup, follow the steps at on <a href="https://meshinfo.ctmesh.org/" target="_blank">this page</a> to get set up.</p>
+    <p>Our MQTT broker is <em>uplink-only</em> and designed for fixed nodes across the state to serve as gateway nodes. Its purpose is not to bridge gaps or extend mesh coverage, but to report local traffic to our own <a href="https://meshtastic-map.ctmesh.org" target="_blank">map</a> and other web-based tools for analytical data and metrics to assess the mesh's performance. <strong>This role is best suited for stable, well-placed nodes with reliable coverage.</strong> If that describes your setup, follow the steps at on <a href="https://meshinfo.ctmesh.org/" target="_blank">this page</a> to get set up.</p>
 
     <h3>Key Settings</h3>
     <div class="code-block">

why-run-a-node.html

@@ -11,23 +11,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -38,14 +53,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -125,12 +141,19 @@
     .btn-discord img {
       filter: brightness(0) invert(1);
     }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
       width: 300px;
@@ -139,7 +162,7 @@
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .button-row {
       display: flex;
@@ -200,11 +223,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -223,9 +254,11 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-    </a>
+        <img src="logo_sm.png" alt="CT Mesh" />
+      </a>
+    </div>
 
     <h1 class="page-title">Why Run a Mesh Node?</h1>
     <p class="subtitle">Learn about the mesh!</p>
@@ -285,7 +318,7 @@
     <p>Start with our local guides, then review official project docs and community channels to choose the right platform for your goals.</p>
     <div class="button-row">
       <a class="btn btn-secondary" href="meshcore-resources.html">MeshCore Guides & Tools</a>
-      <a class="btn btn-secondary" href="https://meshcore.co.uk/" target="_blank">Official MeshCore Site</a>
+      <a class="btn btn-secondary" href="https://meshcore.io/" target="_blank">Official MeshCore Site</a>
     </div>
     <div class="button-row">
       <a class="btn" href="meshtastic-resources.html">Meshtastic Guides & Tools</a>