update redirects

Reviewed-on: #7

_redirects

@@ -1 +1,3 @@
-/discord https://discord.gg/m4F328as3K 302
+/discord https://discord.gg/m4F328as3K 302
+/merch https://ctmesh.redbubble.com 302
+/store https://ctmesh.redbubble.com 302

index.html

@@ -7,14 +7,14 @@
 
   <!-- Site Description & Keywords -->
   <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, Meshtastic, MeshCore, Connecticut, CT, community, mesh networking, user group, Discord, map">
+  <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?3">
+  <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?3">
+  <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?3">
+  <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?3">
+  <link rel="icon" type="image/png" href="favicon.png?2026-14">
-  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?2026-1">
-  <meta name="msapplication-TileColor" content="#67EA94">
+  <meta name="msapplication-TileColor" content="#6EBEE1">
-  <meta name="msapplication-TileImage" content="favicon.png?3">
+  <meta name="msapplication-TileImage" content="favicon.png?2026-1">
-  <meta name="theme-color" content="#67EA94">
+  <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;
@@ -67,17 +82,18 @@
     .overlay {
       position: fixed;
       top: 0;
-      left: 0; 
+      left: 0;
-      width: 100%; 
+      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);
@@ -90,23 +106,42 @@
     }
     .top-section {
       display: flex;
+      flex-direction: column;
       align-items: center;
       justify-content: center;
-      gap: 1em;
+      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: 200px;
+      width: 540px;
       height: auto;
-      padding-right: 30px;
     }
     .text-content {
-      text-align: left;
+      text-align: center;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 0.25em;
     }
     .text-content h1 {
       margin: 0;
@@ -117,7 +152,9 @@
     }
     .sub-header {
       font-weight: bold;
-      padding-bottom: 10px;
+      padding-bottom: 4px;
+      margin: 0;
+      color: #e0e0e0;
     }
     .btn {
       display: flex;
@@ -167,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);
@@ -258,18 +298,16 @@
       }
       .splash-box {
         padding: 2em;
+        margin: 1em 0;
+        width: calc(100% - 5em);
       }
       .top-section {
-        flex-direction: column;
+        margin: -2em -2em 0 -2em;
-        padding-bottom: 20px;
+        padding: 2em 2em 50px 2em;
       }
       .logo {
-        width: 150px;
+        width: 335px;
         padding-right: 0;
-        margin-bottom: 1em;
-      }
-      .text-content {
-        text-align: center;
       }
       .btn-group {
         flex-direction: column;
@@ -294,8 +332,12 @@
       .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: 120px;
+        width: 300px;
       }
       .text-content h1 {
         font-size: 20px;
@@ -314,32 +356,34 @@
   <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">
-        <h1>CT Mesh</h1>
+        <p class="sub-header">A Connecticut Mesh Technologies User Group</p>
-        <p class="sub-header">Connecticut Mesh Technologies User Group</p>
+        <a href="mailto:noah@ctmesh.org" class="email-link" rel="nofollow noindex"><img src="email.svg" alt="Email" /></a>
-        <a href="mailto:noah@ctmesh.org" 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">

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,21 +138,28 @@
       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: 44px;
+      width: 300px;
       height: auto;
     }
     .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,10 +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">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
     <h1>MeshCore Resources</h1>
 
     <h2>Web Tools</h2>
@@ -233,18 +265,26 @@
 
     <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 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></p>
-    <p>MeshCore MQTT uplink uses <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">meshcoretomqtt</a> on a Raspberry Pi or similar Linux computer with the service installed. This configuration stanza goes in your <code>.env.local</code> file after the first two MQTT servers that upload to analyzer.letsmesh.net. <strong>This also requires a custom firmware.</strong> See <a href="https://analyzer.letsmesh.net/observer/onboard" target="_blank">custom repeater firmware setup</a>.</p>
+    <p>MeshCore MQTT uplink uses <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">meshcoretomqtt</a> on a Raspberry Pi or similar Linux computer with the service installed. Configure it with a <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">Toml file</a> at <code>/etc/mctomqtt/config.d/00-user.toml</code>, with region set in your existing <code>[general]</code> section as <code>iata = "BDL"</code>, and a custom broker named <code>ctmesh</code>. The block below should be added at the end of the config file. Fill in your own broker credentials. <strong>This also requires custom firmware.</strong> See <a href="https://analyzer.letsmesh.net/observer/onboard" target="_blank">custom repeater firmware setup</a>.</p>
 
     <div class="code-block">
       <button class="copy-btn" type="button" data-copy-target="meshcore-mqtt">Copy all</button>
-      <pre id="meshcore-mqtt"># MQTT Broker 3 - CT Mesh
+      <pre id="meshcore-mqtt">[[broker]]
-MCTOMQTT_MQTT3_ENABLED=true
+name = "ctmesh"
-MCTOMQTT_MQTT3_SERVER=mqtt.ctmesh.org
+enabled = true
-MCTOMQTT_MQTT3_PORT=1883
+server = "mqtt.ctmesh.org"
-MCTOMQTT_MQTT3_USE_TLS=false
+port = 1883
-MCTOMQTT_MQTT3_USERNAME=meshdev
+transport = "tcp"
-MCTOMQTT_MQTT3_PASSWORD=large4cats</pre>
+keepalive = 60
+qos = 0
+retain = true
+
+[broker.auth]
+method = "password"
+username = "meshdev"
+password = "large4cats"</pre>
     </div>
+    <p class="note"><strong>Note:</strong> The <code>meshdev</code>/<code>large4cats</code> credentials are intentionally shared secrets for this broker. We recognize the security implications. Specific credentials to this broker can be requested.</p>
 
     <a class="btn back-link" href="index.html">Back to CT Mesh</a>
     <footer class="site-footer">

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,21 +156,28 @@
       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: 44px;
+      width: 300px;
       height: auto;
     }
     .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,10 +256,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">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
     <h1>Meshtastic Resources</h1>
 
     <h2>Community-run Web Tools</h2>

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,21 +141,28 @@
     .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: 44px;
+      width: 300px;
       height: auto;
     }
     .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,10 +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">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
 
     <h1 class="page-title">Why Run a Mesh Node?</h1>
     <p class="subtitle">Learn about the mesh!</p>