feat(docs/downloads): card permalink hooks, date-sorted latest releases, content cleanup

assets/scss/_custom_docs.scss

@@ -473,9 +473,15 @@
   .docs-card {
     display: flex; flex-direction: column;
     background: #fff; border: 1px solid $line; border-radius: 14px; padding: 16px 18px;
+    scroll-margin-top: 84px;   // clear the sticky navbar when jumped to via #anchor
     transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
     &:hover { box-shadow: 0 16px 40px -22px rgba(17,24,39,.24); border-color: #d6e4f5; transform: translateY(-2px); }
   }
+  // selected state when navigated to via a #project anchor
+  .docs-card:target {
+    border-color: $brand;
+    box-shadow: 0 0 0 3px rgba(55, 136, 208, .25), 0 16px 40px -22px rgba(17, 24, 39, .3);
+  }
   .docs-card-head { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; min-height: 30px; }
   .docs-icon { flex: 0 0 30px; width: 30px; height: 30px; object-fit: contain; }
   .docs-card-title { margin: 0; font-size: 14.5px; font-weight: 700; color: $ink; line-height: 1.25; flex: 1; }

assets/scss/_custom_home.scss

@@ -948,17 +948,14 @@ $brand-grad: linear-gradient(180deg, #479EEB 0%, #3788D0 100%);
   .dl-latest-head { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: $muted; margin-bottom: 10px; }
   .dl-latest-item {
     display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
-    padding: 7px 0; border-bottom: 1px solid $line; text-decoration: none;
+    padding: 8px 0; border-bottom: 1px solid $line; text-decoration: none;
     &:last-of-type { border-bottom: 0; }
     .dl-latest-name { font-size: 13.5px; color: $ink; font-weight: 600; }
+    .dl-latest-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; flex: 0 0 auto; text-align: right; }
     .dl-latest-ver { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 13px; color: $brand; font-weight: 700; }
+    .dl-latest-date { font-size: 11px; color: $muted; }
     &:hover .dl-latest-name { color: $brand; }
   }
-  .dl-latest-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
-  .dl-tag {
-    font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px;
-    background: #eef1f5; color: #5b6573; border: 1px solid #e1e6ee;
-  }
 
   .dl-wrap { padding-top: 28px; padding-bottom: 64px; }
 
@@ -972,9 +969,15 @@ $brand-grad: linear-gradient(180deg, #479EEB 0%, #3788D0 100%);
   .dl-card {
     display: flex; flex-direction: column;
     background: #fff; border: 1px solid $line; border-radius: 12px; padding: 14px;
+    scroll-margin-top: 84px;   // clear the sticky navbar when jumped to via #anchor
     transition: box-shadow .18s ease, border-color .18s ease;
     &:hover { box-shadow: 0 14px 34px -22px rgba(17,24,39,.22); border-color: #d6e4f5; }
   }
+  // selected state when navigated to via a #project anchor (e.g. the "Latest releases" panel)
+  .dl-card:target {
+    border-color: $brand;
+    box-shadow: 0 0 0 3px rgba(55, 136, 208, .25), 0 14px 34px -22px rgba(17, 24, 39, .3);
+  }
   .dl-card-head {
     display: flex; gap: 9px; align-items: center; margin-bottom: 8px;
     min-height: 44px;   // fits icon + up to a 2-line title, so SOURCE aligns across cards
@@ -1171,3 +1174,22 @@ $brand-grad: linear-gradient(180deg, #479EEB 0%, #3788D0 100%);
   // hide the little caret arrows; the groups read fine as labels
   .dropdown-wrapper .dropdown-title .arrow { display: none; }
 }
+
+// ── Permalink "hook" on project cards (docs landing + downloads) ──────────────
+// Global (cards live under different page scopes); copies the deep link on click.
+.card-anchor {
+  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
+  width: 24px; height: 24px; border-radius: 7px; position: relative;
+  color: $muted; background: transparent; text-decoration: none;
+  opacity: 0; transition: opacity .15s ease, color .15s ease, background .15s ease;
+  svg { width: 13px; height: 13px; }
+  &:hover { color: $brand; background: #eef4fb; }
+  &:focus-visible { opacity: 1; outline: 2px solid rgba(55, 136, 208, .5); outline-offset: 1px; }
+  &.copied::after {
+    content: "Link copied"; position: absolute; bottom: calc(100% + 6px); right: 0;
+    background: $ink; color: #fff; font-size: 10.5px; font-weight: 600;
+    padding: 3px 7px; border-radius: 6px; white-space: nowrap; pointer-events: none; z-index: 5;
+  }
+}
+.docs-card:hover .card-anchor,
+.dl-card:hover .card-anchor { opacity: 1; }

data/docs.yml

@@ -19,8 +19,6 @@
 - type: SkyWalking Servers
   description:
   list:
-    - name:
-      descriptionItem: SkyWalking servers include the Observability Analysis Platform (OAP) server and the native UI server. SkyWalking primary docs introduce the concepts, designs, setup, and corresponding APIs referred to telemetry data reports and queries.
     - name: SkyWalking
       icon: skywalking
       description: SkyWalking primary repository and docs.
@@ -350,8 +348,6 @@
       repo: skywalking-goapi
 - type: Database
   list:
-    - name:
-      descriptionItem: BanyanDB server and clients are incubated under SkyWalking umbrella, which aims to provide better native supports to the SkyWalking APM use cases, including better performance and lower resource costs.
     - name: BanyanDB
       icon: banyan-db
       description: An observability database aims to ingest, analyze and store Metrics, Tracing and Logging data.
@@ -464,10 +460,6 @@
       description: Distributed tracing and monitor SDK in CPP for Apache SkyWalking APM.
       user: SkyAPM
       repo: cpp2sky
-    - name: SourceMarker
-      description: JetBrains-powered plugin. Continuous Feedback for Developers / Feedback-Driven Development Tool.
-      user: sourceplusplus
-      repo: SourceMarker
     - name: Java Plugin Extensions
       description: Java agent plugin extensions for Apache SkyWalking.
       user: SkyAPM
@@ -484,6 +476,10 @@
   list:
     - name:
       descriptionItem: All following repositories are a part of SkyWalking ecosystem, but now are retired and archived as read-only.
+    - name: (Retired) SourceMarker
+      description: JetBrains-powered plugin. Continuous Feedback for Developers / Feedback-Driven Development Tool.
+      user: sourceplusplus
+      repo: SourceMarker
     - name: (Retired) Transporter Plugins
       description: 3rd-party transporter implementation of Apache SkyWalking. No one is maintaining this.
       user: SkyAPM

data/releases.yml

@@ -258,7 +258,6 @@
     - name: Horizon UI
       icon: skywalking
       description: Apache SkyWalking next-generation UI (Horizon), natively supporting SkyWalking since v11, and partially for v10.
-      sourceText: Included in the main repo release
     - name: Grafana Plugins
       icon: skywalking
       description: SkyWalking Grafana Plugins provide extensions to visualize topology on Grafana.

layouts/docs/baseof.html

@@ -90,6 +90,9 @@ <h5 class="docs-card-title">{{ .name }}</h5>
                 <span>{{ .stars }}</span>
               </a>
               {{ end }}
+              <a class="card-anchor" href="#{{ $id }}" data-anchor="{{ $id }}" title="Copy link to {{ .name }}" aria-label="Copy link to {{ .name }}">
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
+              </a>
             </header>
             <p class="docs-card-desc">{{ .description | markdownify }}</p>
             <footer class="docs-card-foot">
@@ -147,5 +150,6 @@ <h5 class="docs-card-title">{{ .name }}</h5>
         });
       });
     </script>
+    {{ partial "card-permalink.html" . }}
   </body>
 </html>

layouts/downloads/baseof.html

@@ -27,5 +27,6 @@
     }
   })
 </script>
