json-ld · BigBlueHat · Dec 5, 2025 · Dec 4, 2025 · Dec 4, 2025 · Dec 4, 2025
diff --git a/.eleventy.js b/.eleventy.js
@@ -73,6 +73,10 @@ export default async function(eleventyConfig) {
   }
   eleventyConfig.ignores.add('test-suite');
 
+  eleventyConfig.addWatchTarget('playground/next/index.html');
+
+  eleventyConfig.addGlobalData('now', () => new Date());
+
   // setup development proxy to cloudflare pages function server
   if(process.env.ELEVENTY_RUN_MODE === 'serve') {
     eleventyConfig.setServerOptions({

diff --git a/_includes/implementation-card.liquid b/_includes/implementation-card.liquid
@@ -0,0 +1,33 @@
+<div class="card">
+  <div class="content">
+  <div class="header"><h3>{% if language %}{{ language | split: ',' | join: ' / ' }}{% else %}{{ applicationCategory }}{% endif %}</h3></div>
+    <div class="description">
+      <div class="ui selection list">
+        {% liquid
+          if language
+            assign languages = language | split: ','
+            assign imps = implementations | where_exp: 'imp', 'imp.applicationCategory != "CLI"'
+            for implementation in imps
+              assign found = false
+              for implang in implementation.language
+                for lang in languages
+                  if found == false
+                    assign found = lang == implang
+                  endif
+                endfor
+              endfor
+              if found == true
+                include 'implementation-item'
+              endif
+            endfor
+          else
+            assign imps = implementations | where: 'applicationCategory', applicationCategory
+            for implementation in imps
+              include 'implementation-item'
+            endfor
+          endif
+        %}
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/_includes/implementation-item.liquid b/_includes/implementation-item.liquid
@@ -1,12 +1,12 @@
-<li typeof="schema:SoftwareSourceCode">
+<div class="item" typeof="schema:SoftwareSourceCode">
   <a property="schema:codeRepository" href="{{ implementation.repo }}">
     <span property="schema:name">{{ implementation.name }}</span>
-    <span class="badge{% unless implementation.state == 'InProgress' %}{% if implementation.jsonldVersion == 1.1 %} badge-success{% else %} badge-info{% endif %}{% endunless %}">
+    <span class="ui label{% unless implementation.state == 'InProgress' %}{% if implementation.jsonldVersion == 1.1 %} green{% else %} blue{% endif %}{% endunless %}">
       {%- if implementation.jsonldVersion == 1.0 -%}
         1.0
       {%- else -%}
         {{ implementation.jsonldVersion }}{% if implementation.state == 'InProgress' %} (<abbr title="Work In Progress">WIP</abbr>){% endif %}
       {%- endif -%}
     </span>
   </a>
-</li>
+</div>
diff --git a/_layouts/default.liquid → _layouts/bs2.liquid b/_layouts/default.liquid → _layouts/bs2.liquid
diff --git a/_layouts/fomantic.liquid b/_layouts/fomantic.liquid
@@ -21,10 +21,14 @@
     <style>
       /* fomantic overrides */
       html { scroll-padding-top: 5em; }
+      body { background-color: #f7f7f7; }
       .ui.main.container { margin-top: 7em; }
       .ui.top.menu .header.item { border: none !important; padding-left: 0; }
       .ui.top.menu .header.item > span { font-size: 150%; }
       .ui.top.menu .header.item > img { margin-right: 1rem; }
+      .ui.basic.masthead.segment { padding: 5em 0 3em; background: white; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2), -1px -1px 0 rgba(0, 0, 0, 0.1) }
+      .ui.basic.masthead.segment + .ui.main.container { margin-top: 3em; }
+      pre.ui.segment { overflow-x: auto; }
       .ui.fitted.tab.segment > .ui.table { border-left: 0; border-top: 0; border-right: 0; margin-top: 0; }
       .ui.table th:empty { display: none; }
       .ui.basic.footer.segment { border-top: 1px solid rgba(34,36,38,.15); margin-top: 4em; padding-top: 2em; }
@@ -35,8 +39,6 @@
     <link rel="shortcut icon" href="/favicon.ico" />
 
     <!-- Script tags -->
-    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
-
     <script>
       (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
@@ -50,7 +52,7 @@
 
   <body>
     <div class="ui top fixed menu">
-      <div class="ui container">
+      <div class="ui wide container">
         <!-- Brand -->
         <a class="header item" href="/">
           <img src="/images/json-ld-data-24.png" alt="JSON-LD logo">
@@ -71,7 +73,7 @@
         </a>
 
         <!-- Dropdown menu -->
-        <div class="ui simple dropdown item {% if page.url == '/spec/' %}active{% endif %}">
+        <div class="ui simple dropdown item">
           <i class="folder open icon"></i>
           Specifications
           <i class="dropdown icon"></i>
@@ -103,12 +105,19 @@
       </div>
     </div>
 
-    <div class="ui main container">
+    {% if masthead %}
+    <div class="ui basic center aligned massive masthead segment">
+      <h1 class="ui massive header">{{ masthead.title }}</h1>
+      <p>{{ masthead.subtitle }}</p>
+    </div>
+    {% endif %}
+
+    <div class="ui main wide container">
     {{ content }}
     </div>
 
-    <div class="ui basic footer segment">
-      <div class="ui container">
+    <div class="ui basic footer segment" id="footer">
+      <div class="ui container" id="copyright">
         <p>Website content released under a
           <a href="https://creativecommons.org/about/cc0">Creative Commons CC0 Public Domain Dedication</a>
           except where an alternate is specified.</p>