jekyll-theme-zer0 1.2.1 → 1.4.0

data/_sass/core/_obsidian.scss

@@ -0,0 +1,242 @@
+// ============================================================================
+// _obsidian.scss — Styles for Obsidian-flavoured Markdown features.
+// Imported from _sass/custom.scss.
+//
+// Covers:
+//   - Wiki-links (resolved + broken state)
+//   - Inline tags
+//   - Note transclusion / image embeds
+//   - Callout cards beyond what Bootstrap's `.alert` provides
+//   - Backlinks panel
+// ============================================================================
+
+// --- Wiki-links ------------------------------------------------------------
+.wiki-link {
+  text-decoration: none;
+  border-bottom: 1px dashed currentColor;
+  font-weight: 500;
+
+  &:hover {
+    text-decoration: underline;
+    border-bottom-color: transparent;
+  }
+
+  &[aria-current="page"] {
+    background-color: rgba(var(--bs-primary-rgb), 0.08);
+    padding: 0 0.15rem;
+    border-radius: 0.2rem;
+  }
+}
+
+.wiki-link-broken {
+  color: var(--bs-danger);
+  border-bottom-style: dotted;
+  cursor: help;
+
+  &:hover {
+    color: var(--bs-danger);
+    background-color: rgba(var(--bs-danger-rgb), 0.05);
+  }
+}
+
+// --- Inline tags -----------------------------------------------------------
+.obsidian-tag {
+  display: inline-block;
+  padding: 0.05rem 0.45rem;
+  margin: 0 0.1rem;
+  font-size: 0.85em;
+  font-weight: 500;
+  color: var(--bs-secondary);
+  background-color: rgba(var(--bs-secondary-rgb), 0.1);
+  border-radius: 0.5rem;
+  text-decoration: none;
+  transition: background-color 0.15s ease;
+
+  &:hover,
+  &:focus {
+    background-color: rgba(var(--bs-secondary-rgb), 0.2);
+    color: var(--bs-primary);
+    text-decoration: none;
+  }
+}
+
+// --- Embeds (image + note transclusion) -----------------------------------
+.obsidian-embed-image {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  margin: 1rem auto;
+  border-radius: 0.375rem;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+}
+
+.obsidian-embed-note {
+  border-left: 3px solid var(--bs-primary);
+
+  .obsidian-embed-source {
+    font-size: 0.875rem;
+    color: var(--bs-secondary);
+  }
+
+  .obsidian-embed-body {
+    background-color: rgba(var(--bs-light-rgb), 0.5);
+  }
+
+  [data-bs-theme="dark"] & .obsidian-embed-body {
+    background-color: rgba(var(--bs-dark-rgb), 0.4);
+  }
+}
+
+.obsidian-embed-broken {
+  font-size: 0.9rem;
+
+  code {
+    background-color: rgba(0, 0, 0, 0.06);
+    padding: 0.1rem 0.3rem;
+    border-radius: 0.25rem;
+  }
+}
+
+// --- Callouts -------------------------------------------------------------
+.obsidian-callout {
+  border-left-width: 4px;
+  border-left-style: solid;
+  margin: 1.25rem 0;
+  padding: 0.85rem 1rem;
+
+  .obsidian-callout-title {
+    font-weight: 600;
+    margin-bottom: 0.4rem;
+    display: flex;
+    align-items: center;
+  }
+
+  .obsidian-callout-body {
+    margin: 0;
+
+    > :last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  &[data-collapsed="true"] .obsidian-callout-body {
+    display: none;
+  }
+}
+
+// --- Backlinks panel -------------------------------------------------------
+.obsidian-backlinks {
+  .obsidian-backlinks-list {
+    margin-bottom: 0;
+  }
+
+  .obsidian-backlink {
+    padding: 0.5rem 0.75rem;
+    border-left: 2px solid transparent;
+    border-radius: 0 0.25rem 0.25rem 0;
+    transition: background-color 0.15s ease, border-color 0.15s ease;
+
+    &:hover {
+      background-color: rgba(var(--bs-primary-rgb), 0.05);
+      border-left-color: var(--bs-primary);
+    }
+  }
+
+  .obsidian-backlink-link {
+    text-decoration: none;
+  }
+
+  .obsidian-backlink-excerpt {
+    margin-top: 0.2rem;
+  }
+}
+
+// ----------------------------------------------------------------------------
+// Local graph side panel — Obsidian-style local graph view.
+// Rendered by _includes/navigation/local-graph.html via assets/js/obsidian-local-graph.js.
+// ----------------------------------------------------------------------------
+.obsidian-local-graph-fab {
+  position: fixed;
+  left: 1rem;
+  bottom: 1rem;
+  z-index: 1032;
+
+  &[hidden] {
+    display: none !important;
+  }
+}
+
+.obsidian-local-graph-toggle {
+  width: 3.25rem;
+  height: 3.25rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+
+  &:hover,
+  &:focus-visible {
+    transform: translateY(-1px);
+  }
+
+  &:active {
+    transform: translateY(0);
+  }
+}
+
+.obsidian-local-graph-panel {
+  --bs-offcanvas-width: min(28rem, calc(100vw - 1.5rem));
+
+  &[hidden] {
+    display: none !important;
+  }
+
+  .offcanvas-body {
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+  }
+}
+
+.obsidian-local-graph-widget {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  min-height: 0;
+
+  .obsidian-local-graph-meta {
+    flex: 0 0 auto;
+  }
+
+  #obsidian-local-graph {
+    flex: 1 1 auto;
+    width: 100%;
+    height: min(62vh, 34rem);
+    min-height: 22rem;
+    border: 1px solid var(--bs-border-color, #dee2e6);
+    border-radius: var(--bs-border-radius-lg, 0.5rem);
+    background: var(--bs-tertiary-bg, #f8f9fa);
+    overflow: hidden;
+    position: relative;
+  }
+
+  .obsidian-local-graph-status {
+    min-height: 1.25rem;
+  }
+}
+
+@media (max-width: 575.98px) {
+  .obsidian-local-graph-fab {
+    left: 0.875rem;
+    bottom: 0.875rem;
+  }
+
+  .obsidian-local-graph-panel {
+    --bs-offcanvas-width: min(100vw, 24rem);
+  }
+
+  .obsidian-local-graph-widget #obsidian-local-graph {
+    height: 58vh;
+    min-height: 18rem;
+  }
+}

data/_sass/core/_offcanvas-panels.scss

@@ -4,13 +4,15 @@
 // =============================================================================
 
 #bdSidebar .offcanvas-header,
-#tocContents .offcanvas-header {
+#tocContents .offcanvas-header,
+#obsidianLocalGraphPanel .offcanvas-header {
   border-bottom: 2px solid var(--bs-border-color);
   padding: 1.25rem 1rem;
 }
 
 #bdSidebar .offcanvas-title,
