mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-27 01:25:52 -05:00
world and video
This commit is contained in:
caseymm
parent
537704cf89
commit
1b84e3417b
4 changed files with 141 additions and 3 deletions
|
|
@ -808,6 +808,87 @@ class AnnualReport extends React.Component {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content around users">
|
||||
<div className="users-text">
|
||||
<p>
|
||||
<span className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityRegistedUsers" />
|
||||
</span>
|
||||
<FormattedMessage id="annualReport.connectivityRegistedUsersNumbers" />
|
||||
</p>
|
||||
</div>
|
||||
<img src="/images/annual-report/2020/connectivity/India_Data/data_alltimeusers_graphic.svg" />
|
||||
</div>
|
||||
<div className="content around users">
|
||||
<div className="stats">
|
||||
<p className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityIndiaUsers" />
|
||||
</p>
|
||||
<h2>
|
||||
<FormattedMessage id="annualReport.connectivityIndiaUsersPercent" />
|
||||
</h2>
|
||||
<p className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityIndiaYear" />
|
||||
</p>
|
||||
<div className="bubble inverted">
|
||||
<FormattedMessage
|
||||
id="annualReport.connectivityIndiaUsersOld"
|
||||
values={{
|
||||
million: (
|
||||
<FormattedMessage id="annualReport.reachMillion" />
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<img src="/images/annual-report/2020/Symbols-UI/Arrow_Next_purple.svg" />
|
||||
<FormattedMessage
|
||||
id="annualReport.connectivityIndiaUsersNew"
|
||||
values={{
|
||||
million: (
|
||||
<FormattedMessage id="annualReport.reachMillion" />
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="stats">
|
||||
<p className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityIndiaProjects" />
|
||||
</p>
|
||||
<h2>
|
||||
<FormattedMessage id="annualReport.connectivityIndiaProjectsPercent" />
|
||||
</h2>
|
||||
<p className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityIndiaYear" />
|
||||
</p>
|
||||
<div className="bubble inverted">
|
||||
<FormattedMessage
|
||||
id="annualReport.connectivityIndiaProjectsOld" />
|
||||
<img src="/images/annual-report/2020/Symbols-UI/Arrow_Next_purple.svg" />
|
||||
<FormattedMessage
|
||||
id="annualReport.connectivityIndiaProjectsNew"
|
||||
values={{
|
||||
million: (
|
||||
<FormattedMessage id="annualReport.reachMillion" />
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="world">
|
||||
<div className="spotlight bubble connectivity">
|
||||
<FormattedMessage id="annualReport.spotlightStory" />
|
||||
</div>
|
||||
<h2>
|
||||
<FormattedMessage id="annualReport.connectivityWorld" />
|
||||
</h2>
|
||||
<p className="bold">
|
||||
<FormattedMessage id="annualReport.connectivityWorldSubtitle" />
|
||||
</p>
|
||||
<a href="https://scratch.wistia.com/medias/rlsjbx0st4">
|
||||
<img src="/images/annual-report/2020/connectivity/Scratch Around the World Video.svg" />
|
||||
</a>
|
||||
</div>
|
||||
<div className="tools-LEGO">
|
||||
<img src="/images/annual-report/initiatives/LEGO Robotics Illustration.svg" />
|
||||
<div className="tools-LEGO-info">
|
||||
|
|
|
|||
|
|
@ -1180,6 +1180,9 @@ img.comment-viz{
|
|||
}
|
||||
|
||||
.initiatives-subsection-content.connectivity{
|
||||
.bold{
|
||||
font-weight: bold;
|
||||
}
|
||||
.content{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
@ -1188,6 +1191,12 @@ img.comment-viz{
|
|||
width: 100%;
|
||||
&.around{
|
||||
justify-content: space-around;
|
||||
&.users{
|
||||
justify-content: center;
|
||||
@media #{$intermediate} {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media #{$intermediate} {
|
||||
flex-direction: column;
|
||||
|
|
@ -1214,6 +1223,24 @@ img.comment-viz{
|
|||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
.users-text{
|
||||
max-width: 400px;
|
||||
}
|
||||
.stats{
|
||||
max-width: 300px;
|
||||
text-align: center;
|
||||
margin: 0 30px;
|
||||
@media #{$intermediate-and-smaller} {
|
||||
margin: 0 0;
|
||||
}
|
||||
p{
|
||||
max-width: 233px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.bubble.inverted{
|
||||
max-width: 198px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bubble{
|
||||
margin-left: 0px;
|
||||
|
|
@ -1238,6 +1265,21 @@ img.comment-viz{
|
|||
text-align: center;
|
||||
margin: 35px auto;
|
||||
}
|
||||
.world{
|
||||
text-align: center;
|
||||
margin-top: 80px;
|
||||
.bubble{
|
||||
margin-left: auto;
|
||||
}
|
||||
img{
|
||||
width: 100%;
|
||||
@media #{$intermediate-and-smaller} {
|
||||
width: 170%;
|
||||
overflow: hidden;
|
||||
margin-left: -35%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
|||
|
|
@ -80,8 +80,20 @@
|
|||
"annualReport.connectivityIndiaProjectsNumber": "2.3 {million}",
|
||||
"annualReport.connectivityIndiaProjectsSubhead": "Projects Were Created Online in 2020",
|
||||
"annualReport.connectivityIndiaProjectsIncreasePercent": "602% from 2019",
|
||||
"annualReport.toolsMostPopular": "Most Popular",
|
||||
"annualReport.toolsTexttoSpeechPopular": "{mostPopular} new Scratch Extension in the community",
|
||||
"annualReport.connectivityRegistedUsers": "The number of all-time registered users in India more than doubled in one year, ",
|
||||
"annualReport.connectivityRegistedUsersNumbers": "rising from 316,219 in 2019 to 713,384 in 2020.",
|
||||
"annualReport.connectivityIndiaUsers": "The number of unique visitors increased",
|
||||
"annualReport.connectivityIndiaUsersPercent": "156%",
|
||||
"annualReport.connectivityIndiaUsersOld": "1.8 {million}",
|
||||
"annualReport.connectivityIndiaUsersNew": "4.6 {million}",
|
||||
"annualReport.connectivityIndiaProjects": "The number of people creating projects increased",
|
||||
"annualReport.connectivityIndiaProjectsPercent": "270%",
|
||||
"annualReport.connectivityIndiaYear": "in 2020",
|
||||
"annualReport.connectivityIndiaProjectsOld": "303 thousand",
|
||||
"annualReport.connectivityIndiaProjectsNew": "1.1 {million}",
|
||||
"annualReport.connectivityWorld": "Scratch Around the World",
|
||||
"annualReport.connectivityWorldSubtitle": "International Collaborators",
|
||||
|
||||
"annualReport.toolsCollabAWS": "Collaboration with Amazon Web Services",
|
||||
"annualReport.toolsTranslate": "Translate",
|
||||
"annualReport.toolsTranslateIntro": "With the Translate extension, built on the Google Translate API, kids can incorporate automatic translation into their projects, supporting language learning and global communication.",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.1453 10.1207L12.021 14.2451C11.6821 14.5643 11.2066 14.6497 10.7981 14.4724C10.3896 14.2964 10.1374 13.9076 10.1374 13.457V11.8927L4.3974 11.0954C3.51867 10.9811 2.8501 10.2166 2.8501 9.31688C2.8501 9.23939 2.85535 9.16058 2.86455 9.08308C2.99196 8.27134 3.62506 7.6448 4.40397 7.54629L10.1374 6.72797V5.2319C10.1374 4.77612 10.4053 4.37024 10.8191 4.19818C11.2355 4.02611 11.6965 4.11937 12.021 4.4438L16.1453 8.56819C16.3489 8.77309 16.4619 9.04893 16.4619 9.34447C16.4619 9.64 16.3489 9.91584 16.1453 10.1207Z" fill="#9966ff"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 687 B |
Loading…
Reference in a new issue