mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-22 23:27:54 -05:00
Merge pull request #2449 from picklesrus/download-directly-version
New Download page
This commit is contained in:
commit
1ce8ef5b0d
12 changed files with 792 additions and 347 deletions
|
@ -238,6 +238,13 @@
|
|||
"view": "scratch_1.4/scratch_1.4",
|
||||
"title": "Scratch 1.4"
|
||||
},
|
||||
{
|
||||
"name": "scratch2",
|
||||
"pattern": "^/download/scratch2/?$",
|
||||
"routeAlias": "/download/scratch2",
|
||||
"view": "download/scratch2/download",
|
||||
"title": "Scratch 2.0"
|
||||
},
|
||||
{
|
||||
"name": "search",
|
||||
"pattern": "^/search/:projects/?$",
|
||||
|
|
|
@ -1,16 +1,17 @@
|
|||
const FormattedHTMLMessage = require('react-intl').FormattedHTMLMessage;
|
||||
const FormattedMessage = require('react-intl').FormattedMessage;
|
||||
const injectIntl = require('react-intl').injectIntl;
|
||||
const intlShape = require('react-intl').intlShape;
|
||||
const React = require('react');
|
||||
|
||||
const api = require('../../lib/api');
|
||||
const FlexRow = require('../../components/flex-row/flex-row.jsx');
|
||||
const SubNavigation = require('../../components/subnavigation/subnavigation.jsx');
|
||||
const TitleBanner = require('../../components/title-banner/title-banner.jsx');
|
||||
const bindAll = require('lodash.bindall');
|
||||
const Steps = require('../../components/steps/steps.jsx');
|
||||
const Step = require('../../components/steps/step.jsx');
|
||||
|
||||
const Page = require('../../components/page/www/page.jsx');
|
||||
const render = require('../../lib/render.jsx');
|
||||
const OS_ENUM = require('../../components/extension-landing/os-enum.js');
|
||||
const OSChooser = require('../../components/os-chooser/os-chooser.jsx');
|
||||
|
||||
require('./download.scss');
|
||||
require('../../components/forms/button.scss');
|
||||
|
@ -18,246 +19,219 @@ require('../../components/forms/button.scss');
|
|||
class Download extends React.Component {
|
||||
constructor (props) {
|
||||
super(props);
|
||||
bindAll(this, [
|
||||
'onSetOS'
|
||||
]);
|
||||
let detectedOS = OS_ENUM.WINDOWS;
|
||||
if (window.navigator && window.navigator.platform) {
|
||||
if (window.navigator.platform === 'MacIntel') {
|
||||
detectedOS = OS_ENUM.MACOS;
|
||||
}
|
||||
}
|
||||
|
||||
this.state = {
|
||||
swfVersion: ''
|
||||
OS: detectedOS
|
||||
};
|
||||
}
|
||||
componentDidMount () {
|
||||
let uri = '/scratchr2/static/sa/version.xml';
|
||||
if (this.props.intl.locale === 'pt-br') {
|
||||
uri = '/scratchr2/static/sa/pt-br/version.xml';
|
||||
}
|
||||
|
||||
api({
|
||||
host: '',
|
||||
uri: uri,
|
||||
responseType: 'string'
|
||||
}, (err, body, res) => {
|
||||
if (err || res.statusCode >= 400) {
|
||||
return this.setState({
|
||||
swfVersion: -1
|
||||
});
|
||||
}
|
||||
|
||||
const doc = new DOMParser().parseFromString(body, 'text/xml');
|
||||
return this.setState({
|
||||
swfVersion: doc.getElementsByTagName('versionNumber')[0].childNodes[0].nodeValue
|
||||
});
|
||||
onSetOS (os) {
|
||||
this.setState({
|
||||
OS: os
|
||||
});
|
||||
}
|
||||
render () {
|
||||
let downloadPath = '/scratchr2/static/sa/Scratch-';
|
||||
let downloadUrls = null;
|
||||
if (this.props.intl.locale === 'pt-br') {
|
||||
downloadPath = '/scratchr2/static/sa/pt-br/Scratch-';
|
||||
}
|
||||
if (this.state.swfVersion.length > 0 && this.state.swfVersion !== -1) {
|
||||
downloadUrls = {
|
||||
mac: `${downloadPath}${this.state.swfVersion}.dmg`,
|
||||
mac105: `${downloadPath}${this.state.swfVersion}.air`,
|
||||
windows: `${downloadPath}${this.state.swfVersion}.exe`
|
||||
};
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="download">
|
||||
<TitleBanner className="masthead">
|
||||
<div className="inner">
|
||||
<h1 className="title-banner-h1">
|
||||
<FormattedMessage id="download.title" />
|
||||
</h1>
|
||||
<p className="title-banner-p intro">
|
||||
<FormattedMessage id="download.intro" />
|
||||
</p>
|
||||
</div>
|
||||
<div className="band">
|
||||
<SubNavigation className="inner">
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#installation"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.installation" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#updates"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.updatesTitle" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#other"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.otherVersionsTitle" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#issues"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.knownIssuesTitle" />
|
||||
</li>
|
||||
</a>
|
||||
</SubNavigation>
|
||||
</div>
|
||||
</TitleBanner>
|
||||
<div className="download-content">
|
||||
<section
|
||||
className="installation"
|
||||
id="installation"
|
||||
>
|
||||
<div className="inner">
|
||||
<p className="callout">
|
||||
<FormattedHTMLMessage id="download.introMac" />
|
||||
</p>
|
||||
<FlexRow className="three-col-row">
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'1'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.airTitle" /></h3>
|
||||
<p><FormattedHTMLMessage id="download.airBody" /></p>
|
||||
<ul className="installation-downloads">
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOSX" /> -
|
||||
{' '}<a href="http://get.adobe.com/air/">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOlder" /> -
|
||||
{' '}<a href="http://airdownload.adobe.com/air/mac/download/2.6/AdobeAIR.zip">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.windows" /> -
|
||||
{' '}<a href="http://get.adobe.com/air/">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'2'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.offlineEditorTitle" /></h3>
|
||||
<p><FormattedMessage id="download.offlineEditorBody" /></p>
|
||||
{downloadUrls === null ? [] : [
|
||||
<ul
|
||||
className="installation-downloads"
|
||||
key="installation-downloads"
|
||||
>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOSX" /> -
|
||||
{' '}<a href={downloadUrls.mac}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOlder" /> -
|
||||
{' '}<a href={downloadUrls.mac105}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.windows" /> -
|
||||
{' '}<a href={downloadUrls.windows}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
]}
|
||||
{this.state.swfVersion === -1 ? [
|
||||
<p key="not-available">
|
||||
<i><FormattedMessage id="download.notAvailable" /></i>
|
||||
</p>
|
||||
] : []}
|
||||
</div>
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'3'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.supportMaterialsTitle" /></h3>
|
||||
<p><FormattedMessage id="download.supportMaterialsBody" /></p>
|
||||
<ul className="installation-downloads">
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.starterProjects" /> -
|
||||
{' '}<a href="https://scratch.mit.edu/scratchr2/static/sa/Scratch2StarterProjects.zip">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.gettingStarted" /> -
|
||||
{' '}<a href="https://cdn.scratch.mit.edu/scratchr2/static/__709da8e5f3d72129538a4ccdbcbf5f2a__/pdfs/help/Getting-Started-Guide-Scratch2.pdf">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.scratchCards" /> -
|
||||
{' '}<a href="https://cdn.scratch.mit.edu/scratchr2/static/__709da8e5f3d72129538a4ccdbcbf5f2a__/pdfs/help/Scratch2Cards.pdf">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</FlexRow>
|
||||
</div>
|
||||
</section>
|
||||
<div className="inner">
|
||||
<section id="updates">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.updatesTitle" /></h2>
|
||||
<p><FormattedMessage id="download.updatesBody" /></p>
|
||||
{this.state.swfVersion === -1 ? [] : [
|
||||
<p key="current-version">
|
||||
<FormattedMessage
|
||||
id="download.currentVersion"
|
||||
values={{
|
||||
version: this.state.swfVersion
|
||||
}}
|
||||
<div className="download-header">
|
||||
<FlexRow className="inner">
|
||||
<FlexRow className="column download-info">
|
||||
<FlexRow className="column download-copy">
|
||||
<h1 className="download-title">
|
||||
<img
|
||||
alt={this.props.intl.formatMessage({id: 'download.iconAltText'})}
|
||||
className="icon"
|
||||
height="40"
|
||||
src="/images/download/placeholder.png"
|
||||
width="40"
|
||||
/>
|
||||
</p>
|
||||
]}
|
||||
</section>
|
||||
<FormattedMessage id="download.title" />
|
||||
</h1>
|
||||
<span className="download-description">
|
||||
<FormattedMessage id="download.intro" />
|
||||
</span>
|
||||
</FlexRow>
|
||||
<FlexRow className="column download-requirements-container">
|
||||
<span className="requirements-header">
|
||||
<FormattedMessage id="download.requirements" />
|
||||
</span>
|
||||
<FlexRow className="download-requirements">
|
||||
<span>
|
||||
<img
|
||||
alt=""
|
||||
src="/svgs/extensions/windows.svg"
|
||||
/>
|
||||
Windows 10+
|
||||
</span>
|
||||
<span>
|
||||
<img
|
||||
alt=""
|
||||
src="svgs/extensions/mac.svg"
|
||||
/>
|
||||
macOS 10.13+
|
||||
</span>
|
||||
</FlexRow>
|
||||
</FlexRow>
|
||||
</FlexRow>
|
||||
<div className="download-image">
|
||||
<img
|
||||
alt={this.props.intl.formatMessage({id: 'download.imgAltDownloadIllustration'})}
|
||||
src="/images/download/download.png"
|
||||
/>
|
||||
</div>
|
||||
</FlexRow>
|
||||
</div>
|
||||
<OSChooser
|
||||
currentOS={this.state.OS}
|
||||
handleSetOS={this.onSetOS}
|
||||
/>
|
||||
<div className="blue install-scratch">
|
||||
<FlexRow className="inner column">
|
||||
<h2 className="title">
|
||||
<FormattedMessage id="download.installHeaderTitle" />
|
||||
</h2>
|
||||
<Steps>
|
||||
<div className="step">
|
||||
<Step
|
||||
compact
|
||||
number={1}
|
||||
>
|
||||
<span className="step-description">
|
||||
<FormattedMessage id="download.downloadAndInstall" />
|
||||
</span>
|
||||
<div className="downloads-container">
|
||||
<a
|
||||
className="download-button"
|
||||
href="https://beta.scratch.mit.edu/"
|
||||
>
|
||||
<span>Download Scratch Desktop</span>
|
||||
</a>
|
||||
</div>
|
||||
</Step>
|
||||
|
||||
<section id="other">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.otherVersionsTitle" /></h2>
|
||||
<p><FormattedHTMLMessage id="download.otherVersionsOlder" /></p>
|
||||
<p><FormattedHTMLMessage id="download.otherVersionsAdmin" /></p>
|
||||
</section>
|
||||
|
||||
<section id="issues">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.knownIssuesTitle" /></h2>
|
||||
<p><FormattedMessage id="download.knownIssuesOne" /></p>
|
||||
<p><FormattedMessage id="download.knownIssuesTwo" /></p>
|
||||
<p><FormattedHTMLMessage id="download.knownIssuesThree" /></p>
|
||||
<p><FormattedMessage id="download.knownIssuesFour" /></p>
|
||||
<a
|
||||
className="button mod-link"
|
||||
href="https://scratch.mit.edu/discuss/3/"
|
||||
</div>
|
||||
<Step
|
||||
compact
|
||||
number={2}
|
||||
>
|
||||
<FormattedMessage id="download.reportBugs" />
|
||||
</a>
|
||||
</section>
|
||||
</div>
|
||||
<span className="step-description">
|
||||
{this.state.OS === OS_ENUM.WINDOWS ?
|
||||
<FormattedMessage id="download.winMoveToApplications" /> :
|
||||
<FormattedMessage id="download.macMoveToApplications" />
|
||||
}
|
||||
</span>
|
||||
|
||||
<div className="step-image">
|
||||
<img
|
||||
alt=""
|
||||
className="screenshot"
|
||||
src={`/images/scratchlink/${
|
||||
this.state.OS === OS_ENUM.WINDOWS ? 'windows' : 'mac'
|
||||
}-toolbar.png`}
|
||||
/>
|
||||
</div>
|
||||
</Step>
|
||||
</Steps>
|
||||
</FlexRow>
|
||||
</div>
|
||||
<div className="download-section faq">
|
||||
<FlexRow className="inner column">
|
||||
<h2 className="title">
|
||||
<FormattedMessage id="download.troubleshootingTitle" />
|
||||
</h2>
|
||||
|
||||
<h3 className="faq-question">
|
||||
<FormattedMessage id="download.whenSupportLinux" />
|
||||
</h3>
|
||||
<p>
|
||||
<FormattedMessage id="download.supportLinuxAnswer" />
|
||||
</p>
|
||||
|
||||
<h3 className="faq-question">
|
||||
<FormattedMessage id="download.supportChromeOS" />
|
||||
</h3>
|
||||
<p>
|
||||
<FormattedMessage id="download.supportChromeOSAnswer" />
|
||||
</p>
|
||||
|
||||
</FlexRow>
|
||||
</div>
|
||||
<div className="download-section blue">
|
||||
<FlexRow className="inner column">
|
||||
<h2 className="title">
|
||||
<FormattedMessage id="download.olderVersionsTitle" />
|
||||
</h2>
|
||||
<h3 className="faq-question">
|
||||
<FormattedMessage id="download.olderVersions" />
|
||||
</h3>
|
||||
<FlexRow>
|
||||
<div className="older-version">
|
||||
<a href="/download/scratch2">
|
||||
<img
|
||||
alt=""
|
||||
className="screenshot"
|
||||
height="106"
|
||||
src="/images/download/scratch2.png"
|
||||
width="150"
|
||||
/>
|
||||
</a>
|
||||
<p>
|
||||
<a
|
||||
className="legacy-link"
|
||||
href="/download/scratch2"
|
||||
>
|
||||
<FormattedMessage id="download.scratch2Desktop" />
|
||||
<img
|
||||
className="little-arrow"
|
||||
src="/svgs/download/r-arrow.svg"
|
||||
/>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div className="older-version">
|
||||
<a href="/scratch_1.4">
|
||||
<img
|
||||
alt=""
|
||||
className="screenshot"
|
||||
height="106"
|
||||
src="/images/download/scratch1-4.png"
|
||||
width="150"
|
||||
/>
|
||||
</a>
|
||||
<p>
|
||||
<a
|
||||
className="legacy-link"
|
||||
href="/scratch_1.4"
|
||||
>
|
||||
<FormattedMessage id="download.scratch1-4Desktop" />
|
||||
<img
|
||||
className="little-arrow"
|
||||
src="/svgs/download/r-arrow.svg"
|
||||
/>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</FlexRow>
|
||||
</FlexRow>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
Download.propTypes = {
|
||||
intl: intlShape
|
||||
|
||||
};
|
||||
|
||||
const WrappedDownload = injectIntl(Download);
|
||||
|
|
|
@ -6,123 +6,168 @@
|
|||
}
|
||||
|
||||
.download {
|
||||
.title-banner {
|
||||
&.masthead {
|
||||
margin-bottom: 0;
|
||||
background-color: $ui-blue-dark;
|
||||
padding-bottom: 0;
|
||||
.title {
|
||||
margin-bottom: 1rem;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0 0 2rem 0;
|
||||
text-align: left;
|
||||
color: $ui-white;
|
||||
}
|
||||
.legacy-link {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
color: $ui-white;
|
||||
.download-button {
|
||||
display: inline-block;
|
||||
margin: .5em 0;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
background-color: $ui-blue;
|
||||
cursor: pointer;
|
||||
padding: 1rem;
|
||||
color: $ui-white;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a {
|
||||
border-bottom: 1px solid $ui-white;
|
||||
.download-header {
|
||||
background-color: $ui-blue;
|
||||
padding: 4rem 0;
|
||||
color: $ui-white;
|
||||
|
||||
|
||||
.title {
|
||||
color: $ui-white;
|
||||
}
|
||||
|
||||
.inner {
|
||||
justify-content: space-between;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.download-info {
|
||||
padding-right: $cols1;
|
||||
max-width: $cols6 + ($gutter / $em);
|
||||
align-items: flex-start;
|
||||
|
||||
.download-copy {
|
||||
margin-bottom: 5rem;
|
||||
align-items: flex-start;
|
||||
|
||||
.download-title {
|
||||
display: flex;
|
||||
margin-bottom: 2rem;
|
||||
color: $ui-white;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.icon {
|
||||
padding-right: .5rem;
|
||||
max-height: 100%;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.download-description {
|
||||
line-height: 1.7rem;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.band {
|
||||
margin-top: 2rem;
|
||||
background-color: $ui-white-15percent;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
.download-requirements-container {
|
||||
font-weight: 500;
|
||||
align-items: flex-start;
|
||||
|
||||
.sub-nav {
|
||||
text-align: left;
|
||||
justify-content: flex-start;
|
||||
|
||||
li {
|
||||
margin: 0 .5rem 0 0;
|
||||
.requirements-header {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.download-requirements {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.download-requirements span {
|
||||
display: flex;
|
||||
margin-right: 1rem;
|
||||
font-size: 15px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.download-requirements span img {
|
||||
padding-right: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.download-image {
|
||||
width: 100%;
|
||||
max-width: $cols6;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-nav-item {
|
||||
margin: .5rem;
|
||||
.install-scratch {
|
||||
padding: 2rem 0;
|
||||
|
||||
.inner {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.downloads-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.store-badge {
|
||||
display: block;
|
||||
width: 150px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.callout {
|
||||
text-align: center;
|
||||
.download-section {
|
||||
padding: 4rem 0;
|
||||
|
||||
.inner {
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.download-content {
|
||||
padding-bottom: 2rem;
|
||||
.blue {
|
||||
background-color: $ui-blue-10percent;
|
||||
}
|
||||
|
||||
.three-col-row {
|
||||
align-items: flex-start;
|
||||
.faq {
|
||||
p {
|
||||
margin-bottom: 1.25rem;
|
||||
margin-left: 0;
|
||||
max-width: $cols8;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.faq-question {
|
||||
margin-bottom: 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.installation {
|
||||
background-color: $ui-gray;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.installation-column {
|
||||
max-width: $cols4;
|
||||
text-align: center;
|
||||
.older-version {
|
||||
padding-right: 24px;
|
||||
|
||||
p {
|
||||
margin-right: .5rem;
|
||||
margin-left: .5rem;
|
||||
line-height: normal;
|
||||
color: $link-blue;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.installation-column-number {
|
||||
margin: 2rem auto;
|
||||
border: 2px solid $active-gray;
|
||||
border-radius: 2rem;
|
||||
background-color: $ui-blue;
|
||||
width: 3.75rem;
|
||||
height: 3.75rem;
|
||||
}
|
||||
|
||||
.installation-column-number-text {
|
||||
text-align: center;
|
||||
line-height: 1.8em;
|
||||
color: $type-white;
|
||||
}
|
||||
|
||||
.installation-downloads {
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.installation-downloads-item {
|
||||
margin: .25rem;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.mod-link {
|
||||
color: $ui-white;
|
||||
}
|
||||
|
||||
@media #{$small} {
|
||||
.inner {
|
||||
.installation-column {
|
||||
max-width: 100%;
|
||||
}
|
||||
.little-arrow {
|
||||
padding-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$intermediate-and-smaller} {
|
||||
.three-col-row {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.screenshot {
|
||||
margin-top: 1rem;
|
||||
$img-border: rgba(0, 0, 0, .05);
|
||||
border: 2px solid $img-border;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,32 +1,25 @@
|
|||
{
|
||||
"download.title": "Scratch 2.0 Offline Editor",
|
||||
"download.intro": "You can install the Scratch 2.0 editor to work on projects without an internet connection. This version will work on Windows and MacOS.",
|
||||
"download.introMac": "<b>Note for Mac Users:</b> the latest version of Scratch 2.0 Offline requires Adobe AIR 20. To upgrade to Adobe AIR 20 manually, go <a href=\"https://get.adobe.com/air/\">here</a>.",
|
||||
"download.installation": "Installation",
|
||||
"download.airTitle": "Adobe AIR",
|
||||
"download.airBody": "If you don't already have it, download and install the latest <a href=\"http://get.adobe.com/air/\">Adobe AIR</a>",
|
||||
"download.macOSX": "Mac OS X",
|
||||
"download.macOlder": "Mac OS 10.5 & Older",
|
||||
"download.windows": "Windows",
|
||||
"download.download": "Download",
|
||||
"download.offlineEditorTitle": "Scratch Offline Editor",
|
||||
"download.offlineEditorBody": "Next download and install the Scratch 2.0 Offline Editor",
|
||||
"download.supportMaterialsTitle": "Support Materials",
|
||||
"download.supportMaterialsBody": "Need some help getting started? Here are some helpful resources.",
|
||||
"download.starterProjects": "Starter Projects",
|
||||
"download.gettingStarted": "Getting Started Guide",
|
||||
"download.scratchCards": "Scratch Cards",
|
||||
"download.updatesTitle": "Updates",
|
||||
"download.updatesBody": "The Offline Editor can update itself (with user permission). It will check for updates at startup or you can use the \"Check for updates\" command in the file menu.",
|
||||
"download.currentVersion": "The current version is {version}.",
|
||||
"download.otherVersionsTitle": "Other Versions of Scratch",
|
||||
"download.otherVersionsOlder": "If you have an older computer, or cannot install the Scratch 2.0 offline editor, you can try installing <a href=\"http://scratch.mit.edu/scratch_1.4/\">Scratch 1.4</a>.",
|
||||
"download.otherVersionsAdmin": "If you are a network administrator: a Scratch 2.0 MSI has been created and maintained by a member of the community and hosted for public download <a href=\"http://llk.github.io/scratch-msi/\">here</a>.",
|
||||
"download.knownIssuesTitle": "Known issues",
|
||||
"download.knownIssuesOne": "If your offline editor is crashing directly after Scratch is opened, install the Scratch 2 offline editor again (see step 2 above). This issue is due to a bug introduced in Adobe AIR version 14 (released April 2014).",
|
||||
"download.knownIssuesTwo": "Graphic effects blocks (in \"Looks\") may slow down projects due to a known Flash bug.",
|
||||
"download.knownIssuesThree": "The <b>backpack</b> is not yet available.",
|
||||
"download.knownIssuesFour": "On Mac OS you may see a prompt indicating that \"Scratch 2 is trying to install a new helper tool\" and asking for your user name and password. We are currently investigating a solution to this problem.",
|
||||
"download.reportBugs": "Report Bugs and Glitches",
|
||||
"download.notAvailable": "Hmm, editor downloads are not available right now - please refresh the page to try again."
|
||||
"download.title": "Scratch 3.0 Desktop",
|
||||
"download.intro": "You can install the Scratch 3.0 editor to work on projects without an internet connection. This version will work on Windows and MacOS.",
|
||||
"download.requirements": "Requirements",
|
||||
"download.imgAltDownloadIllustration" : "Scratch 3.0 Desktop screenshot",
|
||||
"download.installHeaderTitle": "Install Scratch Desktop",
|
||||
"download.downloadAndInstall": "Download and install Scratch Desktop",
|
||||
"download.troubleshootingTitle": "FAQ",
|
||||
"download.startScratchDesktop": "Start Scratch Desktop",
|
||||
"download.howDoIInstall": "How do I install Scratch Desktop?",
|
||||
"download.whenSupportLinux": "When will you have Scratch Desktop for Linux?",
|
||||
"download.supportLinuxAnswer" : "Scratch Desktop on Linux is currently not supported. We are working with partners and the open-source community to determine if there is a way we can support Linux in the future. Stay tuned!",
|
||||
"download.supportChromeOS" : "When will you have Scratch Desktop for ChromeOS?",
|
||||
"download.supportChromeOSAnswer": "Scratch Desktop for ChromeOS is not yet available. We are working on it and expect to release later in 2019.",
|
||||
"download.olderVersionsTitle" : "Older Versions",
|
||||
"download.olderVersions": "Looking for an older version of Scratch Desktop?",
|
||||
"download.scratch1-4Desktop" : "Scratch 1.4 Desktop",
|
||||
"download.scratch2Desktop" : "Scratch 2.0 Desktop",
|
||||
"download.cannotAccessMacStore" : "What if I can't access the Mac App Store?",
|
||||
"download.cannotAccessWindowsStore" : "What if I can't access the Microsoft Store?",
|
||||
"download.appstoreAccessAnswer" : "You can download Scratch Desktop directly to your computer by {directDownloadLink}.",
|
||||
"download.directDownloadText" : "clicking here",
|
||||
"download.macMoveToApplications" : "Move Scratch Desktop to your Applications folder and start Scratch Desktop.",
|
||||
"download.winMoveToApplications" : "Run it."
|
||||
}
|
||||
|
|
265
src/views/download/scratch2/download.jsx
Normal file
265
src/views/download/scratch2/download.jsx
Normal file
|
@ -0,0 +1,265 @@
|
|||
const FormattedHTMLMessage = require('react-intl').FormattedHTMLMessage;
|
||||
const FormattedMessage = require('react-intl').FormattedMessage;
|
||||
const injectIntl = require('react-intl').injectIntl;
|
||||
const intlShape = require('react-intl').intlShape;
|
||||
const React = require('react');
|
||||
|
||||
const api = require('../../../lib/api');
|
||||
const FlexRow = require('../../../components/flex-row/flex-row.jsx');
|
||||
const SubNavigation = require('../../../components/subnavigation/subnavigation.jsx');
|
||||
const TitleBanner = require('../../../components/title-banner/title-banner.jsx');
|
||||
|
||||
const Page = require('../../../components/page/www/page.jsx');
|
||||
const render = require('../../../lib/render.jsx');
|
||||
|
||||
require('./download.scss');
|
||||
require('../../../components/forms/button.scss');
|
||||
|
||||
class Download extends React.Component {
|
||||
constructor (props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
swfVersion: ''
|
||||
};
|
||||
}
|
||||
componentDidMount () {
|
||||
let uri = '/scratchr2/static/sa/version.xml';
|
||||
if (this.props.intl.locale === 'pt-br') {
|
||||
uri = '/scratchr2/static/sa/pt-br/version.xml';
|
||||
}
|
||||
|
||||
api({
|
||||
host: '',
|
||||
uri: uri,
|
||||
responseType: 'string'
|
||||
}, (err, body, res) => {
|
||||
if (err || res.statusCode >= 400) {
|
||||
return this.setState({
|
||||
swfVersion: -1
|
||||
});
|
||||
}
|
||||
|
||||
const doc = new DOMParser().parseFromString(body, 'text/xml');
|
||||
return this.setState({
|
||||
swfVersion: doc.getElementsByTagName('versionNumber')[0].childNodes[0].nodeValue
|
||||
});
|
||||
});
|
||||
}
|
||||
render () {
|
||||
let downloadPath = '/scratchr2/static/sa/Scratch-';
|
||||
let downloadUrls = null;
|
||||
if (this.props.intl.locale === 'pt-br') {
|
||||
downloadPath = '/scratchr2/static/sa/pt-br/Scratch-';
|
||||
}
|
||||
if (this.state.swfVersion.length > 0 && this.state.swfVersion !== -1) {
|
||||
downloadUrls = {
|
||||
mac: `${downloadPath}${this.state.swfVersion}.dmg`,
|
||||
mac105: `${downloadPath}${this.state.swfVersion}.air`,
|
||||
windows: `${downloadPath}${this.state.swfVersion}.exe`
|
||||
};
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="download">
|
||||
<TitleBanner className="masthead">
|
||||
<div className="inner">
|
||||
<h1 className="title-banner-h1">
|
||||
<FormattedMessage id="download.title" />
|
||||
</h1>
|
||||
<p className="title-banner-p intro">
|
||||
<FormattedMessage id="download.intro" />
|
||||
</p>
|
||||
</div>
|
||||
<div className="band">
|
||||
<SubNavigation className="inner">
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#installation"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.installation" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#updates"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.updatesTitle" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#other"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.otherVersionsTitle" />
|
||||
</li>
|
||||
</a>
|
||||
<a
|
||||
className="sub-nav-item"
|
||||
href="#issues"
|
||||
>
|
||||
<li>
|
||||
<FormattedMessage id="download.knownIssuesTitle" />
|
||||
</li>
|
||||
</a>
|
||||
</SubNavigation>
|
||||
</div>
|
||||
</TitleBanner>
|
||||
<div className="download-content">
|
||||
<section
|
||||
className="installation"
|
||||
id="installation"
|
||||
>
|
||||
<div className="inner">
|
||||
<p className="callout">
|
||||
<FormattedHTMLMessage id="download.introMac" />
|
||||
</p>
|
||||
<FlexRow className="three-col-row">
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'1'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.airTitle" /></h3>
|
||||
<p><FormattedHTMLMessage id="download.airBody" /></p>
|
||||
<ul className="installation-downloads">
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOSX" /> -
|
||||
{' '}<a href="http://get.adobe.com/air/">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOlder" /> -
|
||||
{' '}<a href="http://airdownload.adobe.com/air/mac/download/2.6/AdobeAIR.zip">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.windows" /> -
|
||||
{' '}<a href="http://get.adobe.com/air/">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'2'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.offlineEditorTitle" /></h3>
|
||||
<p><FormattedMessage id="download.offlineEditorBody" /></p>
|
||||
{downloadUrls === null ? [] : [
|
||||
<ul
|
||||
className="installation-downloads"
|
||||
key="installation-downloads"
|
||||
>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOSX" /> -
|
||||
{' '}<a href={downloadUrls.mac}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.macOlder" /> -
|
||||
{' '}<a href={downloadUrls.mac105}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.windows" /> -
|
||||
{' '}<a href={downloadUrls.windows}>
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
]}
|
||||
{this.state.swfVersion === -1 ? [
|
||||
<p key="not-available">
|
||||
<i><FormattedMessage id="download.notAvailable" /></i>
|
||||
</p>
|
||||
] : []}
|
||||
</div>
|
||||
<div className="installation-column">
|
||||
<div className="installation-column-number">
|
||||
<h2 className="installation-column-number-text">{'3'}</h2>
|
||||
</div>
|
||||
<h3><FormattedMessage id="download.supportMaterialsTitle" /></h3>
|
||||
<p><FormattedMessage id="download.supportMaterialsBody" /></p>
|
||||
<ul className="installation-downloads">
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.starterProjects" /> -
|
||||
{' '}<a href="https://scratch.mit.edu/scratchr2/static/sa/Scratch2StarterProjects.zip">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.gettingStarted" /> -
|
||||
{' '}<a href="https://cdn.scratch.mit.edu/scratchr2/static/__709da8e5f3d72129538a4ccdbcbf5f2a__/pdfs/help/Getting-Started-Guide-Scratch2.pdf">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
<li className="installation-downloads-item">
|
||||
<FormattedMessage id="download.scratchCards" /> -
|
||||
{' '}<a href="https://cdn.scratch.mit.edu/scratchr2/static/__709da8e5f3d72129538a4ccdbcbf5f2a__/pdfs/help/Scratch2Cards.pdf">
|
||||
<FormattedMessage id="download.download" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</FlexRow>
|
||||
</div>
|
||||
</section>
|
||||
<div className="inner">
|
||||
<section id="updates">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.updatesTitle" /></h2>
|
||||
<p><FormattedMessage id="download.updatesBody" /></p>
|
||||
{this.state.swfVersion === -1 ? [] : [
|
||||
<p key="current-version">
|
||||
<FormattedMessage
|
||||
id="download.currentVersion"
|
||||
values={{
|
||||
version: this.state.swfVersion
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
]}
|
||||
</section>
|
||||
|
||||
<section id="other">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.otherVersionsTitle" /></h2>
|
||||
<p><FormattedHTMLMessage id="download.otherVersionsOlder" /></p>
|
||||
<p><FormattedHTMLMessage id="download.otherVersionsAdmin" /></p>
|
||||
</section>
|
||||
|
||||
<section id="issues">
|
||||
<span className="nav-spacer" />
|
||||
<h2><FormattedMessage id="download.knownIssuesTitle" /></h2>
|
||||
<p><FormattedMessage id="download.knownIssuesOne" /></p>
|
||||
<p><FormattedMessage id="download.knownIssuesTwo" /></p>
|
||||
<p><FormattedHTMLMessage id="download.knownIssuesThree" /></p>
|
||||
<p><FormattedMessage id="download.knownIssuesFour" /></p>
|
||||
<a
|
||||
className="button mod-link"
|
||||
href="https://scratch.mit.edu/discuss/3/"
|
||||
>
|
||||
<FormattedMessage id="download.reportBugs" />
|
||||
</a>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Download.propTypes = {
|
||||
intl: intlShape
|
||||
};
|
||||
|
||||
const WrappedDownload = injectIntl(Download);
|
||||
|
||||
render(<Page><WrappedDownload /></Page>, document.getElementById('app'));
|
128
src/views/download/scratch2/download.scss
Normal file
128
src/views/download/scratch2/download.scss
Normal file
|
@ -0,0 +1,128 @@
|
|||
@import "../../../colors";
|
||||
@import "../../../frameless";
|
||||
|
||||
#view {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.download {
|
||||
.title-banner {
|
||||
&.masthead {
|
||||
margin-bottom: 0;
|
||||
background-color: $ui-blue-dark;
|
||||
padding-bottom: 0;
|
||||
|
||||
h1 {
|
||||
margin: 0 0 2rem 0;
|
||||
text-align: left;
|
||||
color: $ui-white;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
color: $ui-white;
|
||||
|
||||
a {
|
||||
border-bottom: 1px solid $ui-white;
|
||||
color: $ui-white;
|
||||
}
|
||||
}
|
||||
|
||||
.band {
|
||||
margin-top: 2rem;
|
||||
background-color: $ui-white-15percent;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.sub-nav {
|
||||
text-align: left;
|
||||
justify-content: flex-start;
|
||||
|
||||
li {
|
||||
margin: 0 .5rem 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-nav-item {
|
||||
margin: .5rem;
|
||||
}
|
||||
|
||||
.callout {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.download-content {
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.three-col-row {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.installation {
|
||||
background-color: $ui-gray;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.installation-column {
|
||||
max-width: $cols4;
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
margin-right: .5rem;
|
||||
margin-left: .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.installation-column-number {
|
||||
margin: 2rem auto;
|
||||
border: 2px solid $active-gray;
|
||||
border-radius: 2rem;
|
||||
background-color: $ui-blue;
|
||||
width: 3.75rem;
|
||||
height: 3.75rem;
|
||||
}
|
||||
|
||||
.installation-column-number-text {
|
||||
text-align: center;
|
||||
line-height: 1.8em;
|
||||
color: $type-white;
|
||||
}
|
||||
|
||||
.installation-downloads {
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.installation-downloads-item {
|
||||
margin: .25rem;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.mod-link {
|
||||
color: $ui-white;
|
||||
}
|
||||
|
||||
@media #{$small} {
|
||||
.inner {
|
||||
.installation-column {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$intermediate-and-smaller} {
|
||||
.three-col-row {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
32
src/views/download/scratch2/l10n.json
Normal file
32
src/views/download/scratch2/l10n.json
Normal file
|
@ -0,0 +1,32 @@
|
|||
{
|
||||
"download.title": "Scratch 2.0 Offline Editor",
|
||||
"download.intro": "You can install the Scratch 2.0 editor to work on projects without an internet connection. This version will work on Windows and MacOS.",
|
||||
"download.introMac": "<b>Note for Mac Users:</b> the latest version of Scratch 2.0 Offline requires Adobe AIR 20. To upgrade to Adobe AIR 20 manually, go <a href=\"https://get.adobe.com/air/\">here</a>.",
|
||||
"download.installation": "Installation",
|
||||
"download.airTitle": "Adobe AIR",
|
||||
"download.airBody": "If you don't already have it, download and install the latest <a href=\"http://get.adobe.com/air/\">Adobe AIR</a>",
|
||||
"download.macOSX": "Mac OS X",
|
||||
"download.macOlder": "Mac OS 10.5 & Older",
|
||||
"download.windows": "Windows",
|
||||
"download.download": "Download",
|
||||
"download.offlineEditorTitle": "Scratch Offline Editor",
|
||||
"download.offlineEditorBody": "Next download and install the Scratch 2.0 Offline Editor",
|
||||
"download.supportMaterialsTitle": "Support Materials",
|
||||
"download.supportMaterialsBody": "Need some help getting started? Here are some helpful resources.",
|
||||
"download.starterProjects": "Starter Projects",
|
||||
"download.gettingStarted": "Getting Started Guide",
|
||||
"download.scratchCards": "Scratch Cards",
|
||||
"download.updatesTitle": "Updates",
|
||||
"download.updatesBody": "The Offline Editor can update itself (with user permission). It will check for updates at startup or you can use the \"Check for updates\" command in the file menu.",
|
||||
"download.currentVersion": "The current version is {version}.",
|
||||
"download.otherVersionsTitle": "Other Versions of Scratch",
|
||||
"download.otherVersionsOlder": "If you have an older computer, or cannot install the Scratch 2.0 offline editor, you can try installing <a href=\"http://scratch.mit.edu/scratch_1.4/\">Scratch 1.4</a>.",
|
||||
"download.otherVersionsAdmin": "If you are a network administrator: a Scratch 2.0 MSI has been created and maintained by a member of the community and hosted for public download <a href=\"http://llk.github.io/scratch-msi/\">here</a>.",
|
||||
"download.knownIssuesTitle": "Known issues",
|
||||
"download.knownIssuesOne": "If your offline editor is crashing directly after Scratch is opened, install the Scratch 2 offline editor again (see step 2 above). This issue is due to a bug introduced in Adobe AIR version 14 (released April 2014).",
|
||||
"download.knownIssuesTwo": "Graphic effects blocks (in \"Looks\") may slow down projects due to a known Flash bug.",
|
||||
"download.knownIssuesThree": "The <b>backpack</b> is not yet available.",
|
||||
"download.knownIssuesFour": "On Mac OS you may see a prompt indicating that \"Scratch 2 is trying to install a new helper tool\" and asking for your user name and password. We are currently investigating a solution to this problem.",
|
||||
"download.reportBugs": "Report Bugs and Glitches",
|
||||
"download.notAvailable": "Hmm, editor downloads are not available right now - please refresh the page to try again."
|
||||
}
|
BIN
static/images/download/download.png
Normal file
BIN
static/images/download/download.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
BIN
static/images/download/placeholder.png
Normal file
BIN
static/images/download/placeholder.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 6.7 KiB |
BIN
static/images/download/scratch1-4.png
Normal file
BIN
static/images/download/scratch1-4.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 82 KiB |
BIN
static/images/download/scratch2.png
Normal file
BIN
static/images/download/scratch2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 107 KiB |
1
static/svgs/download/r-arrow.svg
Normal file
1
static/svgs/download/r-arrow.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M10.158 16.994c-.311 0-.602-.119-.818-.333L5 12.319a1.182 1.182 0 0 1-.24-1.287c.186-.43.595-.695 1.07-.695h1.646l.84-6.042a1.887 1.887 0 0 1 2.118-1.614c.854.134 1.514.8 1.617 1.62l.862 6.036h1.575c.48 0 .907.282 1.088.717.18.439.083.924-.259 1.265l-4.341 4.342a1.151 1.151 0 0 1-.817.333" id="a"/></defs><use fill="#4C97FF" transform="rotate(-90 10.164 9.83)" xlink:href="#a" fill-rule="evenodd"/></svg>
|
After Width: | Height: | Size: 526 B |
Loading…
Reference in a new issue