Style comments in examples in a different color
authorMarkus Lanthaler <mark_lanthaler@gmx.net>
Thu, 17 Oct 2013 20:34:25 +0200
changeset 2033 faea9505be17
parent 2032 9c8ec577075d
child 2034 93bc200cad10
child 2035 5f491cadb029
Style comments in examples in a different color
spec/latest/json-ld-api/index.html
spec/latest/json-ld/index.html
spec/latest/respec-w3c-extensions.js
--- a/spec/latest/json-ld-api/index.html	Thu Oct 17 20:27:14 2013 +0200
+++ b/spec/latest/json-ld-api/index.html	Thu Oct 17 20:34:25 2013 +0200
@@ -92,8 +92,12 @@
 //]]>
 </script>
 <style type="text/css">
-  .diff {
-    font-weight:bold; color:#0a3;
+  .highlight {
+    font-weight: bold;
+    color: #0a3;
+  }
+  .comment {
+    color: #999;
   }
   .error a {
     color:  #ff4500;
--- a/spec/latest/json-ld/index.html	Thu Oct 17 20:27:14 2013 +0200
+++ b/spec/latest/json-ld/index.html	Thu Oct 17 20:34:25 2013 +0200
@@ -90,7 +90,8 @@
 //]]>
 </script>
 <style type="text/css">
-  .diff { font-weight:bold; color:#0a3; }
+  .highlight { font-weight: bold; color: #0a3; }
+  .comment { color: #999; }
   table, thead, tr, td { padding: 5px; border-width: 1px; border-spacing: 0px; border-style: solid; border-collapse: collapse; }
   .atrisk-head { font-style: italic; }
 </style>
@@ -526,7 +527,7 @@
   <!--
   {
     "****http://schema.org/name****": "Manu Sporny",
-    "****http://schema.org/url****": ****{ "@id": ****"http://manu.sporny.org/" ****}****,  ← The '@id' keyword means 'This value is an identifier that is an IRI'
+    "****http://schema.org/url****": ****{ "@id": ****"http://manu.sporny.org/" ****}****,  ####← The '@id' keyword means 'This value is an identifier that is an IRI'####
     "****http://schema.org/image****": ****{ "@id": ****"http://manu.sporny.org/images/manu.png" ****}****
   }
   -->
@@ -565,14 +566,14 @@
     {
       ****"@context":
       {
-        "name": "http://schema.org/name",****  ← This means that 'name' is shorthand for 'http://schema.org/name' ****
+        "name": "http://schema.org/name",****  ####← This means that 'name' is shorthand for 'http://schema.org/name'#### ****
         "image": {
-          "@id": "http://schema.org/image",****  ← This means that 'image' is shorthand for 'http://schema.org/image' ****
-          "@type": "@id"****  ← This means that a string value associated with 'image' should be interpreted as an identifier that is an IRI ****
+          "@id": "http://schema.org/image",****  ####← This means that 'image' is shorthand for 'http://schema.org/image'#### ****
+          "@type": "@id"****  ####← This means that a string value associated with 'image' should be interpreted as an identifier that is an IRI#### ****
         },
         "homepage": {
-          "@id": "http://schema.org/url",****  ← This means that 'homepage' is shorthand for 'http://schema.org/url' ****
-          "@type": "@id"****  ← This means that a string value associated with 'homepage' should be interpreted as an identifier that is an IRI ****
+          "@id": "http://schema.org/url",****  ####← This means that 'homepage' is shorthand for 'http://schema.org/url'#### ****
+          "@type": "@id"****  ####← This means that a string value associated with 'homepage' should be interpreted as an identifier that is an IRI#### ****
         }
       }****
     }
@@ -1191,11 +1192,11 @@
 {
 ...
   "@id": "http://example.org/posts#TripToWestVirginia",
-  ****"@type": "http://schema.org/BlogPosting"****,  ← This is a node type
+  ****"@type": "http://schema.org/BlogPosting"****,  ####← This is a node type####
   "modified":
   {
     "@value": "2010-05-29T14:17:39+02:00",
-    ****"@type": "http://www.w3.org/2001/XMLSchema#dateTime"****  ← This is a value type
+    ****"@type": "http://www.w3.org/2001/XMLSchema#dateTime"****  ####← This is a value type####
   }
 ...
 }
--- a/spec/latest/respec-w3c-extensions.js	Thu Oct 17 20:27:14 2013 +0200
+++ b/spec/latest/respec-w3c-extensions.js	Thu Oct 17 20:34:25 2013 +0200
@@ -160,6 +160,7 @@
   content = content.replace(/<!--/, '');
   content = content.replace(/-->/, '');
   content = _esc(content);
-  content = content.replace(/\*\*\*\*([^*]*)\*\*\*\*/g, '<span class="diff">$1</span>') ;
+  content = content.replace(/\*\*\*\*([^*]*)\*\*\*\*/g, '<span class="highlight">$1</span>');
+  content = content.replace(/####([^#]*)####/g, '<span class="comment">$1</span>');
   return content ;
 }