diff --git a/website/src/css/index.scss b/website/src/css/index.scss
index fe302857567..b00cc6b5d85 100644
--- a/website/src/css/index.scss
+++ b/website/src/css/index.scss
@@ -658,20 +658,20 @@ html[data-theme="dark"] .Section p a {
@extend %link-style-dark;
}
-/* Talks */
+/* VideoContent */
-.Talks {
+.VideoContent {
.twitter-follow-button {
margin-top: 1.5rem;
}
}
@media only screen and (max-width: 960px) {
- .Talks .TwoColumns {
+ .VideoContent .TwoColumns {
grid-gap: 2rem;
}
- .Talks .column.last {
+ .VideoContent .column.last {
width: 100%;
display: flex;
justify-content: center;
@@ -681,13 +681,13 @@ html[data-theme="dark"] .Section p a {
* If the full-width video won't fit, make it full-width.
* https://jameshfisher.com/2017/08/30/how-do-i-make-a-full-width-iframe/
*/
- .Talks .vidWrapper {
+ .VideoContent .vidWrapper {
position: relative;
width: 100%;
padding-top: 56.25%;
}
- .Talks iframe {
+ .VideoContent iframe {
position: absolute;
top: 0;
left: 0;
@@ -698,11 +698,11 @@ html[data-theme="dark"] .Section p a {
@media only screen and (min-width: 961px) {
/* Give more width for the video */
- .Talks .TwoColumns {
+ .VideoContent .TwoColumns {
grid-template-columns: 1fr 2fr;
}
- .Talks iframe {
+ .VideoContent iframe {
width: 560px;
height: 315px;
}
diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index ca6dc9c390e..96ef43cecd2 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -122,13 +122,13 @@ function HomeCallToAction() {
);
}
-function TwitterButton() {
+function TwitterButton({accountName}) {
return (
- Follow @reactnative
+ Follow @{accountName}
);
}
@@ -245,7 +245,7 @@ function HeaderHero() {
return (
+ The{' '} + + Meta Open Source team + {' '} + has put together a short overview of React Native, where they + explained the project in beginner's terms. +
+ > + } + columnTwo={ +