diff --git a/public/docs/_includes/styleguide/_code-examples.jade b/public/docs/_includes/styleguide/_code-examples.jade
index c9987f7739..e7b1e31edc 100644
--- a/public/docs/_includes/styleguide/_code-examples.jade
+++ b/public/docs/_includes/styleguide/_code-examples.jade
@@ -11,18 +11,35 @@
li format linenums (or linenums:4 specify starting line)
.showcase-content
+
+ .l-sub-section
+ h3 Inline Code Examples
+
+ p.
+ Inline code example {{username}}
+
+ code-example(format="linenums" language="html" escape="html").
+ Inline code example {{username}}
+
+ p.
+ Notice the ng-non-bindable attribute. This is only
+ needed when using code examples inline code-tabs and code-example directives
+ automatically do this.
+
.l-sub-section
h3 Adding a code example
code-example(format="linenums" language="html").
code-example(format="linenums" language="javascript").
//SOME CODE
+
.l-sub-section
h3 Specify starting line number
code-example(language="javascript" format="linenums:4").
code-example(language="html" format="linenums:4").
var title = "This starts on line four";
+
.l-sub-section
h3 Specify a language
diff --git a/public/resources/css/layout/_layout.scss b/public/resources/css/layout/_layout.scss
index 318808bbb0..02aaa4c104 100644
--- a/public/resources/css/layout/_layout.scss
+++ b/public/resources/css/layout/_layout.scss
@@ -118,6 +118,11 @@
padding: ($unit * 3) ($unit * 1);
}
+ code {
+ background: $fog;
+ color: $steel;
+ }
+
&:last-child {
margin: 0;
}