📝 (content): enhance Definition of Done documentation for clarity and depth

🔧 (footer.html): add Masonry layout script for improved UI flexibility
♻️ (list.html): refactor tag list layout for better readability and maintainability

The Definition of Done documentation is expanded to provide a more comprehensive understanding of its importance, including organizational and team-specific criteria. This aims to improve transparency, consistency, and quality across teams. The footer now includes the Masonry layout script to enhance the visual presentation of content. The tag list layout is refactored to improve readability and maintainability, ensuring a more organized and user-friendly interface.

Author: MrHinsh

site/content/tags/definition-of-done/_index.md

@@ -19,10 +19,75 @@ Instructions: |-
   **Strictly exclude** any discussions that deviate from the core principles of the Definition of Done, such as unrelated project management practices, non-Agile methodologies, or personal opinions on team dynamics that do not directly relate to the DoD.
 headline:
   cards: []
-  title: Definition of Done
-  subtitle: Establish clear criteria for completion to enhance transparency and ensure quality across teams and projects.
-  content: Establishing a clear completion standard enhances team alignment and project quality. Posts should explore criteria for assessing work readiness, the impact on workflow efficiency, and methods for fostering shared understanding among team members, ensuring consistent delivery and accountability across various contexts.
+  title: Definition of Done (DoD)
+  subtitle: Ensuring Quality, Transparency, and Releasability
+  content: The **Definition of Done (DoD)** establishes a shared understanding of what makes a product increment **complete and releasable**, ensuring all work meets a **minimum quality standard**. It enhances transparency, consistency, and empirical decision-making by providing clear criteria for done work. This includes an Organisational Definition of Done that applies across teams, with team-specific extensions as needed. A well-defined DoD is essential for adaptation, accountability, and delivering valuable, verifiable, and production-ready increments.
   updated: 2025-02-13T12:05:05Z
-
 ---
 
+The **Definition of Done (DoD)** establishes a shared understanding of what constitutes a **completed and releasable** product increment. It ensures that all work meets a **minimum quality standard**, providing transparency, consistency, and the ability to make **empirical decisions** based on real-world feedback.
+
+This document outlines the **Organisational Definition of Done**, which applies across all teams, as well as **team-specific extensions** that may be necessary based on product requirements. It also highlights why the DoD is essential for **transparency, adaptation, and ensuring that every increment is valuable, verifiable, and production-ready**.
+
+## Organisational Definition of Done
+
+For work to be considered **Done**, it must meet the following **minimum standard**:
+
+- **Live and in production**: The increment must be deployed and available for end users.
+- **Collecting telemetry**: The increment must be instrumented with appropriate logging, monitoring, and analytics to gather data on its impact.
+- **Supporting or diminishing the starting hypothesis**: The increment must validate or disprove the assumptions that justified its development.
+
+## Team-Specific Definition of Done
+
+Each team must define what is required for a product increment to be considered **releasable** while ensuring full compliance with the **Organisational Definition of Done**. The organisational DoD sets the **minimum quality standard** that all teams must meet. If additional criteria are needed based on product-specific requirements, teams may extend their Definition of Done beyond the organisational standard but never below it. This ensures a consistent, high-quality standard across all teams and prevents discrepancies in what is considered Done.
+
+Each team may have additional criteria, but they must adhere to the **organisational DoD** as a minimum. Typical extensions include:
+
+- Code is peer-reviewed and merged to main.
+- Automated tests (unit, integration, performance, security) are written and pass.
+- Feature flags or rollback mechanisms are in place.
+- Documentation is updated.
+- No critical bugs or unresolved incidents are present.
+- User feedback mechanisms are implemented.
+
+If there are multiple teams working on a single product, those teams must agree on a shared **Definition of Done** and ensure it is consistently honoured.
+
+## Validation and Continuous Improvement
+
+- Each deployed increment should be evaluated based on **real-world telemetry**.
+- Adjustments should be made based on the evidence collected, ensuring iterative learning and refinement.
+- The DoD should be reviewed periodically to incorporate evolving engineering and business needs.
+- The **purpose of the Definition of Done is to provide transparency** into what has been achieved and ensure that increments are **usable and releasable**.
+
+By **strictly adhering to and continuously refining our DoD**, we ensure that every increment is **valuable, verifiable, and ready for real-world use**.
+
+## Why the Definition of Done Matters
+
+The Definition of Done is more than a checklist—it is the bedrock of transparency and adaptation. Without a clear and universally understood DoD, teams risk misalignment, rework, and poor decision-making.
+
+### Transparency
+
+- **Shared Understanding**: The DoD ensures that every stakeholder, from developers to leadership, understands what "done" truly means.
+- **Clear Expectations**: Teams, Product Managers, and business leaders operate with full visibility into what work is **ready for use versus work-in-progress**.
+- **Trust in Delivery**: A well-defined DoD reduces ambiguity, improving confidence in the quality and completeness of increments.
+
+### Enabling Adaptation
+
+- **Empirical Decision-Making**: The DoD ensures increments are deployed with real-world telemetry, allowing teams to inspect and adapt based on actual data rather than assumptions.
+- **Minimising Risk**: By enforcing rigorous completion criteria, the DoD prevents half-baked work from reaching users, reducing technical debt and ensuring fast, safe iteration.
+- **Faster Feedback Loops**: A strong DoD accelerates learning, allowing teams to course-correct sooner and focus on what truly delivers value.
+
+## Done Means Releasable
+
+When a **Product Backlog item** or an **Increment** is described as **Done**, everyone must understand what that means. This ensures **transparency**, the foundation of any empirical system. Without a consistent Definition of Done, teams cannot know what it takes to get something finished.
+
+A shared Definition of Done allows us to:
+
+1. Maintain **Transparency** of what we have **Done**.
+2. Understand how much work is required to deliver an item.
+3. Create an agreement of what to **show at the Sprint Review**.
+4. **Protect our Brand!**
+
+A releasable product increment adheres to all aspects of quality, with **no corners cut** during development. This ensures that Product Management has the choice to release at any time, rather than requiring additional work before shipping.
+
+The Definition of Done is the **commitment to quality for the Increment**. Creating and adhering to a usable increment that meets the DoD ensures **predictable, high-quality delivery**.

