@micropage-sh/cli 2.0.0 → 2.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@micropage-sh/cli",
-  "version": "2.0.0",
+  "version": "2.0.7",
   "description": "CLI for micropage.sh - create, sync, and publish microsites",
   "main": "src/index.js",
   "bin": {

package/src/commands/builds.js

@@ -11,6 +11,7 @@ const {
   getValidAccessToken,
   getMaxDeployEventIdForBuild,
   streamDeployEventsUntilDone,
+  uploadAssetsWithToken,
 } = require('../supabase');
 const { getProjectConfig, setProjectConfig } = require('../auth');
 const { readPageFilesFromDir } = require('../parser');
@@ -139,6 +140,23 @@ async function push(options = {}) {
     process.exit(1);
   }
 
+  // Upload new files in assets/ to project Files before parsing,
+  // so `img: <- name` lookups can resolve against just-uploaded files.
+  try {
+    const accessToken = await getValidAccessToken();
+    const uploaded = await uploadAssetsWithToken(
+      accessToken,
+      config.projectId,
+      cwd,
+      (filename) => console.log(`Uploaded asset: ${filename}`),
+    );
+    if (uploaded > 0) console.log(`Uploaded ${uploaded} asset(s).`);
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Asset upload failed:', err.message);
+    process.exit(1);
+  }
+
   // Parse content via parser API
   console.log('Parsing content…');
   let jsonContent;

package/src/commands/links.js

@@ -3,13 +3,7 @@
 const { execSync } = require('child_process');
 const { db, handleAuthError } = require('../supabase');
 const { getProjectConfig } = require('../auth');
-const { APP_URL } = require('../config');
-
-function projectUrl(domain) {
-  if (!domain) return null;
-  if (domain.startsWith('http')) return domain;
-  return `https://${domain}.pages.dev`;
-}
+const { APP_URL, projectUrl } = require('../config');
 
 function copyToClipboard(text) {
   const cmds = [
@@ -41,7 +35,7 @@ async function getProject(cwd) {
   try {
     const project = await db
       .from('projects')
-      .select('id,name,domain')
+      .select('id,name,domain,custom_domain')
       .eq('id', config.projectId)
       .single();
     return project || config;
@@ -56,7 +50,7 @@ async function getProject(cwd) {
 async function preview() {
   const cwd = process.cwd();
   const project = await getProject(cwd);
-  const url = projectUrl(project.domain);
+  const url = projectUrl(project.domain, project.custom_domain);
 
   if (!url) {
     console.error('No domain set for this project. Publish first.');
@@ -76,7 +70,7 @@ async function preview() {
 async function copyLink() {
   const cwd = process.cwd();
   const project = await getProject(cwd);
-  const url = projectUrl(project.domain);
+  const url = projectUrl(project.domain, project.custom_domain);
 
   if (!url) {
     console.error('No domain set for this project. Publish first.');

package/src/commands/login.js

@@ -2,9 +2,10 @@
 
 const http = require('http');
 const { randomBytes } = require('crypto');
-const { setSession, getSession } = require('../auth');
+const { setSession, getSession, clearSession } = require('../auth');
 const { getUserInfo, getValidAccessToken } = require('../supabase');
 const { APP_URL, SUPABASE_URL, SUPABASE_ANON_KEY } = require('../config');
+const { UPGRADE_MESSAGE, isPaidTier, getPlanTierWithToken } = require('../plan');
 
 // Find an available ephemeral port by briefly binding to port 0.
 function getFreePort() {
@@ -164,11 +165,24 @@ async function run(options = {}) {
     const existing = getSession();
     if (existing) {
       try {
-        await getValidAccessToken();
-        const email = existing.user?.email || 'unknown';
-        console.log(`Already logged in as ${email}.`);
-        console.log('Use --force to re-authenticate.');
-        return;
+        const accessToken = await getValidAccessToken();
+        const planTier = await getPlanTierWithToken(existing.user?.id, accessToken);
+        if (!isPaidTier(planTier)) {
+          clearSession();
+          console.error(UPGRADE_MESSAGE);
+          process.exit(1);
+        }
+        const displayName = existing.user?.email
+          || existing.user?.user_metadata?.full_name
+          || existing.user?.user_metadata?.user_name
+          || existing.user?.user_metadata?.name
+          || existing.user?.id;
+        if (displayName) {
+          console.log(`Already logged in as ${displayName}.`);
+          console.log('Use --force to re-authenticate.');
+          process.exit(0);
+        }
+        // No identifiable display name on the cached user — fall through to a fresh login.
       } catch {
         // Token expired or refresh failed — fall through to re-login
       }
@@ -240,10 +254,27 @@ async function run(options = {}) {
     server.close();
 
     const user = await getUserInfo(access_token);
+    if (!user?.id) {
+      console.error('Login failed: could not load user profile.');
+      process.exit(1);
+    }
+
+    const planTier = await getPlanTierWithToken(user.id, access_token);
+    if (!isPaidTier(planTier)) {
+      // Free-tier (or unconfirmed) users get no session at all.
+      console.error(UPGRADE_MESSAGE);
+      process.exit(1);
+    }
+
     setSession({ access_token, refresh_token, user });
 
-    const displayName = user?.email || user?.user_metadata?.user_name || 'unknown';
+    const displayName = user.email
+      || user.user_metadata?.full_name
+      || user.user_metadata?.user_name
+      || user.user_metadata?.name
+      || user.id;
     console.log(`Logged in as ${displayName}`);
+    process.exit(0);
   } catch (err) {
     clearTimeout(timeout);
     server.close();

package/src/commands/logout.js

@@ -9,8 +9,16 @@ function run() {
     return;
   }
   clearSession();
-  const email = session.user?.email || 'unknown';
-  console.log(`Logged out (was: ${email}).`);
+  const displayName = session.user?.email
+    || session.user?.user_metadata?.full_name
+    || session.user?.user_metadata?.user_name
+    || session.user?.user_metadata?.name
+    || session.user?.id;
+  if (displayName) {
+    console.log(`Logged out (was: ${displayName}).`);
+  } else {
+    console.log('Logged out.');
+  }
 }
 
 module.exports = { run };

package/src/commands/projects.js

@@ -23,11 +23,9 @@ const { syncAssets } = require('./files');
 // Helpers
 // ---------------------------------------------------------------------------
 
-function projectUrl(host) {
-  if (!host) return '-';
-  if (host.startsWith('http://') || host.startsWith('https://')) return host;
-  return `https://${host}`;
-}
+const { projectUrl: buildProjectUrl } = require('../config');
+const projectUrl = (slug, customDomain) =>
+  buildProjectUrl(slug, customDomain) || '-';
 
 function copyIfExists(src, dest) {
   try {
@@ -49,26 +47,69 @@ function copyExamplesAndAssetsIntoProject(dir) {
     fs.mkdirSync(examplesDest, { recursive: true });
   }
 
-  // Copy example .page files
+  // Collect full-page templates (exclude components-* demo files) for the starter pick.
+  // All examples are still copied into examples/ for the user to browse.
+  const allExampleFiles = [];
+  const starterCandidates = [];
   try {
     const files = fs.readdirSync(examplesSrc);
     for (const file of files) {
       if (!file.endsWith('.page')) continue;
-      const src = path.join(examplesSrc, file);
-      const dest = path.join(examplesDest, file);
-      copyIfExists(src, dest);
+      allExampleFiles.push(file);
+      if (!file.startsWith('components-')) {
+        starterCandidates.push(file);
+      }
     }
   } catch {
     // ignore if templates/examples missing in this build
   }
 
-  // Default logo / favicon in assets/ (uploaded on push as logo.svg / favicon.svg; examples use `logo: <- logo.svg`)
+  for (const file of allExampleFiles) {
+    const src = path.join(examplesSrc, file);
+    const dest = path.join(examplesDest, file);
+    copyIfExists(src, dest);
+  }
+
+  // Write a randomized starter landing.page at the project root.
+  if (starterCandidates.length > 0) {
+    const pick = starterCandidates[Math.floor(Math.random() * starterCandidates.length)];
+    copyIfExists(path.join(examplesSrc, pick), path.join(dir, 'landing.page'));
+  }
+
+  // Logo / favicon in assets/ — pick a random variant pair from logos/ and favicons/.
+  // Falls back to the root logo.svg / favicon.svg if the variant directories are absent or empty.
   const destAssets = path.join(dir, 'assets');
   if (!fs.existsSync(destAssets)) {
     fs.mkdirSync(destAssets, { recursive: true });
   }
-  copyIfExists(path.join(assetsSrc, 'logo.svg'), path.join(destAssets, 'logo.svg'));
-  copyIfExists(path.join(assetsSrc, 'favicon.svg'), path.join(destAssets, 'favicon.svg'));
+
+  const logosDir = path.join(assetsSrc, 'logos');
+  const faviconsDir = path.join(assetsSrc, 'favicons');
+  let usedVariant = false;
+
+  try {
+    if (fs.existsSync(logosDir)) {
+      const logoFiles = fs.readdirSync(logosDir).filter((f) => /^logo-[^.]+\.svg$/.test(f));
+      if (logoFiles.length > 0) {
+        const chosen = logoFiles[Math.floor(Math.random() * logoFiles.length)];
+        // logo-x.svg -> favicon-x.svg
+        const variantId = chosen.replace(/^logo-/, '').replace(/\.svg$/, '');
+        const matchingFavicon = path.join(faviconsDir, `favicon-${variantId}.svg`);
+        if (fs.existsSync(matchingFavicon)) {
+          copyIfExists(path.join(logosDir, chosen), path.join(destAssets, 'logo.svg'));
+          copyIfExists(matchingFavicon, path.join(destAssets, 'favicon.svg'));
+          usedVariant = true;
+        }
+      }
+    }
+  } catch {
+    // fall through to default below
+  }
+
+  if (!usedVariant) {
+    copyIfExists(path.join(assetsSrc, 'logo.svg'), path.join(destAssets, 'logo.svg'));
+    copyIfExists(path.join(assetsSrc, 'favicon.svg'), path.join(destAssets, 'favicon.svg'));
+  }
 }
 
 async function getLatestBuild(projectId) {
@@ -145,7 +186,7 @@ async function list(options = {}) {
 
   const rows = projects.map((p) => {
     const build = latestBuild[p.id];
-    const url = projectUrl(p.custom_domain || p.domain);
+    const url = projectUrl(p.domain, p.custom_domain);
     return [
       p.uuid || '-',
       p.name || '-',
@@ -195,7 +236,7 @@ async function show(uuidOrDomain, options = {}) {
     return;
   }
 
-  const url = projectUrl(project.custom_domain || project.domain);
+  const url = projectUrl(project.domain, project.custom_domain);
 
   console.log('UUID:         ', project.uuid || '-');
   console.log('Name:         ', project.name || '-');
@@ -261,9 +302,9 @@ async function create(name, options = {}) {
 
   console.log('Created project:', project.name || name);
   if (project.uuid) console.log('UUID:', project.uuid);
-  console.log('URL:', projectUrl(project.domain));
+  console.log('URL:', projectUrl(project.domain, project.custom_domain));
   console.log('Folder:', dir);
-  console.log(`\nNext: cd ${name} && touch landing.page && micropage push`);
+  console.log(`\nNext: cd ${name} && micropage push`);
 }
 
 // ---------------------------------------------------------------------------

package/src/commands/whoami.js

@@ -1,7 +1,8 @@
 'use strict';
 
-const { getSession } = require('../auth');
+const { getSession, clearSession } = require('../auth');
 const { db, getUserInfo, getValidAccessToken, handleAuthError } = require('../supabase');
+const { UPGRADE_MESSAGE, isPaidTier } = require('../plan');
 
 async function run() {
   const session = getSession();
@@ -25,35 +26,41 @@ async function run() {
     process.exit(1);
   }
 
-  console.log('User ID:   ', user.id);
-  console.log('Email:     ', user.email || '-');
-  const name =
-    user.user_metadata?.full_name ||
-    user.user_metadata?.user_name ||
-    user.user_metadata?.name ||
-    '-';
-  console.log('Name:      ', name);
-  if (user.app_metadata?.provider) {
-    console.log('Auth via:  ', user.app_metadata.provider);
-  }
-
-  // Billing / subscription overview (best-effort; do not fail whoami if this breaks).
+  // Gate access on plan first — free-tier accounts get no session and no detail dump.
   let planTier = 'free';
-  let subscription = null;
   try {
     const customer = await db
       .from('customers')
       .select('plan_tier')
       .eq('user_id', user.id)
       .single();
-    if (customer?.plan_tier) {
+    if (customer?.plan_tier === 'pro' || customer?.plan_tier === 'pro_plus') {
       planTier = customer.plan_tier;
     }
   } catch (err) {
     handleAuthError(err);
-    console.error('Warning: failed to load plan info:', err.message);
+    // If we cannot determine plan, default to free → deny CLI access below.
   }
 
+  if (!isPaidTier(planTier)) {
+    clearSession();
+    console.error(UPGRADE_MESSAGE);
+    process.exit(1);
+  }
+
+  console.log('User ID:   ', user.id);
+  console.log('Email:     ', user.email || '-');
+  const name =
+    user.user_metadata?.full_name ||
+    user.user_metadata?.user_name ||
+    user.user_metadata?.name ||
+    '-';
+  console.log('Name:      ', name);
+  if (user.app_metadata?.provider) {
+    console.log('Auth via:  ', user.app_metadata.provider);
+  }
+
+  let subscription = null;
   try {
     const subs = await db
       .from('subscriptions')

package/src/config.js

@@ -19,4 +19,30 @@ const BUILD_COMPILER_URL =
   process.env.MICROPAGE_PARSER_URL ||
   'https://build-compiler.micropage.sh';
 
-module.exports = { SUPABASE_URL, SUPABASE_ANON_KEY, APP_URL, BUILD_COMPILER_URL };
+const BASE_DOMAIN = process.env.MICROPAGE_BASE_DOMAIN || 'micropage.sh';
+
+// Live URL for a project. Prefers the customer's custom domain (a full FQDN
+// like `www.example.com`) when set; falls back to `https://<slug>.<BASE_DOMAIN>`.
+// Returns null when there's no usable identifier.
+function projectUrl(slug, customDomain) {
+  const cd = customDomain && String(customDomain).trim();
+  if (cd) {
+    return cd.startsWith('http://') || cd.startsWith('https://')
+      ? cd
+      : `https://${cd}`;
+  }
+  if (!slug) return null;
+  const s = String(slug).trim();
+  if (!s) return null;
+  if (s.startsWith('http://') || s.startsWith('https://')) return s;
+  return `https://${s}.${BASE_DOMAIN}`;
+}
+
+module.exports = {
+  SUPABASE_URL,
+  SUPABASE_ANON_KEY,
+  APP_URL,
+  BUILD_COMPILER_URL,
+  BASE_DOMAIN,
+  projectUrl,
+};

package/src/index.js

@@ -2,6 +2,7 @@
 'use strict';
 
 const { Command } = require('commander');
+const { version } = require('../package.json');
 
 const login = require('./commands/login');
 const logout = require('./commands/logout');
@@ -18,7 +19,7 @@ const program = new Command();
 program
   .name('micropage')
   .description('CLI for micropage.sh – create, sync, and publish microsites')
-  .version('2.0.0');
+  .version(version);
 
 // ---------------------------------------------------------------------------
 // Authentication

package/src/parser.js

@@ -48,18 +48,15 @@ function writePageFile(dir, content) {
   return dest;
 }
 
-const ASSET_EXTENSIONS = ['.png', '.jpg', '.jpeg', '.gif', '.webp', '.ico', '.svg'];
-
 function listAssetsFromDir(dir) {
   const assetsDir = path.join(dir, 'assets');
   if (!fs.existsSync(assetsDir)) return [];
   const entries = fs.readdirSync(assetsDir, { withFileTypes: true });
   const files = [];
   for (const e of entries) {
-    if (e.isFile()) {
-      const ext = path.extname(e.name).toLowerCase();
-      if (ASSET_EXTENSIONS.includes(ext)) files.push(e.name);
-    }
+    if (!e.isFile()) continue;
+    if (e.name.startsWith('.')) continue;
+    files.push(e.name);
   }
   return files.sort();
 }
@@ -68,5 +65,4 @@ module.exports = {
   readPageFilesFromDir,
   writePageFile,
   listAssetsFromDir,
-  ASSET_EXTENSIONS,
 };

package/src/plan.js

@@ -0,0 +1,40 @@
+'use strict';
+
+const { SUPABASE_URL, SUPABASE_ANON_KEY } = require('./config');
+
+const UPGRADE_MESSAGE = [
+  'The micropage CLI is available on paid plans only.',
+  'Your account is currently on the free plan.',
+  '',
+  'Upgrade at: https://micropage.sh/pricing',
+].join('\n');
+
+function isPaidTier(tier) {
+  return tier === 'pro' || tier === 'pro_plus';
+}
+
+// Look up plan_tier using a bearer token directly so this can be called inside
+// `login` before a session is persisted. Defaults to 'free' on any failure —
+// CLI access is denied when we cannot confirm a paid tier.
+async function getPlanTierWithToken(userId, accessToken) {
+  try {
+    const url = `${SUPABASE_URL}/rest/v1/customers?select=plan_tier&user_id=eq.${encodeURIComponent(userId)}&limit=1`;
+    const res = await fetch(url, {
+      headers: {
+        apikey: SUPABASE_ANON_KEY,
+        Authorization: `Bearer ${accessToken}`,
+      },
+    });
+    if (!res.ok) return 'free';
+    const data = await res.json();
+    const row = Array.isArray(data) ? data[0] : null;
+    if (row?.plan_tier === 'pro' || row?.plan_tier === 'pro_plus') {
+      return row.plan_tier;
+    }
+    return 'free';
+  } catch {
+    return 'free';
+  }
+}
+
+module.exports = { UPGRADE_MESSAGE, isPaidTier, getPlanTierWithToken };

package/src/supabase.js

@@ -257,13 +257,23 @@ const db = {
 // ---------------------------------------------------------------------------
 
 async function getUserInfo(accessToken) {
-  const res = await fetch(`${SUPABASE_URL}/auth/v1/user`, {
-    headers: {
-      'apikey': SUPABASE_ANON_KEY,
-      'Authorization': `Bearer ${accessToken}`,
-    },
-  });
-  if (!res.ok) return null;
+  let res;
+  try {
+    res = await fetch(`${SUPABASE_URL}/auth/v1/user`, {
+      headers: {
+        'apikey': SUPABASE_ANON_KEY,
+        'Authorization': `Bearer ${accessToken}`,
+      },
+    });
+  } catch (err) {
+    console.error(`[micropage] getUserInfo network error: ${err.message}`);
+    return null;
+  }
+  if (!res.ok) {
+    const body = await res.text().catch(() => '');
+    console.error(`[micropage] getUserInfo failed (HTTP ${res.status} from ${SUPABASE_URL}/auth/v1/user): ${body}`);
+    return null;
+  }
   return res.json();
 }
 
@@ -634,4 +644,5 @@ module.exports = {
   exchangeDeployTokenForAccessToken,
   pushWithToken,
   invokePublishBuild,
+  uploadAssetsWithToken,
 };

package/templates/assets/favicons/favicon-a.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" role="img" aria-labelledby="title desc">
+  <title>Micropage favicon — variant A</title>
+  <desc>Minimal stacked bar favicon for starter projects</desc>
+  <rect x="4" y="7" width="24" height="4" rx="2" fill="#4f46e5"/>
+  <rect x="6" y="14" width="20" height="4" rx="2" fill="#0ea5e9"/>
+  <rect x="8" y="21" width="16" height="4" rx="2" fill="#22c55e"/>
+</svg>

package/templates/assets/favicons/favicon-b.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" role="img" aria-labelledby="title desc">
+  <title>Micropage favicon — variant B</title>
+  <desc>Minimal sunrise arc favicon</desc>
+  <defs>
+    <linearGradient id="g" x1="0%" y1="100%" x2="100%" y2="0%">
+      <stop offset="0%" stop-color="#dc2626"/>
+      <stop offset="100%" stop-color="#f59e0b"/>
+    </linearGradient>
+  </defs>
+  <path d="M 4 22 A 12 12 0 0 1 28 22" stroke="url(#g)" stroke-width="5" fill="none" stroke-linecap="round"/>
+  <circle cx="16" cy="22" r="3" fill="#dc2626"/>
+</svg>

package/templates/assets/favicons/favicon-c.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" role="img" aria-labelledby="title desc">
+  <title>Micropage favicon — variant C</title>
+  <desc>Minimal concentric circles favicon in forest green</desc>
+  <circle cx="16" cy="14" r="10" fill="#166534"/>
+  <circle cx="16" cy="14" r="5" fill="#14532d"/>
+  <circle cx="16" cy="14" r="2" fill="#bbf7d0"/>
+  <rect x="14" y="24" width="4" height="6" rx="2" fill="#713f12"/>
+</svg>

package/templates/assets/favicons/favicon-d.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" role="img" aria-labelledby="title desc">
+  <title>Micropage favicon — variant D</title>
+  <desc>Minimal diamond favicon in charcoal with magenta center</desc>
+  <polygon points="16,4 28,16 16,28 4,16" fill="#1c1c1c"/>
+  <polygon points="16,11 21,16 16,21 11,16" fill="#e91e8c"/>
+</svg>

package/templates/assets/logos/logo-a.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-labelledby="title desc">
+  <title>Micropage starter logo — variant A</title>
+  <desc>Abstract stacked rectangles suggesting pages</desc>
+  <defs>
+    <linearGradient id="g" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#4f46e5"/>
+      <stop offset="100%" stop-color="#06b6d4"/>
+    </linearGradient>
+  </defs>
+  <rect x="10" y="14" width="44" height="12" rx="3" fill="url(#g)"/>
+  <rect x="14" y="28" width="36" height="10" rx="3" fill="#111827" opacity="0.9"/>
+  <rect x="18" y="40" width="28" height="8" rx="3" fill="#111827" opacity="0.7"/>
+</svg>

package/templates/assets/logos/logo-b.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-labelledby="title desc">
+  <title>Micropage starter logo — variant B</title>
+  <desc>Abstract sunrise arc suggesting warmth and momentum</desc>
+  <defs>
+    <linearGradient id="g" x1="0%" y1="100%" x2="100%" y2="0%">
+      <stop offset="0%" stop-color="#dc2626"/>
+      <stop offset="50%" stop-color="#ea580c"/>
+      <stop offset="100%" stop-color="#f59e0b"/>
+    </linearGradient>
+  </defs>
+  <path d="M 8 44 A 24 24 0 0 1 56 44" stroke="url(#g)" stroke-width="8" fill="none" stroke-linecap="round"/>
+  <circle cx="32" cy="44" r="5" fill="#dc2626"/>
+  <line x1="32" y1="14" x2="32" y2="22" stroke="#f59e0b" stroke-width="4" stroke-linecap="round"/>
+  <line x1="14" y1="26" x2="20" y2="30" stroke="#ea580c" stroke-width="3" stroke-linecap="round"/>
+  <line x1="50" y1="26" x2="44" y2="30" stroke="#ea580c" stroke-width="3" stroke-linecap="round"/>
+</svg>

package/templates/assets/logos/logo-c.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-labelledby="title desc">
+  <title>Micropage starter logo — variant C</title>
+  <desc>Abstract leaf and root mark suggesting growth and earth</desc>
+  <circle cx="32" cy="20" r="14" fill="#166534"/>
+  <circle cx="32" cy="20" r="8" fill="#14532d"/>
+  <circle cx="32" cy="20" r="4" fill="#bbf7d0"/>
+  <rect x="30" y="34" width="4" height="14" rx="2" fill="#713f12"/>
+  <path d="M 20 48 Q 32 38 44 48" stroke="#713f12" stroke-width="3" fill="none" stroke-linecap="round"/>
+</svg>

package/templates/assets/logos/logo-d.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-labelledby="title desc">
+  <title>Micropage starter logo — variant D</title>
+  <desc>Bold geometric diamond mark in charcoal with magenta accent</desc>
+  <polygon points="32,8 52,32 32,56 12,32" fill="#1c1c1c"/>
+  <polygon points="32,18 44,32 32,46 20,32" fill="#2e2e2e"/>
+  <polygon points="32,26 38,32 32,38 26,32" fill="#e91e8c"/>
+</svg>