From df96a403f9a62448c689584cd4bf9e74f4b6dd22 Mon Sep 17 00:00:00 2001
From: Jimmy Jia <tesrin@gmail.com>
Date: Fri, 2 Oct 2015 20:24:32 -0400
Subject: [PATCH] Fix contained popover examples

---
 docs/assets/style.css                       |  1 -
 docs/examples/PopoverContained.js           |  4 +--
 docs/examples/PopoverPositionedScrolling.js | 38 ++++++++++++---------
 3 files changed, 23 insertions(+), 20 deletions(-)

diff --git a/docs/assets/style.css b/docs/assets/style.css
index d71f5df7a4..a22a938276 100644
--- a/docs/assets/style.css
+++ b/docs/assets/style.css
@@ -113,7 +113,6 @@ body {
 
 .bs-example-popover-scroll > div {
   position: relative;
-  padding: 100px 0;
 }
 
 .playground {
diff --git a/docs/examples/PopoverContained.js b/docs/examples/PopoverContained.js
index a5fc30f435..cedf3c1ae9 100644
--- a/docs/examples/PopoverContained.js
+++ b/docs/examples/PopoverContained.js
@@ -17,7 +17,7 @@ class Example extends React.Component {
           show={this.state.show}
           target={()=> React.findDOMNode(this.state.target)}
           placement="bottom"
-          container={mountNode}
+          container={this}
           containerPadding={20}
         >
           <Popover title="Popover bottom">
@@ -29,4 +29,4 @@ class Example extends React.Component {
   }
 }
 
-React.render(<Example/>, mountNode);
+React.render(<Example />, mountNode);
diff --git a/docs/examples/PopoverPositionedScrolling.js b/docs/examples/PopoverPositionedScrolling.js
index 029dd0de7d..1737253675 100644
--- a/docs/examples/PopoverPositionedScrolling.js
+++ b/docs/examples/PopoverPositionedScrolling.js
@@ -1,18 +1,22 @@
-const positionerInstance = (
-  <ButtonToolbar>
-    <OverlayTrigger container={mountNode} trigger="click" placement="left" overlay={<Popover title="Popover left"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
-      <Button bsStyle="default">Holy guacamole!</Button>
-    </OverlayTrigger>
-    <OverlayTrigger container={mountNode} trigger="click" placement="top" overlay={<Popover title="Popover top"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
-      <Button bsStyle="default">Holy guacamole!</Button>
-    </OverlayTrigger>
-    <OverlayTrigger container={mountNode} trigger="click" placement="bottom" overlay={<Popover title="Popover bottom"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
-      <Button bsStyle="default">Holy guacamole!</Button>
-    </OverlayTrigger>
-    <OverlayTrigger container={mountNode} trigger="click" placement="right" overlay={<Popover title="Popover right"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
-      <Button bsStyle="default">Holy guacamole!</Button>
-    </OverlayTrigger>
-  </ButtonToolbar>
-);
+class Positioner extends React.Component {
+  render() {
+    return (
+      <ButtonToolbar style={{padding: '100px 0'}}>
+        <OverlayTrigger container={this} trigger="click" placement="left" overlay={<Popover title="Popover left"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
+          <Button bsStyle="default">Holy guacamole!</Button>
+        </OverlayTrigger>
+        <OverlayTrigger container={this} trigger="click" placement="top" overlay={<Popover title="Popover top"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
+          <Button bsStyle="default">Holy guacamole!</Button>
+        </OverlayTrigger>
+        <OverlayTrigger container={this} trigger="click" placement="bottom" overlay={<Popover title="Popover bottom"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
+          <Button bsStyle="default">Holy guacamole!</Button>
+        </OverlayTrigger>
+        <OverlayTrigger container={this} trigger="click" placement="right" overlay={<Popover title="Popover right"><strong>Holy guacamole!</strong> Check this info.</Popover>}>
+          <Button bsStyle="default">Holy guacamole!</Button>
+        </OverlayTrigger>
+      </ButtonToolbar>
+    );
+  }
+}
 
-React.render(positionerInstance, mountNode);
+React.render(<Positioner />, mountNode);