diff --git a/src/views/splash/feature/middle-banner.jsx b/src/views/splash/feature/middle-banner.jsx
deleted file mode 100644
index 735c82e12..000000000
--- a/src/views/splash/feature/middle-banner.jsx
+++ /dev/null
@@ -1,43 +0,0 @@
-const FormattedMessage = require('react-intl').FormattedMessage;
-const injectIntl = require('react-intl').injectIntl;
-const React = require('react');
-
-const MediaQuery = require('react-responsive').default;
-
-const FlexRow = require('../../../components/flex-row/flex-row.jsx');
-const TitleBanner = require('../../../components/title-banner/title-banner.jsx');
-
-const frameless = require('../../../lib/frameless');
-
-require('./middle-banner.scss');
-
-const MiddleBanner = () => (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-);
-
-module.exports = injectIntl(MiddleBanner);
diff --git a/src/views/splash/feature/middle-banner.scss b/src/views/splash/feature/middle-banner.scss
deleted file mode 100644
index a51926f14..000000000
--- a/src/views/splash/feature/middle-banner.scss
+++ /dev/null
@@ -1,99 +0,0 @@
-@import "../../../colors";
-@import "../../../frameless";
-
-.feature-middle-banner {
- display: flex;
- margin-top: 20px;
- border-radius: 16px;
- background-color: $ui-orange;
- background-image: url("/images/feature/bg-pattern.png");
- background-size: cover;
- padding: 0;
- height: 17rem;
- overflow: hidden;
- box-sizing: border-box;
- justify-content: space-between;
-
- .feature-middle-container {
- padding-left: 3rem;
- align-items: flex-start;
- flex-shrink: 0;
- }
-
- .feature-banner-images {
- display: flex;
- height: 100%;
- align-self: flex-end;
-
- .feature-banner-image {
- display: flex;
- margin-right: 2rem;
- min-width: 0;
- height: 100%;
- align-self: flex-end;
-
- img {
- display: block;
- max-width: 100%;
- max-height: 100%;
- align-self: flex-end;
- }
- }
- }
-
- .feature-header,
- .feature-copy,
- .feature-call-to-action {
- color: $ui-white;
- }
-
- .feature-header {
- font-size: 1.7rem;
- }
-
- .feature-copy {
- margin-bottom: 1rem;
- max-width: 350px;
- line-height: 1.7rem;
- font-size: 1.3rem;
- }
-
- .feature-call-to-action {
- border-radius: 10px;
- padding: 1em 2em;
- font-size: 1em;
- }
-}
-
-@media #{$intermediate} {
- .feature-middle-banner {
- margin: 20px auto 40px auto;
- width: $cols8;
- height: initial;
- flex-direction: column;
- justify-content: center;
-
- .feature-middle-container {
- padding-top: 4rem;
- padding-left: 0;
- align-items: center;
- }
-
- .feature-banner-images {
- .feature-banner-image {
- margin: 0;
- padding: 0;
-
- &.left {
- margin-left: -2.5rem;
- }
-
- &.right {
- margin-right: -2.5rem;
- }
- }
- }
- }
-}
-
-
diff --git a/src/views/splash/feature/small-top-banner.jsx b/src/views/splash/feature/small-top-banner.jsx
deleted file mode 100644
index d3eb366bc..000000000
--- a/src/views/splash/feature/small-top-banner.jsx
+++ /dev/null
@@ -1,26 +0,0 @@
-const FormattedMessage = require('react-intl').FormattedMessage;
-const injectIntl = require('react-intl').injectIntl;
-const React = require('react');
-
-const FlexRow = require('../../../components/flex-row/flex-row.jsx');
-const TitleBanner = require('../../../components/title-banner/title-banner.jsx');
-
-require('./small-top-banner.scss');
-
-const SmallTopBanner = () => (
-
-
-
-
-
-
-
-
-
-
-);
-
-module.exports = injectIntl(SmallTopBanner);
diff --git a/src/views/splash/feature/small-top-banner.scss b/src/views/splash/feature/small-top-banner.scss
deleted file mode 100644
index 6d8866933..000000000
--- a/src/views/splash/feature/small-top-banner.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-@import "../../../colors";
-
-.small-top-banner {
- background: $ui-orange;
- padding: 5px 0;
-
- .small-top-container {
- justify-content: center;
- }
-
- .copy,
- .call-to-action {
- color: $ui-white;
- font-weight: 500;
- }
-
- .copy {
- font-size: 1.1rem;
- }
-
- .call-to-action {
- margin-left: 32px;
- border-radius: 8px;
- padding: .625rem 1.2rem;
- font-size: 1rem;
- }
-}
diff --git a/src/views/splash/feature/top-banner.jsx b/src/views/splash/feature/top-banner.jsx
deleted file mode 100644
index 9dff84981..000000000
--- a/src/views/splash/feature/top-banner.jsx
+++ /dev/null
@@ -1,47 +0,0 @@
-const FormattedMessage = require('react-intl').FormattedMessage;
-const injectIntl = require('react-intl').injectIntl;
-const React = require('react');
-const PropTypes = require('prop-types');
-
-const FlexRow = require('../../../components/flex-row/flex-row.jsx');
-const TitleBanner = require('../../../components/title-banner/title-banner.jsx');
-
-require('./top-banner.scss');
-
-const TopBanner = props => (
-
-
-
-
-
- {/*
-
-
*/}
-
- {/* */}
-
-
-
-
-
-
-
-
-
-
-
-
-);
-
-TopBanner.propTypes = {
- actionLink: PropTypes.string
-};
-
-TopBanner.defaultProps = {
- actionLink: 'https://scratch.mit.edu'
-};
-
-module.exports = injectIntl(TopBanner);
diff --git a/src/views/splash/feature/top-banner.scss b/src/views/splash/feature/top-banner.scss
deleted file mode 100644
index c3ca9cf91..000000000
--- a/src/views/splash/feature/top-banner.scss
+++ /dev/null
@@ -1,223 +0,0 @@
-@import "../../../colors";
-@import "../../../frameless";
-
-.feature-top-banner {
- display: flex;
- position: relative;
- background-color: $ui-blue;
- // background-image: url("/images/feature/bg-pattern.png");
- background-size: cover;
- padding: 0;
- min-height: 22rem;
- // overflow: hidden; // if banner shouldn't have things that break the edges
- justify-content: center;
-
- .feature-top-container {
- z-index: 1;
- justify-content: center;
- align-items: flex-start;
- min-height: 20rem;
- max-width: 55%;
- }
-
- .feature-banner-images {
- display: flex;
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- width: 100%;
- justify-content: space-between;
- }
-
- .feature-banner-image {
- display: flex;
- align-self: flex-end;
-
- img {
- max-width: 100%;
- height: auto;
- align-self: flex-end;
- }
-
- &.left {
- margin: auto 0;
- width: 14rem;
- }
-
- &.right {
- width: 50%;
- justify-content: flex-end;
- }
- }
-
- .feature-header,
- .feature-copy,
- .feature-call-to-action {
- color: $ui-white;
- }
-
- .feature-header {
- margin-bottom: .75rem;
- font-size: 4rem;
- line-height: 4.2rem;
- max-width: 570px; // Ensure that launch title wraps before 'is'
- }
-
- .feature-copy {
- font-size: 1.3rem;
- }
-
- .feature-call-to-action {
- border-radius: 4px;
- background-color: $ui-dark-orange;
- padding: 1rem 1.5rem;
- font-size: 1rem;
-
- &:before {
- display: inline-block;
- margin-right: .5rem;
- background-repeat: no-repeat;
- background-position: center center;
- background-size: contain;
- background-image: url("/svgs/feature/create-icon.svg");
- width: 1.5rem;
- height: 1.5rem;
- vertical-align: -.35rem;
- content: "";
- }
- }
-}
-
-@media only screen and (min-width: $desktop) {
- .feature-banner-image {
- &.right:after {
- display: block;
- position: absolute;
- bottom: -42px;
- right: 33%;
- background-image: url("/svgs/feature/tapping-block.svg");
- background-repeat: no-repeat;
- width: 122px;
- height: 81px;
- content: "";
- }
- }
-}
-
-@media only screen and (min-width: $mobileIntermediate) {
- .feature-top-banner {
- margin-bottom: 80px; // double the normal banner 40px for the notch
-
- &:after{
- display: block;
- position: absolute;
- bottom: -46px;
- left: 48px;
- background-image: url("/svgs/feature/banner-notch.svg");
- background-repeat: no-repeat;
- width: 433px;
- height: 56px;
- content: "";
- }
-
- .feature-top-container {
- transform: translateX(-15%);
- }
- }
-}
-
-
-@media only screen and (max-width: $desktop - 1) {
- .feature-top-banner {
- .feature-header {
- text-align: left; // override #view text centering
- }
- }
-}
-
-@media only screen and (min-width: $mobile) and (max-width: $desktop - 1) {
- .feature-top-banner {
- justify-content: flex-start;
-
- .feature-header {
- text-align: left; // override #view text centering
- }
-
- .feature-banner-images {
- justify-content: flex-end;
- }
-
- .feature-top-container {
- transform: translateX(10%);
- }
-
- .feature-banner-image {
- &.left {
- display: none;
- }
- }
- }
-}
-
-@media only screen and (min-width: $mobileIntermediate) and (max-width: $desktop - 1) {
- .feature-top-banner {
- .feature-banner-images {
- overflow: hidden; // make sure overflow is hidden to avoid scrolling with translated content
- }
-
- .feature-banner-image {
- &.right {
- width: 80%;
- transform: translateX(10%);
- }
- }
- }
-}
-
-@media only screen and (min-width: $mobile) and (max-width: $mobileIntermediate - 1) {
- .feature-top-banner {
- .feature-banner-image {
- &.right {
- width: 100%;
- transform: translateX(30%);
- }
- }
- }
-}
-
-@media only screen and (max-width: $mobile - 1) {
- .feature-top-banner {
- overflow: hidden;
- min-height: 32rem;
-
- .feature-top-container {
- right: 0;
- left: 0;
- min-height: 30rem;
- max-width: 100%;
- justify-content: flex-start;
- align-items: center;
- }
-
- .feature-header {
- margin: 2rem 0;
- text-align: center;
- }
-
- .feature-banner-image {
- &.right {
- margin-right: 0;
- margin-bottom: -4rem;
- width: 100%;
- }
-
- &.left {
- margin-bottom: .5rem;
- display: block;
- width: 25%;
- }
- }
- }
-}
diff --git a/src/views/splash/l10n.json b/src/views/splash/l10n.json
index ec969065c..07e3885ca 100644
--- a/src/views/splash/l10n.json
+++ b/src/views/splash/l10n.json
@@ -36,9 +36,5 @@
"welcome.welcomeToScratch": "Welcome to Scratch!",
"welcome.learn": "Learn how to make a project in Scratch",
"welcome.tryOut": "Try out starter projects",
- "welcome.connect": "Connect with other Scratchers",
-
- "featureBanner.title": "The new Scratch is here!",
- "featureBanner.subtitle": "not used",
- "featureBanner.callToAction": "call to action"
+ "welcome.connect": "Connect with other Scratchers"
}
diff --git a/src/views/splash/presentation.jsx b/src/views/splash/presentation.jsx
index 0fb4c42ad..eea14c54a 100644
--- a/src/views/splash/presentation.jsx
+++ b/src/views/splash/presentation.jsx
@@ -2,11 +2,9 @@ const bindAll = require('lodash.bindall');
const FormattedMessage = require('react-intl').FormattedMessage;
const injectIntl = require('react-intl').injectIntl;
const intlShape = require('react-intl').intlShape;
-const MediaQuery = require('react-responsive').default;
const PropTypes = require('prop-types');
const React = require('react');
-const frameless = require('../../lib/frameless');
const sessionActions = require('../../redux/session.js');
const shuffle = require('../../lib/shuffle.js').shuffle;
@@ -31,14 +29,6 @@ const LoveProjectMessage = require('./activity-rows/love-project.jsx');
const RemixProjectMessage = require('./activity-rows/remix-project.jsx');
const ShareProjectMessage = require('./activity-rows/share-project.jsx');
-// Featured Banner Components
-const TopBanner = require('./feature/top-banner.jsx');
-const SmallTopBanner = require('./feature/small-top-banner.jsx');
-const MiddleBanner = require('./feature/middle-banner.jsx');
-
-// Scratch 3.0 Launch Banner
-const LAUNCH_END_TIME = 1547873999000;
-
require('./splash.scss');
class ActivityList extends React.Component {
@@ -231,7 +221,7 @@ class SplashPresentation extends React.Component { // eslint-disable-line react/
}
}
}
- renderHomepageRows (showBanner) {
+ renderHomepageRows () {
const rows = [
-
-
- );
- }
-
if (this.props.featuredGlobal.scratch_design_studio &&
this.props.featuredGlobal.scratch_design_studio.length > 4) {
@@ -369,10 +344,7 @@ class SplashPresentation extends React.Component { // eslint-disable-line react/
return rows;
}
render () {
- const ShowTopBanner = Date.now() < LAUNCH_END_TIME;
- const ShowMiddleBanner = false;
- const ShowSmallTopBanner = false;
- const featured = this.renderHomepageRows(ShowMiddleBanner);
+ const featured = this.renderHomepageRows();
const formatHTMLMessage = this.props.intl.formatHTMLMessage;
const formatMessage = this.props.intl.formatMessage;
@@ -438,34 +410,10 @@ class SplashPresentation extends React.Component { // eslint-disable-line react/
{
this.props.sessionStatus === sessionActions.Status.FETCHED &&
Object.keys(this.props.user).length === 0 && // if user is not logged in
- (ShowTopBanner ? [
-
-
-
- ] : [
-
- ]
- )
- }
- {
- this.props.sessionStatus === sessionActions.Status.FETCHED &&
- Object.keys(this.props.user).length !== 0 && // if user is logged in
- ShowTopBanner &&
-
- {ShowSmallTopBanner ?
- :
-
- }
-
+
}