+{{ partial "card-permalink.html" . }}
 </body>
 </html>

layouts/downloads/list.html

@@ -18,20 +18,48 @@ <h1>Every release, signed and dated</h1>
       </div>
       <aside class="dl-latest">
         <div class="dl-latest-head">Latest releases</div>
-        {{ range first 4 (index .Site.Data.releases 0).list }}
-        {{ if and .source .name }}
-        {{ $id := replace .name " " "" }}
-        <a class="dl-latest-item" href="#{{ $id }}">
+        {{- /* Genuinely "latest": collect each project's newest release across all
+               categories, turn its "Mon. DDth, YYYY" date into a sortable YYYYMMDD
+               key, then sort descending and take the 4 most recent. */ -}}
+        {{ $mon := dict "Jan" 1 "Feb" 2 "Mar" 3 "Apr" 4 "May" 5 "Jun" 6 "Jul" 7 "Aug" 8 "Sep" 9 "Oct" 10 "Nov" 11 "Dec" 12 }}
+        {{ $items := slice }}
+        {{ range .Site.Data.releases }}
+          {{ range .list }}
+          {{ $rels := or .source .distribution }}
+          {{ if and .name $rels }}
+            {{ $rel := index $rels 0 }}
+            {{ $key := 0 }}
+            {{ with $rel.date }}
+              {{ if findRE `^\d{4}-\d{2}-\d{2}` . }}
+                {{- /* ISO date: YYYY-MM-DD -> YYYYMMDD */ -}}
+                {{ $key = int (replace (substr . 0 10) "-" "") }}
+              {{ else }}
+                {{- /* "Mon. DDth, YYYY" -> YYYYMMDD */ -}}
+                {{ $c := replaceRE `(\d+)(st|nd|rd|th)` `$1` . }}
+                {{ $c = replace $c "." "" }}
+                {{ $c = replace $c "," "" }}
+                {{ $p := split (trim (replaceRE `\s+` " " $c) " ") " " }}
+                {{ if eq (len $p) 3 }}
+                  {{ $mn := index $mon (index $p 0) }}
+                  {{ if $mn }}
+                    {{ $key = add (add (mul (int (index $p 2)) 10000) (mul $mn 100)) (int (index $p 1)) }}
+                  {{ end }}
+                {{ end }}
+              {{ end }}
+            {{ end }}
+            {{ $items = $items | append (dict "name" .name "ver" $rel.version "date" $rel.date "id" (replace .name " " "") "key" $key) }}
+          {{ end }}
+          {{ end }}
+        {{ end }}
+        {{ range first 5 (sort $items "key" "desc") }}
+        <a class="dl-latest-item" href="#{{ .id }}">
           <span class="dl-latest-name">{{ .name }}</span>
