scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 07:38:07 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Fix up some stuff to better match the spec

Browse source
This commit is contained in:
picklesrus 2018-12-12 12:01:15 -05:00
parent c3dde0c9eb
commit dc24ab193d
3 changed files with 43 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
src/views/download/download.jsx
View file

@ -176,38 +176,48 @@ class Download extends React.Component {
</h3> </h3>
<FlexRow> <FlexRow>
<div className="older-version"> <div className="older-version">
<img <a href="/download/scratch2">
alt="" <img
className="screenshot" alt=""
height="106" className="screenshot"
src="/images/download/scratch1-4.png" height="106"
width="150" src="/images/download/scratch2.png"
/> width="150"
<p> />
<a </a>
className="centered"
href="/scratch_1.4"
>
<FormattedMessage id="download.scratch1-4Desktop" />
<img src="/svgs/download/r-arrow.svg" />
</a>
</p>
</div>
<div className="older-version">
<img
alt=""
className="screenshot"
height="106"
src="/images/download/scratch2.png"
width="150"
/>
<p> <p>
<a <a
className="centered" className="centered"
href="/download/scratch2" href="/download/scratch2"
> >
<FormattedMessage id="download.scratch2Desktop" /> <FormattedMessage id="download.scratch2Desktop" />
<img src="/svgs/download/r-arrow.svg" /> <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="centered"
href="/scratch_1.4"
>
<FormattedMessage id="download.scratch1-4Desktop" />
<img
className="little-arrow"
src="/svgs/download/r-arrow.svg"
/>
</a> </a>
</p> </p>
</div> </div>

8
src/views/download/download.scss
View file

@ -47,7 +47,7 @@
.download-info { .download-info {
padding-right: $cols1; padding-right: $cols1;
max-width: $cols7 + ($gutter / $em); max-width: $cols6 + ($gutter / $em);
align-items: flex-start; align-items: flex-start;
.download-copy { .download-copy {
@ -99,7 +99,7 @@
.download-image { .download-image {
width: 100%; width: 100%;
max-width: $cols4; max-width: $cols6;
img { img {
max-width: 100%; max-width: 100%;
@ -158,8 +158,12 @@
p { p {
color: $link-blue; color: $link-blue;
font-weight: 600; font-weight: 600;
line-height: normal;
} }
.little-arrow {
padding-left: 2px;
}
.screenshot { .screenshot {
margin-top: 1rem; margin-top: 1rem;
$img-border: rgba(0, 0, 0, .05); $img-border: rgba(0, 0, 0, .05);

2
src/views/download/l10n.json
View file

@ -5,7 +5,7 @@
"download.imgAltDownloadIllustration" : "Scratch 3.0 Desktop screenshot", "download.imgAltDownloadIllustration" : "Scratch 3.0 Desktop screenshot",
"download.installHeaderTitle": "Install Scratch Desktop", "download.installHeaderTitle": "Install Scratch Desktop",
"download.downloadAndInstall": "Download and install Scratch Desktop", "download.downloadAndInstall": "Download and install Scratch Desktop",
"download.troubleshootingTitle": "FAQ / Troubleshooting", "download.troubleshootingTitle": "FAQ",
"download.startScratchDesktop": "Start Scratch Desktop", "download.startScratchDesktop": "Start Scratch Desktop",
"download.howDoIInstall": "How do I install Scratch Desktop?", "download.howDoIInstall": "How do I install Scratch Desktop?",
"download.whenSupportLinux": "When will you have Scratch Desktop for Linux?", "download.whenSupportLinux": "When will you have Scratch Desktop for Linux?",