From ed576ec39fcfc0d75cdc8241b2eef5f832786157 Mon Sep 17 00:00:00 2001
From: Cameron J Roe <cameronjroe@gmail.com>
Date: Sat, 14 Feb 2015 22:55:59 -0500
Subject: [PATCH] update paper docs with inner content

---
 .../app/components/pages/components/paper.jsx | 135 ++++++++++++------
 docs/src/less/pages/components/paper.less     |   9 +-
 2 files changed, 103 insertions(+), 41 deletions(-)

diff --git a/docs/src/app/components/pages/components/paper.jsx b/docs/src/app/components/pages/components/paper.jsx
index b28d57a40512d5..fb553821ac9660 100644
--- a/docs/src/app/components/pages/components/paper.jsx
+++ b/docs/src/app/components/pages/components/paper.jsx
@@ -7,31 +7,56 @@ var PaperPage = React.createClass({
 
   render: function() {
 
-    var code = 
-      '//Rounded Corners\n' +
-      '<Paper zDepth={1} />\n' +
-      '<Paper zDepth={2} />\n' +
-      '<Paper zDepth={3} />\n' +
-      '<Paper zDepth={4} />\n' +
-      '<Paper zDepth={5} />\n\n' +
-      '//Sharp Corners\n' +
-      '<Paper zDepth={1} rounded={false} />\n' +
-      '<Paper zDepth={2} rounded={false} />\n' +
-      '<Paper zDepth={3} rounded={false} />\n' +
-      '<Paper zDepth={4} rounded={false} />\n' +
-      '<Paper zDepth={5} rounded={false} />\n\n' +
-      '//Circular\n' +
-      '<Paper zDepth={1} circle={true} />\n' +
-      '<Paper zDepth={2} circle={true} />\n' +
-      '<Paper zDepth={3} circle={true} />\n' +
-      '<Paper zDepth={4} circle={true} />\n' +
-      '<Paper zDepth={5} circle={true} />\n\n' +
-      '//Inner Content\n' +
-      '<Paper innerClassName="article">\n' +
-      '  <h1>Paper</h1>\n' + 
-      '  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,' +
-      '  tempor incididunt ut labore et dolore magna aliqua.</p>\n' +
-      '</Paper>\n';
+    var code = [
+      '//Rounded Corners',
+      '<Paper zDepth={1}>',
+      '  <p>zDepth=1</p>',
+      '</Paper>',
+      '<Paper zDepth={2}>',
+      '  <p>zDepth=2</p>',
+      '</Paper>',
+      '<Paper zDepth={3}>',
+      '  <p>zDepth=3</p>',
+      '</Paper>',
+      '<Paper zDepth={4}>',
+      '  <p>zDepth=4</p>',
+      '</Paper>',
+      '<Paper zDepth={5}>',
+      '  <p>zDepth=5</p>',
+      '</Paper>',
+      '//Sharp Corners',
+      '<Paper zDepth={1} rounded={false}>',
+      '  <p>rounded=false</p>',
+      '</Paper>',
+      '<Paper zDepth={2} rounded={false}>',
+      '  <p>rounded=false</p>',
+      '</Paper>',
+      '<Paper zDepth={3} rounded={false}>',
+      '  <p>rounded=false</p>',
+      '</Paper>',
+      '<Paper zDepth={4} rounded={false}>',
+      '  <p>rounded=false</p>',
+      '</Paper>',
+      '<Paper zDepth={5} rounded={false}>',
+      '  <p>rounded=false</p>',
+      '</Paper>',
+      '//Circular',
+      '<Paper zDepth={1} circle={true}>',
+      '  <p>circle=true</p>',
+      '</Paper>',
+      '<Paper zDepth={2} circle={true}>',
+      '  <p>circle=true</p>',
+      '</Paper>',
+      '<Paper zDepth={3} circle={true}>',
+      '  <p>circle=true</p>',
+      '</Paper>',
+      '<Paper zDepth={4} circle={true}>',
+      '  <p>circle=true</p>',
+      '</Paper>',
+      '<Paper zDepth={5} circle={true}>',
+      '  <p>circle=true</p>',
+      '</Paper>'
+      ].join('\n');
 
     var componentInfo = [
       {
@@ -86,27 +111,57 @@ var PaperPage = React.createClass({
 
         <div className="paper-examples">
           <div className="paper-examples-group">
-            <Paper zDepth={1} />
-            <Paper zDepth={2} />
-            <Paper zDepth={3} />
-            <Paper zDepth={4} />
-            <Paper zDepth={5} />
+	    <Paper zDepth={1}>
+	      <p>zDepth=1</p>
+	    </Paper>
+	    <Paper zDepth={2}>
+	      <p>zDepth=2</p>
+	    </Paper>
+	    <Paper zDepth={3}>
+	      <p>zDepth=3</p>
+	    </Paper>
+	    <Paper zDepth={4}>
+	      <p>zDepth=4</p>
+	    </Paper>
+	    <Paper zDepth={5}>
+	      <p>zDepth=5</p>
+	    </Paper>
           </div>
 
           <div className="paper-examples-group">
-            <Paper zDepth={1} rounded={false} />
-            <Paper zDepth={2} rounded={false} />
-            <Paper zDepth={3} rounded={false} />
-            <Paper zDepth={4} rounded={false} />
-            <Paper zDepth={5} rounded={false} />
+	    <Paper zDepth={1} rounded={false}>
+	      <p>rounded=false</p>
+	    </Paper>
+	    <Paper zDepth={2} rounded={false}>
+	      <p>rounded=false</p>
+	    </Paper>
+	    <Paper zDepth={3} rounded={false}>
+	      <p>rounded=false</p>
+	    </Paper>
+	    <Paper zDepth={4} rounded={false}>
+	      <p>rounded=false</p>
+	    </Paper>
+	    <Paper zDepth={5} rounded={false}>
+	      <p>rounded=false</p>
+	    </Paper>
           </div>
 
           <div className="paper-examples-group">
-            <Paper zDepth={1} circle={true} />
-            <Paper zDepth={2} circle={true} />
-            <Paper zDepth={3} circle={true} />
-            <Paper zDepth={4} circle={true} />
-            <Paper zDepth={5} circle={true} />
+	    <Paper zDepth={1} circle={true}>
+	      <p>circle=true</p>
+	    </Paper>
+	    <Paper zDepth={2} circle={true}>
+	      <p>circle=true</p>
+	    </Paper>
+	    <Paper zDepth={3} circle={true}>
+	      <p>circle=true</p>
+	    </Paper>
+	    <Paper zDepth={4} circle={true}>
+	      <p>circle=true</p>
+	    </Paper>
+	    <Paper zDepth={5} circle={true}>
+	      <p>circle=true</p>
+	    </Paper>
           </div>
         </div>
 
diff --git a/docs/src/less/pages/components/paper.less b/docs/src/less/pages/components/paper.less
index 394d820135746d..43688993dad6d8 100644
--- a/docs/src/less/pages/components/paper.less
+++ b/docs/src/less/pages/components/paper.less
@@ -6,6 +6,13 @@
     margin: 0 auto;
     margin-bottom: 64px;
   }
+  .mui-paper-container {
+    text-align: center;
+    p {
+      line-height: 80px;
+      height: 100%;
+    }
+  }
 
   @media @device-medium {
     .clearfix();
@@ -15,4 +22,4 @@
       width: 33%;
     }
   }
-}
\ No newline at end of file
+}