scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 09:35:56 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Add CPS video

Browse source
This commit is contained in:
seotts 2020-10-20 16:57:48 -04:00 committed by Karishma Chadha
parent 79bc95a4c6
commit ff6a3eb30f
3 changed files with 14 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/video-preview/video-preview.jsx
View file

@ -30,6 +30,7 @@ class VideoPreview extends React.Component {
<Video
className="video"
height={this.props.videoHeight}
isYouTube={this.props.isYouTube}
videoId={this.props.videoId}
width={this.props.videoWidth}
/>
@ -60,8 +61,13 @@ class VideoPreview extends React.Component {
}
}
VideoPreview.defaultProps = {
isYouTube: false
};
VideoPreview.propTypes = {
buttonMessage: PropTypes.string.isRequired,
isYouTube: PropTypes.bool,
thumbnail: PropTypes.string.isRequired,
thumbnailHeight: PropTypes.string,
thumbnailWidth: PropTypes.string,

6
src/views/annual-report/annual-report.jsx
View file

@ -1504,25 +1504,27 @@ class AnnualReport extends React.Component {
<div className="video-background cps">
<MediaQuery minWidth={frameless.tabletPortrait}>
<VideoPreview
isYouTube
buttonMessage={
this.props.intl.formatMessage({id: 'annualReport.watchVideo'})
}
thumbnail="/images/annual-report/initiatives/schools/CPS Story/CPS Video Thumbnail.png"
thumbnailWidth="580"
videoHeight="320"
videoId="joal01i8b1"
videoId="9QD9IxOinLg"
videoWidth="568"
/>
</MediaQuery>
<MediaQuery maxWidth={frameless.tabletPortrait - 1}>
<VideoPreview
isYouTube
buttonMessage={
this.props.intl.formatMessage({id: 'annualReport.watchVideo'})
}
thumbnail="/images/annual-report/initiatives/schools/CPS Story/CPS Video Thumbnail.png"
thumbnailWidth="400"
videoHeight="216"
videoId="joal01i8b1"
videoId="9QD9IxOinLg"
videoWidth="380"
/>
</MediaQuery>

4
src/views/annual-report/annual-report.scss
View file

@ -1721,6 +1721,10 @@ p {
&.cps {
background-image: url("/images/annual-report/initiatives/schools/CPS Story/CPS Video Splash.svg");
.button {
background-color: $ui-purple;
}
}
}
}