site/layouts/partials/infrastructure/footer.html

@@ -151,6 +151,7 @@ <h4 class="p-2">Tools</h4>
 </footer>
 <!-- Bootsrap -->
 <script async src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
 <!-- Lightbox -->
 <script async src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.bundle.min.js"></script>
 <!-- Cards -->

site/layouts/tags/list.html

@@ -1,77 +1,133 @@
 {{- define "main" }}
-  <section class="container my-5">
-    <div class="row">
-      {{- $taxonomyName := .Title }}
-      {{- $taxonomyShortName := .Title }}
-      {{- $pages := where .Pages.ByWeight "Draft" "!=" true }}
+  {{- $taxonomyName := .Title }}
+  {{- $taxonomyShortName := .Title }}
+  {{- $pages := where .Pages.ByWeight "Draft" "!=" true }}
 
-      {{- $pagesWithData := slice }}
-      {{- range $page := $pages }}
-        {{- with .Resources.GetMatch "data.index.classifications.json" }}
-          {{- $data := . | transform.Unmarshal }}
-          {{- $dataItem := index $data $taxonomyName }}
-          {{- if $dataItem }}
-            <!-- Ensure the taxonomy exists in the data -->
-            {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" ($dataItem.final_score | default 0)) }}
-          {{- else }}
-            {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" 0) }}
-          {{- end }}
-        {{- else }}
-          {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" .Weight) }}
-          <!-- Default when no data file -->
-        {{- end }}
+  {{- $pagesWithData := slice }}
+  {{- range $page := $pages }}
+    {{- with .Resources.GetMatch "data.index.classifications.json" }}
+      {{- $data := . | transform.Unmarshal }}
+      {{- $dataItem := index $data $taxonomyName }}
+      {{- if $dataItem }}
+        <!-- Ensure the taxonomy exists in the data -->
+        {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" ($dataItem.final_score | default 0)) }}
+      {{- else }}
+        {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" 0) }}
       {{- end }}
-      {{- $sortedPagesWithData := sort $pagesWithData "score" "desc" }}
-
-      {{- range $pageWithData := $sortedPagesWithData }}
-        {{- if eq $pageWithData.page.Type "course" }}
-          <div class="col-xl-4 d-flex p-2">
-            {{- partial "cards-course.html" (dict "context" .) }}
-          </div>
-        {{- else if or (eq $pageWithData.page.Type "tags") (eq $pageWithData.page.Type "categories") }}
-          <div class="col-xl-4 d-flex p-2">
-            {{- partial "page-sections/sections-taxonomies-card.html" (dict "site" .Site "context" $pageWithData.page "subTypes" "resources") }}
-          </div>
-        {{- else }}
-          <div class="col-xl-4 d-flex p-2">
-            {{- $title := $pageWithData.page.Title }}
-            {{- $description := $pageWithData.page.Description }}
-            {{- $buttonContent := "Find out More" }}
-            {{- if $pageWithData.page.Params.card }}
-              {{- $title = $pageWithData.page.Params.card.title }}
-              {{- $description = $pageWithData.page.Params.card.content }}
-              {{- $buttonContent = $pageWithData.page.Params.card.button.content }}
-            {{- end }}
-            <!-- layouts/partials/card.html -->
-            <div class="sectioncards p-2 flex-fill flex-grow-1 h-100">
-              <div class="card sectioncards flex-fill flex-grow-1 m-3 shadow text-start small border-0 h-100 position-relative">
-                <div class="card-body p-4 px-20">
-                  <span class="badge text-bg-secondary">{{- title $pageWithData.page.Params.ResourceType }}</span>
-                  <h3 class="ttl-nkdagility h5 text-start" title="{{ $title }}">{{- $title }}</h3>
-                  <div class="card-text text-muted">
-                    {{- $description | markdownify }}
+    {{- else }}
+      {{- $pagesWithData = $pagesWithData | append (dict "page" $page "score" .Weight) }}
+      <!-- Default when no data file -->
+    {{- end }}
+  {{- end }}
+  {{- $sortedPagesWithData := sort $pagesWithData "score" "desc" }}
+  <section class="container my-2">
+    <div class="container">
+      <div class="row">
+        {{- range first 3 $sortedPagesWithData }}
+          <div class="col-xl-4 p-2">
+            {{- if or (eq .page.Type "tags") (eq .page.Type "categories") }}
+              {{- partial "page-sections/sections-taxonomies-card.html" (dict "site" .Site "context" .page "subTypes" "resources") }}
+            {{- else }}
+              {{- $title := .page.Title }}
+              {{- $description := .page.Description }}
+              {{- $buttonContent := "Find out More" }}
+              {{- if .page.Params.card }}
+                {{- $title = .page.Params.card.title }}
+                {{- $description = .page.Params.card.content }}
+                {{- $buttonContent = .page.Params.card.button.content }}
+              {{- end }}
+              <!-- layouts/partials/card.html -->
+              <div class="sectioncards p-2 flex-fill flex-grow-1 h-100">
+                <div class="card sectioncards flex-fill flex-grow-1 m-3 shadow text-start small border-0 h-100 position-relative">
+                  <div class="card-body p-4 px-20">
+                    <span class="badge text-bg-secondary">{{- title .page.Params.ResourceType }}</span>
+                    <h3 class="ttl-nkdagility h5 text-start" title="{{ $title }}">{{- $title }}</h3>
+                    <div class="card-text text-muted">
+                      {{- $description | markdownify }}
+                    </div>
+                  </div>
+                  <div class="card-footer border-transparent bg-white p-3 border-0 d-flex justify-content-between align-items-center">
+                    <small class="text-body-secondary" title="Affinity to {{ $taxonomyName }} is {{ .score }}%"> <strong class="d-inline-block text-truncate" style="max-width: 150px; vertical-align: middle;"> {{ $taxonomyName }} </strong>: {{ .score }}% </small>
+                    <a href="{{ .page.Permalink }}" class="btn btn-nkdagility p-2" title="More information on {{ .title }}"> {{- $buttonContent }} <i class="fa-solid fa-arrow-right"></i> </a>
                   </div>
                 </div>
-                <div class="card-footer border-transparent bg-white p-3 border-0 d-flex justify-content-between align-items-center">
-                  <small class="text-body-secondary" title="Affinity to {{ $taxonomyName }} is {{ $pageWithData.score }}%"> <strong class="d-inline-block text-truncate" style="max-width: 150px; vertical-align: middle;"> {{ $taxonomyName }} </strong>: {{ $pageWithData.score }}% </small>
-                  <a href="{{ $pageWithData.page.Permalink }}" class="btn btn-nkdagility p-2" title="More information on {{ .title }}"> {{- $buttonContent }} <i class="fa-solid fa-arrow-right"></i> </a>
+              </div>
+            {{- end }}
+          </div>
+        {{- end }}
+        <div class="col-xl-12 p-2 my-4">
+          <h2>Overview of {{ .Title }}</h2>
+          {{- .Content }}
+        </div>
+        {{- range after 3 $sortedPagesWithData }}
+          <div class="col-xl-4">
+            {{- if or (eq .page.Type "tags") (eq .page.Type "categories") }}
+              {{- partial "page-sections/sections-taxonomies-card.html" (dict "site" .Site "context" .page "subTypes" "resources") }}
+            {{- else }}
+              {{- $title := .page.Title }}
+              {{- $description := .page.Description }}
+              {{- $buttonContent := "Find out More" }}
+              {{- if .page.Params.card }}
+                {{- $title = .page.Params.card.title }}
+                {{- $description = .page.Params.card.content }}
+                {{- $buttonContent = .page.Params.card.button.content }}
+              {{- end }}
+              <!-- layouts/partials/card.html -->
+              <div class="sectioncards p-2 flex-fill flex-grow-1 h-100">
+                <div class="card sectioncards flex-fill flex-grow-1 m-3 shadow text-start small border-0 h-100 position-relative">
+                  <div class="card-body p-4 px-20">
+                    <span class="badge text-bg-secondary">{{- title .page.Params.ResourceType }}</span>
+                    <h3 class="ttl-nkdagility h5 text-start" title="{{ $title }}">{{- $title }}</h3>
+                    <div class="card-text text-muted">
+                      {{- $description | markdownify }}
+                    </div>
+                  </div>
+                  <div class="card-footer border-transparent bg-white p-3 border-0 d-flex justify-content-between align-items-center">
+                    <small class="text-body-secondary" title="Affinity to {{ $taxonomyName }} is {{ .score }}%"> <strong class="d-inline-block text-truncate" style="max-width: 150px; vertical-align: middle;"> {{ $taxonomyName }} </strong>: {{ .score }}% </small>
+                    <a href="{{ .page.Permalink }}" class="btn btn-nkdagility p-2" title="More information on {{ .title }}"> {{- $buttonContent }} <i class="fa-solid fa-arrow-right"></i> </a>
+                  </div>
                 </div>
               </div>
-            </div>
+            {{- end }}
           </div>
         {{- end }}
-      {{- end }}
+      </div>
     </div>
   </section>
 {{- end }}
 
 {{- define "siteSectionCallback" }}
   <section class="container my-5">
-    {{/* <h2 title="R - What we do?">Our Services</h2>
-      <p>Explore our comprehensive range of services and capabilities designed to empower organizations and teams. With our expert solutions, you can efficiently address and resolve immediate challenges, driving success across your operations.</p>
-      {{- partial "cards-section.html" (dict "context" . "SectionName" "capabilities")
-    }}
-    */}}
+    <div class="m-1 small">
+      <h5>Categories</h5>
+      <div class="row">
+        {{ range $category, $pages := .Site.Taxonomies.categories }}
+          <div class="col-md-3 d-flex align-items-center">
+            <span class="text-truncate d-inline-block" style="max-width: 100%;" title="{{ .Page.Title }}">
+              <a href="{{ .Page.Permalink }}">{{ .Page.Title }}</a>
+            </span>
+            {{- $count :=  len (where $pages "Draft" "!=" true) }}
+            <span class="ms-1">({{ $count }})</span>
+          </div>
+        {{ end }}
+      </div>
+      <hr />
+    </div>
+    <div class="m-1 small">
+      <h6>Tags</h6>
+      <div class="row">
+        {{ range $category, $pages := .Site.Taxonomies.tags }}
+          <div class="col-md-3 d-flex align-items-center">
+            <span class="text-truncate d-inline-block" style="max-width: 100%;" title="{{ .Page.Title }}">
+              <a href="{{ .Page.Permalink }}">{{ .Page.Title }}</a>
+            </span>
+            {{- $count :=  len (where $pages "Draft" "!=" true) }}
+            <span class="ms-1">({{ $count }})</span>
+          </div>
+        {{ end }}
+      </div>
+      <hr />
+    </div>
   </section>
 {{- end }}