@eox/pages-theme-eox 1.8.0 → 2.0.0-alpha.1

package/src/pages/author/[author].md

@@ -0,0 +1,4 @@
+---
+layout: blog
+title: Author posts
+---

package/src/pages/author/[author].paths.js

@@ -0,0 +1,60 @@
+import fs from "node:fs";
+import path from "node:path";
+
+export default {
+  paths() {
+    const postsDir = path.resolve(process.cwd(), "_posts");
+    if (!fs.existsSync(postsDir)) return [];
+
+    const files = fs.readdirSync(postsDir).filter((f) => f.endsWith(".md"));
+    const allAuthors = new Set();
+
+    for (const file of files) {
+      const filePath = path.join(postsDir, file);
+      const content = fs.readFileSync(filePath, "utf8");
+
+      // Extract yaml frontmatter block
+      const frontmatterMatch = content.match(/^---\r?\n([\s\S]*?)\r?\n---/);
+      if (frontmatterMatch) {
+        const yaml = frontmatterMatch[1];
+
+        // 1. Match inline array or string style author
+        const authorMatch = yaml.match(/author:\s*(.*?)\r?\n/);
+        if (authorMatch) {
+          const val = authorMatch[1].trim();
+          if (val.startsWith("[") && val.endsWith("]")) {
+            val
+              .slice(1, -1)
+              .split(",")
+              .forEach((a) => {
+                const clean = a.trim().replace(/['"]/g, "").toLowerCase();
+                if (clean) allAuthors.add(clean);
+              });
+          } else if (val) {
+            const clean = val.replace(/['"]/g, "").toLowerCase();
+            if (clean) allAuthors.add(clean);
+          }
+        }
+
+        // 2. Match block list style authors
+        const authorBlockMatch = yaml.match(
+          /author:\r?\n((?:\s*-\s*.*\r?\n?)+)/,
+        );
+        if (authorBlockMatch) {
+          const lines = authorBlockMatch[1].split(/\r?\n/);
+          for (const line of lines) {
+            const m = line.match(/^\s*-\s*["']?(.*?)["']?\s*$/);
+            if (m && m[1]) {
+              const auth = m[1].trim().toLowerCase();
+              if (auth) allAuthors.add(auth);
+            }
+          }
+        }
+      }
+    }
+
+    return Array.from(allAuthors).map((author) => {
+      return { params: { author } };
+    });
+  },
+};

package/src/pages/blog.md

@@ -0,0 +1,4 @@
+---
+layout: blog
+title: Blog
+---

package/src/pages/tag/[tag].md

@@ -0,0 +1,4 @@
+---
+layout: blog
+title: Tag list
+---

package/src/pages/tag/[tag].paths.js

@@ -0,0 +1,49 @@
+import fs from "node:fs";
+import path from "node:path";
+
+export default {
+  paths() {
+    const postsDir = path.resolve(process.cwd(), "_posts");
+    if (!fs.existsSync(postsDir)) return [];
+
+    const files = fs.readdirSync(postsDir).filter((f) => f.endsWith(".md"));
+    const allTags = new Set();
+
+    for (const file of files) {
+      const filePath = path.join(postsDir, file);
+      const content = fs.readFileSync(filePath, "utf8");
+
+      // Robust YAML frontmatter parser
+      const frontmatterMatch = content.match(/^---\r?\n([\s\S]*?)\r?\n---/);
+      if (frontmatterMatch) {
+        const yaml = frontmatterMatch[1];
+
+        // 1. Match list-style tags
+        const tagsBlockMatch = yaml.match(/tags:\r?\n((?:\s*-\s*.*\r?\n?)+)/);
+        if (tagsBlockMatch) {
+          const lines = tagsBlockMatch[1].split(/\r?\n/);
+          for (const line of lines) {
+            const m = line.match(/^\s*-\s*["']?(.*?)["']?\s*$/);
+            if (m && m[1]) {
+              const tag = m[1].trim().toLowerCase();
+              if (tag) allTags.add(tag);
+            }
+          }
+        }
+
+        // 2. Match inline-array style tags
+        const inlineMatch = yaml.match(/tags:\s*\[([\s\S]*?)\]/);
+        if (inlineMatch) {
+          inlineMatch[1].split(",").forEach((t) => {
+            const tag = t.trim().replace(/['"]/g, "").toLowerCase();
+            if (tag) allTags.add(tag);
+          });
+        }
+      }
+    }
+
+    return Array.from(allTags).map((tag) => {
+      return { params: { tag } };
+    });
+  },
+};

package/src/pages/tag.md

@@ -0,0 +1,4 @@
+---
+layout: tags
+title: Tags
+---

package/src/pages/team.md

@@ -0,0 +1,4 @@
+---
+layout: team
+title: Team
+---

package/src/posts.data.js

@@ -0,0 +1,96 @@
+import { createContentLoader } from "vitepress";
+
+function cleanMarkdown(src) {
+  if (!src) return "";
+
+  // 1. If there's a <!-- more --> tag, truncate there
+  const moreIndex = src.indexOf("<!-- more -->");
+  let content = moreIndex !== -1 ? src.slice(0, moreIndex) : src;
+
+  // 2. Remove frontmatter (just in case)
+  if (content.startsWith("---")) {
+    const nextThree = content.indexOf("---", 3);
+    if (nextThree !== -1) {
+      content = content.slice(nextThree + 3);
+    }
+  }
+
+  // 3. Remove standard markdown and HTML elements
+  let text = content
+    // Remove custom containers like ::: info or ::: warning ... :::
+    .replace(/:::[^\n]*\n/g, "")
+    .replace(/:::/g, "")
+    // Remove HTML comments
+    .replace(/<!--[\s\S]*?-->/g, "")
+    // Remove images: ![alt](url)
+    .replace(/!\[.*?\]\(.*?\)/g, "")
+    // Remove links but keep text: [text](url)
+    .replace(/\[(.*?)\]\(.*?\)/g, "$1")
+    // Remove blockquotes: > quote
+    .replace(/^\s*>\s+/gm, "")
+    // Clean up lists: * list item, - list item, 1. list item
+    .replace(/^\s*[\*+-]\s+/gm, "")
+    .replace(/^\s*\d+\.\s+/gm, "")
+    // Remove tables/borders
+    .replace(/\|/g, "")
+    .replace(/[-]{3,}/g, "")
+    // Remove custom components / HTML tags but keep nested content
+    .replace(/<[^>]+>/g, "")
+    // Remove bold/italic formatting
+    .replace(/(\*\*|__)(.*?)\1/g, "$2")
+    .replace(/(\*|_)(.*?)\1/g, "$2")
+    // Remove inline code
+    .replace(/`(.*?)`/g, "$1")
+    // Replace multiple newlines or spaces with a single space
+    .replace(/\s+/g, " ")
+    .trim();
+
+  return text;
+}
+
+function getExcerpt(src, maxLength = 200) {
+  const text = cleanMarkdown(src);
+  if (text.length > maxLength) {
+    // Try to truncate at a word boundary within the last 30 characters
+    const truncated = text.slice(0, maxLength);
+    const lastSpace = truncated.lastIndexOf(" ");
+    if (lastSpace > maxLength - 30) {
+      return truncated.slice(0, lastSpace) + " ...";
+    }
+    return truncated + " ...";
+  }
+  return text;
+}
+
+export default createContentLoader("_posts/*.md", {
+  includeSrc: true,
+  transform(rawData) {
+    return rawData
+      .map((page) => {
+        // Normalize single author / authors array
+        const author = page.frontmatter.author || "";
+        const authors = Array.isArray(author) ? author : [author];
+
+        const excerpt =
+          page.frontmatter.description ||
+          page.frontmatter.summary ||
+          getExcerpt(page.src);
+
+        return {
+          title: page.frontmatter.title || "",
+          url: page.url,
+          date: page.frontmatter.date || "",
+          authors,
+          tags: page.frontmatter.tags || [],
+          categories: page.frontmatter.categories || [],
+          coverImage:
+            page.frontmatter.coverImage || page.frontmatter.image || "",
+          excerpt,
+        };
+      })
+      .sort((a, b) => {
+        // Sort descending by date (newest first)
+        return b.date.localeCompare(a.date);
+      });
+  },
+});

package/src/style.css

@@ -86,6 +86,12 @@ body {
   padding-right: 0;
 }
 
+/* Ensure full-width layout sections touch and stack seamlessly without gaps */
+.VPHome .full-width:not(.home-hero-section) {
+  margin-block-start: 0 !important;
+  margin-block-end: 0 !important;
+}
+
 .VPHome .vp-doc a {
   font-weight: 400;
   color: inherit;
@@ -345,3 +351,157 @@ eox-feedback-button {
     z-index: calc(var(--vp-z-index-sidebar) + 2);
   }
 }
+
+/* ==========================================================================
+   Simple Pages (layout: page) styling improvements
+   ========================================================================== */
+
+.layout-page {
+  background-color: var(--surface) !important;
+}
+
+.layout-page .VPPage {
+  max-width: 1200px;
+  margin-inline: auto;
+  padding-block-start: 66px; /* Exactly 156px from top of viewport (90px navbar + 66px padding) */
+  padding-block-end: 96px;
+  padding-inline: 32px;
+}
+
+/* Remove double inner padding on custom layout elements to ensure absolute alignment */
+.layout-page .VPPage .holder {
+  padding-inline: 0 !important;
+}
+
+/* Constrain standard reading elements to 1000px max-width, while letting full-width custom page components span 1200px */
+.layout-page .VPPage > div > div > :is(p, ul, ol, blockquote, h1, h2, h3, h4, h5, h6, pre, table) {
+  max-width: 1000px;
+  margin-inline-start: 0;
+  margin-inline-end: auto;
+  width: 100%;
+}
+
+@media (max-width: 960px) {
+  .layout-page .VPPage {
+    padding-inline: 24px;
+    padding-block-start: 48px;
+    padding-block-end: 64px;
+  }
+}
+
+@media (max-width: 640px) {
+  .layout-page .VPPage {
+    padding-inline: 16px;
+    padding-block-start: 36px;
+    padding-block-end: 48px;
+  }
+}
+
+/* Typography on simple pages inside main page content */
+.layout-page .VPPage h1 {
+  font-size: 2rem; /* Exactly 32px */
+  line-height: 1.25;
+  margin-block-start: 0;
+  margin-block-end: 1.5rem;
+  color: var(--on-surface);
+  font-weight: 700;
+}
+
+@media (max-width: 640px) {
+  .layout-page .VPPage h1 {
+    font-size: 1.75rem; /* 28px on mobile */
+  }
+}
+
+.layout-page .VPPage h2 {
+  font-size: 1.5rem; /* Exactly 24px */
+  line-height: 1.35;
+  margin-block-start: 3rem;
+  margin-block-end: 1.125rem;
+  color: var(--on-surface);
+  border-top: none;
+}
+
+@media (max-width: 640px) {
+  .layout-page .VPPage h2 {
+    font-size: 1.375rem; /* 22px on mobile */
+  }
+}
+
+.layout-page .VPPage h3 {
+  font-size: clamp(1.2rem, 3.5vw, 1.45rem);
+  line-height: 1.3;
+  margin-block-start: 2.25rem;
+  margin-block-end: 0.875rem;
+  color: var(--on-surface);
+}
+
+.layout-page .VPPage h4 {
+  font-size: 1.15rem;
+  line-height: 1.4;
+  margin-block-start: 1.75rem;
+  margin-block-end: 0.75rem;
+  color: var(--on-surface);
+}
+
+.layout-page .VPPage p {
+  font-size: 1rem; /* Exactly 16px */
+  line-height: 1.65;
+  margin-block-start: 0;
+  margin-block-end: 1.5rem;
+  color: var(--on-surface);
+}
+
+/* Lists */
+.layout-page .VPPage ul,
+.layout-page .VPPage ol {
+  margin-block-start: 0;
+  margin-block-end: 1.5rem;
+  padding-inline-start: 1.5rem;
+}
+
+.layout-page .VPPage li {
+  margin-block-end: 0.5rem;
+  line-height: 1.6;
+  font-size: 1rem; /* Exactly 16px */
+  color: var(--on-surface);
+}
+
+/* Inline links readability fix */
+.layout-page .VPPage a:not(.button) {
+  color: var(--primary);
+  text-decoration: underline;
+  text-underline-offset: 3px;
+  text-decoration-thickness: 1px;
+  transition: color 0.2s ease, text-decoration-color 0.2s ease;
+}
+
+.layout-page .VPPage a:not(.button):hover {
+  opacity: 0.85;
+  text-decoration-thickness: 2px;
+}
+
+/* Scroll Anchors, Blockquotes & Code */
+.layout-page .VPPage blockquote {
+  border-inline-start: 4px solid var(--primary);
+  padding-inline-start: 1.25rem;
+  margin-inline: 0;
+  margin-block: 2rem;
+  font-style: italic;
+  color: var(--on-surface-variant);
+}
+
+.layout-page .VPPage sup,
+.layout-page .VPPage sub {
+  font-size: 0.8rem;
+  line-height: 1;
+}
+
+.layout-page .VPPage pre {
+  margin-block: 1.5rem;
+  padding: 1rem;
+  border-radius: 8px;
+  background-color: var(--surface-container-low);
+  overflow-x: auto;
+}
+

package/src/tagUtils.js

@@ -0,0 +1,148 @@
+export const tagThemes = [
+  // Managed cloud workspace (Category 0)
+  [
+    "eoxhub",
+    "eurodatacube",
+    "cloud-processing",
+    "mundi",
+    "jupyter",
+    "vre",
+    "processing",
+  ],
+  // Data management (Category 1)
+  [
+    "data-access",
+    "catalog",
+    "eo-data",
+    "open-search",
+    "ard",
+    "eoxserver",
+    "django",
+    "sxcat",
+    "data-cubes",
+    "opensearch",
+  ],
+  // Data visualization (Category 2)
+  [
+    "3d",
+    "animation",
+    "cesium",
+    "globe",
+    "ndvi",
+    "plotty",
+    "graphly",
+    "geotiff-js",
+    "client",
+    "visualization",
+    "cog",
+    "geotiff",
+    "openlayers",
+    "vue-js",
+    "eoxc",
+    "dashboard",
+    "javascript",
+    "leaflet",
+    "d3",
+    "webgl",
+    "video",
+    "data visualization",
+  ],
+  // Data products (Category 3)
+  [
+    "eoxcloudless",
+    "eoxmaps",
+    "s2cloudless",
+    "maps",
+    "sentinel-2",
+    "labels",
+    "cloudless-mosaic",
+    "voronoi-diagram",
+    "openstreetmap",
+    "mapchete",
+  ],
+];
+
+export const tagColors = [
+  "rgb(255, 94, 94)", // Managed cloud workspace
+  "rgb(0, 177, 176)", // Data management
+  "rgb(219, 173, 66)", // Data visualization
+  "rgb(218, 71, 228)", // Data products
+];
+
+export const tagCategories = [
+  "Managed cloud workspace",
+  "Data management",
+  "Data visualization",
+  "Data products",
+];
+
+/**
+ * Get color for a given tag
+ * @param {string} tag
+ * @returns {string} color hex/rgb
+ */
+export function getTagColor(tag) {
+  if (!tag) return "#e0e0e0";
+  const cleanTag = tag.toLowerCase().trim();
+  for (let i = 0; i < tagThemes.length; i++) {
+    if (tagThemes[i].includes(cleanTag)) {
+      return tagColors[i];
+    }
+  }
+  return "#e0e0e0";
+}
+
+/**
+ * Get style object for a given tag
+ * @param {string} tag
+ * @returns {object} style object
+ */
+export function getTagStyle(tag) {
+  const color = getTagColor(tag);
+  if (color.startsWith("rgb(255, 94, 94)")) {
+    return {
+      backgroundColor: "rgba(255, 94, 94, 0.15)",
+      border: "1px solid rgb(255, 94, 94)",
+      color: "#d32f2f"
+    };
+  } else if (color.startsWith("rgb(0, 177, 176)")) {
+    return {
+      backgroundColor: "rgba(0, 177, 176, 0.15)",
+      border: "1px solid rgb(0, 177, 176)",
+      color: "#00796b"
+    };
+  } else if (color.startsWith("rgb(219, 173, 66)")) {
+    return {
+      backgroundColor: "rgba(219, 173, 66, 0.15)",
+      border: "1px solid rgb(219, 173, 66)",
+      color: "#f57c00"
+    };
+  } else if (color.startsWith("rgb(218, 71, 228)")) {
+    return {
+      backgroundColor: "rgba(218, 71, 228, 0.15)",
+      border: "1px solid rgb(218, 71, 228)",
+      color: "#c2185b"
+    };
+  }
+  return {
+    backgroundColor: "rgba(0, 0, 0, 0.05)",
+    border: "1px solid rgba(0, 0, 0, 0.1)",
+    color: "#475569"
+  };
+}
+
+/**
+ * Get category name for a given tag
+ * @param {string} tag
+ * @returns {string} category name
+ */
+export function getTagCategory(tag) {
+  if (!tag) return "Other";
+  const cleanTag = tag.toLowerCase().trim();
+  for (let i = 0; i < tagThemes.length; i++) {
+    if (tagThemes[i].includes(cleanTag)) {
+      return tagCategories[i];
+    }
+  }
+  return "Other";
+}

package/src/team.data.js

@@ -0,0 +1,51 @@
+import { createContentLoader } from "vitepress";
+
+export default createContentLoader("_team/*.md", {
+  transform(rawData) {
+    return rawData
+      .filter((page) => {
+        // Exclude guest members
+        return !(page.frontmatter.guest === true);
+      })
+      .map((page) => {
+        // Find job description inside the meta array
+        const metaList = page.frontmatter.meta || [];
+        const jobDescMeta = Array.isArray(metaList)
+          ? metaList.find((m) => m && m.name === "jobDescription")
+          : null;
+        const role = jobDescMeta ? jobDescMeta.content : "";
+
+        // Transform sns array of objects into a single object of key-value pairs
+        const sns = {};
+        const snsList = page.frontmatter.sns || [];
+        if (Array.isArray(snsList)) {
+          snsList.forEach((item) => {
+            if (item && typeof item === "object") {
+              Object.entries(item).forEach(([platform, url]) => {
+                sns[platform] = url;
+              });
+            }
+          });
+        }
+
+        // Return the clean schema
+        return {
+          name: page.frontmatter.title || "",
+          id: page.frontmatter.id || "",
+          image: page.frontmatter.image || "",
+          bio: page.frontmatter.description || "",
+          role,
+          sns,
+          url: page.url,
+        };
+      })
+      .sort((a, b) => {
+        // "0_new" (id: new_member) should be in the 1st position.
+        if (a.id === "new_member") return -1;
+        if (b.id === "new_member") return 1;
+
+        // Otherwise sort alphabetically by ID (which maps to filename / last name)
+        return a.id.localeCompare(b.id);
+      });
+  },
+});