dev

src/_flightdeck/shortcodes.js

@@ -13,6 +13,7 @@ const codepen = require("./shortcodes/codepen");
 const copyright = require("./shortcodes/copyright");
 const image = require("./shortcodes/image");
 const version = require("./shortcodes/flightdeck-version");
+const email = require("./shortcodes/email");
 
 module.exports = (config) => {
   config.addShortcode("blockquote", blockquote);
@@ -22,4 +23,5 @@ module.exports = (config) => {
   config.addShortcode("copyright", copyright);
   config.addShortcode("image", image);
   config.addShortcode("version", version);
+  config.addShortcode("email", email);
 };

src/_flightdeck/shortcodes/buttons.js

@@ -1,5 +1,6 @@
 /**
  * Button Component – FlightDeck Autopilot
+ * @description Makes a button component
  * @param {Object} [params] - The parameters for the button (all optional)
  * @param {string} [params.type='button'] - The type of button (submit/reset/button)
  * @param {string} [params.text='Button'] - The text to display in the button
@@ -13,6 +14,7 @@ const button = (params = {}) => {
 
 /**
  * Button Component for Links – FlightDeck Autopilot
+ * @description Makes a link look like a button
  * @param {Object} [params] - The parameters for the link button (all optional)
  * @param {string} [params.url='/'] - The link to a page or external URL
  * @param {string} [params.text='Button'] - The text to display in the link

src/_flightdeck/shortcodes/email.js

@@ -0,0 +1,20 @@
+/**
+ * Email obfuscation shortcode with CSS
+ * @param {Object} [params={}] - The parameters for email obfuscation
+ * @param {string} [params.address] - The email address to obfuscate
+ * @param {string} [params.honeypot='honeypot'] - The honeypot text to insert (will be hidden with CSS)
+ * @returns {string} HTML string with obfuscated email
+ * @example
+ * // Basic usage
+ * {% email address="your-email@example.com" %}
+ * // With custom honeypot
+ * {% email address="your-email@example.com", honeypot="nospam" %}
+ * @typedef {Object} EmailParams
+ * @property {string} [address] - The email address to obfuscate
+ * @property {string} [honeypot] - The honeypot text to insert
+ * @type {(params?: EmailParams) => string}
+ */
+module.exports = (params = {}) => {
+  const { address, honeypot = 'honeypot' } = params;
+  return `<span class="email">${address}<b>${honeypot}.com</b></span>`;
+};

src/_flightdeck/workflow.js

@@ -11,7 +11,7 @@
 module.exports = (config, options) => {
   config.setQuietMode(true); // reduce console
   config.setServerOptions({
-    port: 4000, // old habits die hard - 4000 is the default port for Jekyll
+    port: 4321, // like Astro
     showVersion: true, // show the server version number on the command line
     showAllHosts: false, // show local network IP address for device testing
   });

src/_includes/data/site.js

@@ -20,6 +20,8 @@ const site = {
       profile: "edheltzel",
     },
   ],
+  gtag: '0000000000',
+  env: process.env.ENV,
 };
 
 module.exports = site;

src/_includes/partials/footer.njk

@@ -4,5 +4,6 @@
     {{ site.title }}&nbsp;•&nbsp;<a
       href="https://github.com//edheltzel/flightdeck/"
       title="{{ site.title }} version" >{% version %}</a>
+      • {% email address="email@example.com", honeypot="nospam" %}
   </small>
 </footer>

src/_includes/partials/meta.njk

@@ -19,3 +19,6 @@
 <meta rel="canonical" href="{{ page.url | baseUrl }}"/>
 <link rel="stylesheet" href="/assets/styles/app.css"/>
 <script type="module" src="/assets/js/app.js" defer></script>
+{% if site.env === "production" %}
+ {% include "utilities/analytics.njk" %}
+{% endif %}

src/_includes/utilities/analytics.njk

@@ -1,6 +1,6 @@
-{%- macro gtagId(gtag) -%}
+
   <!-- Global site tag (gtag.js) - Google Analytics -->
-  <script async src="https://www.googletagmanager.com/gtag/js?id={{ gtag }}"></script>
+  <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.gtag }}"></script>
   <script>
     window.dataLayer = window.dataLayer || [];
     function gtag() {
@@ -10,4 +10,3 @@
 
     gtag('config', '{{ gtag }}');
   </script>
-{%- endmacro -%}

src/assets/styles/_autopilot/_utilities/text.css

@@ -71,3 +71,7 @@ font: transform text display properties
     font-size: var(--text-poster-l);
   }
 }
+
+.email b{
+  display: none;
+}