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

Merge pull request #1192 from mewtaylor/issue/conference-fixes

Browse source 
Bugfix: Some copy fixes for new conference page
This commit is contained in:
Matthew Taylor 2017-02-22 09:25:56 -05:00 committed by GitHub
commit 1b0de13d63
8 changed files with 322 additions and 243 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/footer/conference/footer.jsx → src/components/footer/conference/2016/footer.jsx
View file

@ -1,9 +1,9 @@
var React = require('react');
var FlexRow = require('../../flex-row/flex-row.jsx');
var FooterBox = require('../container/footer.jsx');
var FlexRow = require('../../../flex-row/flex-row.jsx');
var FooterBox = require('../../container/footer.jsx');
require('./footer.scss');
require('../footer.scss');
var ConferenceFooter = React.createClass({
type: 'ConferenceFooter',

78
src/components/footer/conference/2017/footer.jsx Normal file
View file

@ -0,0 +1,78 @@
var React = require('react');
var FlexRow = require('../../../flex-row/flex-row.jsx');
var FooterBox = require('../../container/footer.jsx');
require('../footer.scss');
var ConferenceFooter = React.createClass({
type: 'ConferenceFooter',
render: function () {
return (
<FooterBox>
<FlexRow className="scratch-links">
<div className="family">
<h4>Scratch Family</h4>
<FlexRow>
<FlexRow as="ul" className="column">
<li>
<a href="https://scratch.mit.edu" target="_blank">Scratch</a>
</li>
<li>
<a href="http://www.scratchjr.org/" target="_blank">ScratchJr</a>
</li>
</FlexRow>
<FlexRow as="ul" className="column">
<li>
<a href="http://www.scratchfoundation.org/" target="_blank">Scratch Foundation</a>
</li>
<li>
<a href="http://scratched.gse.harvard.edu/" target="_blank">ScratchEd</a>
</li>
</FlexRow>
<FlexRow as="ul" className="column">
<li>
<a href="http://day.scratch.mit.edu" target="_blank">Scratch Day</a>
</li>
</FlexRow>
</FlexRow>
<p className="legal">
Scratch is a project of the Lifelong Kindergarten Group at the MIT Media Lab.
</p>
</div>
<div className="media">
<div className="contact-us">
<h4>Contact</h4>
<p>
<a href="mailto:help@scratch.mit.edu" target="_blank">
Email Us
</a>
</p>
</div>
<div className="social">
<FlexRow as="ul">
<li>
<a href="//www.twitter.com/scratch" target="_blank">
<img src="/images/conference/footer/twitter.png" alt="scratch twitter" />
</a>
</li>
<li>
<a href="//www.facebook.com/scratchteam" target="_blank">
<img src="/images/conference/footer/facebook.png" alt="scratch facebook" />
</a>
</li>
<li>
<a href="http://medium.com/scratchfoundation-blog" target="_blank">
<img src="/images/conference/footer/medium.png" alt="scratch foundation blog" />
</a>
</li>
</FlexRow>
</div>
</div>
</FlexRow>
</FooterBox>
);
}
});
module.exports = ConferenceFooter;

2
src/components/navigation/conference/2017/navigation.jsx
View file

@ -17,7 +17,7 @@ var Navigation = React.createClass({
alt="Scratch Logo"
className="logo-a-image"
/>
<p className="logo-a-title">Conference</p>
<p className="logo-a-title">Conferences</p>
</a>
</li>
</ul>

2
src/components/page/conference/2016/page.jsx
View file

@ -1,7 +1,7 @@
var React = require('react');
var Navigation = require('../../../navigation/conference/2016/navigation.jsx');
var Footer = require('../../../footer/conference/footer.jsx');
var Footer = require('../../../footer/conference/2016/footer.jsx');
require('../page.scss');

2
src/components/page/conference/2017/page.jsx
View file

@ -1,7 +1,7 @@
var React = require('react');
var Navigation = require('../../../navigation/conference/2017/navigation.jsx');
var Footer = require('../../../footer/conference/footer.jsx');
var Footer = require('../../../footer/conference/2017/footer.jsx');
require('../page.scss');

469
src/views/conference/2017/index/index.jsx
View file

@ -25,9 +25,9 @@ var ConferenceSplash = React.createClass({
<FormattedMessage id='conference-2017.desc' />
</h3>
</TitleBanner>
<div className='conf2017-title-band'>
<h3 className='conf2017-title-band'>
<FormattedMessage id='conference-2017.seeBelow' />
</div>
</h3>
<div className='inner'>
<section className='conf2017-panel mod-france'>
<FlexRow className='conf2017-panel-title'>
@ -106,87 +106,7 @@ var ConferenceSplash = React.createClass({
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://scratch201bdx.org'>
<FormattedMessage id='conference-2017.website' />
</a>
</section>
<section className='conf2017-panel mod-brasil'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/br.svg'
alt='Brasil Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.brasilTitle' /></h3>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.brasilDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
<FormattedDate
value={new Date(2017, 8, 28)}
year='numeric'
month='long'
day='2-digit'
/>
{' - '}
<FormattedDate
value={new Date(2017, 8, 30)}
year='numeric'
month='long'
day='2-digit'
/>
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'São Paulo, Brasil'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.brasilAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'Português (Portuguese)'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://scratchbrasil.org/'>
<a className='button mod-2017-panel' href='http://scratch2017bdx.org'>
<FormattedMessage id='conference-2017.website' />
</a>
</section>
@ -270,157 +190,7 @@ var ConferenceSplash = React.createClass({
<FormattedMessage id='conference-2017.website' />
</a>
</section>
<section className='conf2017-panel mod-chile'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/cl.svg'
alt='Chile Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.chileTitle' /></h3>
<h4><FormattedMessage id='conference-2017.chileSubTitle' /></h4>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.chileDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
<FormattedDate
value={new Date(2017, 7, 31)}
year='numeric'
month='long'
day='2-digit'
/>
{' - '}
<FormattedDate
value={new Date(2017, 8, 1)}
year='numeric'
month='long'
day='2-digit'
/>
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'Santiago, Chile'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.chileAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'Español (Spanish - simultaneous translation during plenary sessions'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://www.scratchalsur.org'>
<FormattedMessage id='conference-2017.website' />
</a>
</section>
<section className='conf2017-panel mod-china'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/cn.svg'
alt='China Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.chinaTitle' /></h3>
<h4><FormattedMessage id='conference-2017.chinaSubTitle' /></h4>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.chinaDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
{'Middle of May'}
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'Shanghai, China'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.chinaAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'中文 (Chinese)'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='mailto:jovi.tong@uniamber.com'>
<FormattedMessage id='conference-2017.contact' />
</a>
</section>
<section className='conf2017-panel mod-costarica mod-last'>
<section className='conf2017-panel mod-costarica'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
@ -497,10 +267,239 @@ var ConferenceSplash = React.createClass({
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://www.scratchcostarica.com'>
<a className='button mod-2017-panel' href='mailto:admissions@treeoflifelearning.com'>
<FormattedMessage id='conference-2017.contact' />
</a>
</section>
<section className='conf2017-panel mod-chile'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/cl.svg'
alt='Chile Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.chileTitle' /></h3>
<h4><FormattedMessage id='conference-2017.chileSubTitle' /></h4>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.chileDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
<FormattedDate
value={new Date(2017, 7, 31)}
year='numeric'
month='long'
day='2-digit'
/>
{' - '}
<FormattedDate
value={new Date(2017, 8, 1)}
year='numeric'
month='long'
day='2-digit'
/>
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'Santiago, Chile'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.chileAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'Español (Spanish) - simultaneous translation during plenary sessions'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://www.scratchalsur.org'>
<FormattedMessage id='conference-2017.website' />
</a>
</section>
<section className='conf2017-panel mod-brasil'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/br.svg'
alt='Brasil Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.brasilTitle' /></h3>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.brasilDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
<FormattedDate
value={new Date(2017, 8, 28)}
year='numeric'
month='long'
day='2-digit'
/>
{' - '}
<FormattedDate
value={new Date(2017, 8, 30)}
year='numeric'
month='long'
day='2-digit'
/>
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'São Paulo, Brasil'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.brasilAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'Português (Portuguese)'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='http://scratchbrasil.org/'>
<FormattedMessage id='conference-2017.website' />
</a>
</section>
<section className='conf2017-panel mod-china mod-last'>
<FlexRow className='conf2017-panel-title'>
<img
className='conf2017-panel-flag'
src='/svgs/conference/flags/cn.svg'
alt='China Flag'
/>
<div className='conf2017-panel-title-text'>
<h3><FormattedMessage id='conference-2017.chinaTitle' /></h3>
</div>
</FlexRow>
<p className='conf2017-panel-desc'>
<FormattedMessage id='conference-2017.chinaDesc' />
</p>
<table className='conf2017-panel-details'>
<tbody>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/calendar-icon.svg'
alt='Calendar Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.date' /></td>
<td>
{'Middle of May, 2017'}
</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/map-icon.svg'
alt='Map Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.location' /></td>
<td>{'Shanghai, China'}</td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/audience-icon.svg'
alt='Audience Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.audience' /></td>
<td><FormattedMessage id='conference-2017.chinaAudience' /></td>
</tr>
<tr className='conf2017-panel-row'>
<td className='conf2017-panel-row-icon'>
<img
className='conf2017-panel-row-icon-image'
src='/svgs/conference/index/language-icon.svg'
alt='Language Icon'
/>
</td>
<td><FormattedMessage id='conference-2017.language' /></td>
<td>{'中文 (Chinese)'}</td>
</tr>
</tbody>
</table>
<a className='button mod-2017-panel' href='mailto:jovi.tong@uniamber.com'>
<FormattedMessage id='conference-2017.contact' />
</a>
</section>
</div>
</div>
);

3
src/views/conference/2017/index/index.scss
View file

@ -48,6 +48,9 @@
.conf2017-panel-flag {
margin-right: 6.25rem;
border: 1px solid $ui-border;
border-radius: 1px;
background-color: $ui-border;
width: 3.75rem;
}

3
src/views/conference/2017/index/l10n.json
View file

@ -28,8 +28,7 @@
"conference-2017.chileDesc": "Scratch al Sur 2017 is an opportunity to learn about the importance of introducing programming languages in schools. All lectures and workshops will provide an opportunity to share different experiences, from higher levels to those who are beginning to participate in Scratch's global community.",
"conference-2017.chileAudience": "School teachers, principals, education administrators, researchers, and information technology professionals",
"conference-2017.chinaTitle": "Scratch Conference",
"conference-2017.chinaSubTitle": "China*Love",
"conference-2017.chinaTitle": "Scratch Conference: China*Love",
"conference-2017.chinaDesc": "Join us for a gathering to support creative expression with Scratch in China. Share ways to promote learning with passion for programming, animation, community, and life.",
"conference-2017.chinaAudience": "Educators, parents, developers, makers",