scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 00:21:20 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Style small top banner a little more

Browse source
This commit is contained in:
Connor Hudson 2018-07-02 09:59:22 -04:00
parent 4c49ae1701
commit 918b4b5948
2 changed files with 27 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/views/splash/beta/small-top-banner.jsx
View file

@ -5,15 +5,16 @@ const React = require('react');
const FlexRow = require('../../../components/flex-row/flex-row.jsx');
const TitleBanner = require('../../../components/title-banner/title-banner.jsx');
require('./top-banner.scss');
require('./small-top-banner.scss');
const SmallTopBanner = () => (
<TitleBanner className="beta-top-banner">
<FlexRow>
<TitleBanner className="beta-small-top-banner">
<FlexRow className="beta-small-header">
<h2 className="beta-copy">Try out the beta version of Scratch 3.0</h2>
<a
className="call-to-action button"
className="beta-try-it button"
href="https://beta.scratch.mit.edu/"
>Call to Action</a>
>Try it!</a>
</FlexRow>
</TitleBanner>
);

21
src/views/splash/beta/small-top-banner.scss Normal file
View file

@ -0,0 +1,21 @@
@import "../../../colors";
.beta-small-top-banner {
background: $ui-orange;
padding: 5px 0;
.beta-small-header {
justify-content: center;
}
.beta-copy,
.beta-try-it {
color: $ui-white;
font-size: 16px;
}
.beta-try-it {
margin-left: 32px;
border-radius: 10px;
}
}