-          <span class="dl-latest-ver">{{ (index .source 0).version }}</span>
+          <span class="dl-latest-meta">
+            <span class="dl-latest-ver">{{ .ver }}</span>
+            {{ with .date }}<span class="dl-latest-date">{{ . }}</span>{{ end }}
+          </span>
         </a>
         {{ end }}
-        {{ end }}
-        <div class="dl-latest-tags">
-          <span class="dl-tag">GPG keys</span>
-          <span class="dl-tag">SHA-512</span>
-          <span class="dl-tag">Apache mirrors</span>
-        </div>
       </aside>
     </div>
   </div>

layouts/partials/card-permalink.html

@@ -0,0 +1,37 @@
+{{- /* Deep-link "hook" for project cards (docs landing + downloads).
+       - clicking the # hook copies the full anchored URL and selects the card
+       - clicking anywhere on the card (off real links) selects it + updates the URL hash */ -}}
+<script>
+  (function () {
+    function selectAndCopy(id, withCopy, badge) {
+      if (!id) return;
+      // history.replaceState keeps the back button clean; setting hash drives :target
+      if (location.hash !== '#' + id) { history.replaceState(null, '', '#' + id); }
+      // re-assert :target even if the hash was already set
+      location.hash = id;
+      if (withCopy && navigator.clipboard) {
+        navigator.clipboard.writeText(location.href).then(function () {
+          if (!badge) return;
+          badge.classList.add('copied');
+          setTimeout(function () { badge.classList.remove('copied'); }, 1400);
+        });
+      }
+    }
+
+    document.querySelectorAll('.card-anchor').forEach(function (a) {
+      a.addEventListener('click', function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        selectAndCopy(a.getAttribute('data-anchor'), true, a);
+      });
+    });
+
+    document.querySelectorAll('.docs-card[id], .dl-card[id]').forEach(function (card) {
+      card.addEventListener('click', function (e) {
+        // don't hijack clicks on real interactive elements inside the card
+        if (e.target.closest('a, button, summary, details, input')) return;
+        selectAndCopy(card.id, false, null);
+      });
+    });
+  })();
+</script>

layouts/shortcodes/downloads-block.html

@@ -11,6 +11,9 @@ <h2 class="dl-cat" id="{{ $cat }}">{{ .type }}</h2>
     <header class="dl-card-head">
       {{ if .icon }}<img class="dl-icon" width="34" height="34" src="/images/project/{{ .icon }}.svg" alt="">{{ end }}
       <h5 class="dl-card-title">{{ .name }}</h5>
+      <a class="card-anchor" href="#{{ $id }}" data-anchor="{{ $id }}" title="Copy link to {{ $name }}" aria-label="Copy link to {{ $name }}">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
+      </a>
     </header>
     {{ with .description }}<p class="dl-card-desc">{{ . }}</p>{{ end }}