-#tocContents .offcanvas-title {
+#tocContents .offcanvas-title,
+#obsidianLocalGraphPanel .offcanvas-title {
   font-size: 1.125rem;
   font-weight: 600;
   color: var(--bs-emphasis-color);
@@ -19,7 +21,8 @@
 
 @media (max-width: 991.98px) {
   #bdSidebar .offcanvas-header .btn-close,
-  #tocContents .offcanvas-header .btn-close {
+  #tocContents .offcanvas-header .btn-close,
+  #obsidianLocalGraphPanel .offcanvas-header .btn-close {
     width: 48px;
     height: 48px;
     padding: 0;
@@ -36,7 +39,8 @@
     }
   }
 
-  #tocContents .offcanvas-body {
+  #tocContents .offcanvas-body,
+  #obsidianLocalGraphPanel .offcanvas-body {
     padding: 1rem;
   }
 

data/_sass/custom.scss

@@ -12,6 +12,9 @@
 @import "core/navbar";
 @import "core/offcanvas-panels";
 
+// Obsidian-flavoured markdown features (wiki-links, callouts, backlinks, …)
+@import "core/obsidian";
+
 html, body {
     max-width: 100%;
     // overflow-x: hidden;

data/assets/data/wiki-index.json

@@ -0,0 +1,74 @@
+---
+# Generated wiki-link index for Obsidian-style [[…]] resolution on the
+# rendered site. Consumed by:
+#   - assets/js/obsidian-wiki-links.js (client-side fallback used on the
+#     GitHub Pages remote_theme build, where _plugins/obsidian_links.rb
+#     does not run)
+#   - _includes/content/backlinks.html (per-page backlinks panel)
+#
+# Output: assets/data/wiki-index.json
+#
+# Layout: null so Jekyll just renders the body verbatim.
+layout: null
+permalink: /assets/data/wiki-index.json
+sitemap: false
+---
+{%- comment -%}
+  Build a flat array of every renderable document with title, basename,
+  permalink, collection, tags, and the body's outgoing wiki-link targets.
+  The JS resolver normalizes lookup keys to lowercase + collapsed whitespace
+  (matching _plugins/obsidian_links.rb#normalize).
+{%- endcomment -%}
+{%- assign all_docs = "" | split: "" -%}
+{%- for collection in site.collections -%}
+  {%- for doc in collection.docs -%}
+    {%- assign all_docs = all_docs | push: doc -%}
+  {%- endfor -%}
+{%- endfor -%}
+{%- for page in site.pages -%}
+  {%- if page.output_ext == ".html" and page.url -%}
+    {%- assign all_docs = all_docs | push: page -%}
+  {%- endif -%}
+{%- endfor -%}
+{
+  "generated_at": {{ site.time | date_to_xmlschema | jsonify }},
+  "count": {{ all_docs.size | jsonify }},
+  "entries": [
+    {%- for doc in all_docs -%}
+      {%- assign basename = doc.path | split: "/" | last | replace: ".md", "" | replace: ".markdown", "" | replace: ".html", "" -%}
+      {%- assign body = doc.content | default: "" | strip_html -%}
+      {%- assign body_excerpt = body | strip_newlines | truncate: 240 -%}
+      {%- comment -%}
+        Extract outgoing wiki-link targets so the graph view
+        (assets/js/obsidian-graph.js) can render edges without re-parsing
+        every page client-side. We mask `![[…]]` embeds first so they don't
+        also get split as `[[…]]`, then split on `[[`, take everything
+        before `]]`, and strip the optional `|alias` and `#anchor` parts.
+      {%- endcomment -%}
+      {%- assign masked = body | replace: "![[", "@@OBSEMBED@@" -%}
+      {%- assign chunks = masked | split: "[[" -%}
+      {%- assign outgoing = "" | split: "" -%}
+      {%- for chunk in chunks offset: 1 -%}
+        {%- assign target_raw = chunk | split: "]]" | first -%}
+        {%- if target_raw and target_raw != "" -%}
+          {%- assign target = target_raw | split: "|" | first | split: "#" | first | split: "^" | first | strip | downcase -%}
+          {%- if target != "" and target.size < 200 -%}
+            {%- assign outgoing = outgoing | push: target -%}
+          {%- endif -%}
+        {%- endif -%}
+      {%- endfor -%}
+      {%- assign outgoing = outgoing | uniq -%}
+      {
+        "title": {{ doc.title | default: basename | jsonify }},
+        "basename": {{ basename | jsonify }},
+        "url": {{ doc.url | jsonify }},
+        "collection": {{ doc.collection | default: nil | jsonify }},
+        "tags": {{ doc.tags | default: empty | jsonify }},
+        "categories": {{ doc.categories | default: empty | jsonify }},
+        "aliases": {{ doc.aliases | default: empty | jsonify }},
+        "outgoing": {{ outgoing | jsonify }},
+        "excerpt": {{ body_excerpt | jsonify }}
+      }{% unless forloop.last %},{% endunless %}
+    {%- endfor -%}
+  ]
+}