diff --git a/examples/widget_design_patterns/js/example.js b/examples/widget_design_patterns/js/example.js
index d7e11cf0..4848b41e 100644
--- a/examples/widget_design_patterns/js/example.js
+++ b/examples/widget_design_patterns/js/example.js
@@ -1,8 +1,8 @@
 
 /*
-The following examples explain the common design pattern for Ox.js UI widgets:
-an inheritance model that is neither classical nor prototypal, but "parasitical"
-(a term coined by <a
+The following examples explain the common design pattern for OxJS UI widgets: an
+inheritance model that is neither classical nor prototypal, but "parasitical" (a
+term coined by <a
 href="http://www.crockford.com/javascript/inheritance.html">Douglas
 Crockford</a>). In a nutshell, "instances" are created by augmenting other
 instances, but in addition to private members (`var foo`) and public members
diff --git a/index.js b/index.js
index 2df1be12..bc1b69f7 100644
--- a/index.js
+++ b/index.js
@@ -273,7 +273,7 @@ Ox.load(function() {
                     + '(<span class="OxOperator">\\.</span>'
                     + '<span class="OxIdentifier">UI</span>)?'
                     + '<span class="OxOperator">\\.</span>'
-                    + '<span class="Ox\\w+">([\\$\\w]+)<\\/span>',
+                    + '<span class="Ox\\w+">([\\w\\$]+)<\\/span>',
                     'g'
                 ),
                 function (str) {
@@ -282,7 +282,7 @@ Ox.load(function() {
                 }
             ],
             comment: [
-                /\b(Ox\.[\w\$_]+)/g,
+                /\b(Ox\.[\w\$]+)/g,
                 '<a href="#doc/$1" class="OxMonospace doclink">$1</a>'
             ],
             version: [
@@ -361,12 +361,14 @@ Ox.load(function() {
             doc: function() {
                 return Ox.DocPanel({
                         element: $('<div>')
-                            .addClass('Ox___Serif page')
+                            .addClass('page')
                             .css({
                                 margin: '32px',
                                 width: window.innerWidth - 640 + 'px'
                             })
                             .html(app.html.documentation),
+                        examples: app.data.examples,
+                        examplesPath: 'examples/',
                         files: app.data.docItems ? void 0 : app.data.documentation,
                         getModule: function(item) {
                             var file = item.file.replace(/^dev\//, '');
@@ -378,6 +380,7 @@ Ox.load(function() {
                         },
                         items: app.data.docItems || void 0,
                         path: 'dev/',
+                        references: /\b(Ox\.[\w\$]+)\b/g,
                         replace: [app.re.code],
                         runTests: true,
                         selected: app.user.item.doc,
@@ -399,15 +402,15 @@ Ox.load(function() {
             examples: function() {
                 return Ox.ExamplePanel({
                         element: $('<div>')
-                            .addClass('Ox___Serif page')
+                            .addClass('page')
                             .css({
                                 margin: '32px',
                                 width: window.innerWidth - 640 + 'px'
                             })
                             .html(app.html.examples),
                         examples: app.data.examples,
-                        keywords: /\b(Ox\.[\w]+)\b/g,
                         path: 'examples/',
+                        references: /\b(Ox\.[\w\$]+)\b/g,
                         replaceCode: [app.re.code],
                         replaceComment: [app.re.comment],
                         selected: app.user.item.examples
@@ -468,7 +471,7 @@ Ox.load(function() {
             page: function(page, replace) {
                 var $element = Ox.Container();
                 $('<div>')
-                    .addClass('Ox____Serif OxSelectable page')
+                    .addClass('OxSelectable page')
                     .html(app.html[page].replace(app.re.version[0], app.re.version[1]))
                     .appendTo($element);
                 return $element;
@@ -544,7 +547,7 @@ Ox.load(function() {
                             .append(
                                 id ? html
                                 : $('<div>')
-                                    .addClass('Ox___Serif page')
+                                    .addClass('page')
                                     .css({
                                         margin: '16px',
                                         width: window.innerWidth - 640 + 'px'