diff --git a/website/layout/DocsLayout.js b/website/layout/DocsLayout.js
index 165c48005..86e97cfb4 100644
--- a/website/layout/DocsLayout.js
+++ b/website/layout/DocsLayout.js
@@ -48,6 +48,15 @@ var DocsLayout = React.createClass({
{metadata.previous && ← Prev}
{metadata.next && Next →}
+
+
+
+ We are planning improvements to the React Native documentation. Your responses to this short survey will go a long way in helping us provide valuable content. Thank you!
+
+
+ Take Survey
+
+
diff --git a/website/src/react-native/css/react-native.css b/website/src/react-native/css/react-native.css
index fded82557..b657d2ab8 100644
--- a/website/src/react-native/css/react-native.css
+++ b/website/src/react-native/css/react-native.css
@@ -1256,12 +1256,48 @@ div[data-twttr-id] iframe {
background-color: hsl(198, 100%, 94%);
}
+.survey {
+ padding: 10px;
+ padding-top: 0;
+ background-color: rgba(5, 165, 209, 0.05);
+ border: 2px solid #05A5D1;
+ position: relative;
+}
+
+.survey-image {
+ position: absolute;
+ top: 10px;
+ height: 83px;
+ width: 120px;
+ background-image: url('../img/survey.png');
+ background-size: 272px 198px;
+ background-position: -8px -8px;
+}
+
+.survey p {
+ margin-left: 130px;
+}
+
+.survey .button {
+ font-size: 24px;
+ background: #05A5D1;
+ color: #fafafa;
+}
+
@media only screen
and (max-device-width: 1024px) {
#content {
display: inline;
}
+ .survey-image {
+ position: static;
+ margin: 10px auto;
+ }
+ .survey p {
+ margin-left: 0px;
+ }
+
.container {
min-width: 0;
overflow: auto;
diff --git a/website/src/react-native/img/survey.png b/website/src/react-native/img/survey.png
new file mode 100644
index 000000000..8baf2fa31
Binary files /dev/null and b/website/src/react-native/img/survey.png differ