Skip to content

GitLab

S
scratch-www
Commit 4a9418d4 authored by St19_Galla's avatar St19_Galla Committed by Matthew Taylor
Browse files
Options

Down Deep - Scratch Camp 2017 Page (#1409) 

* Add files via upload

* Create downdeep.jsx

* Delete downdeep.jsx

* Delete downdeep.scss

* Delete l10n.json

* Delete downdeep.jsx

* Create dd.jsx

* Rename dd.jsx to filler.jsx

* Add files via upload

* Delete dd.jsx

* Delete filler.jsx

* Create filler.jsx

* Add files via upload

* Delete filler.jsx

* Update routes.json

* whoops

* travis

* Update downdeep.jsx

* Update downdeep.scss

* Update downdeep.scss

* Update _colors.scss

* what i get for rushing

* Update downdeep.jsx

* Update l10n.json

* thisandagain's changes

* Carl's Changes

* carl's changes

* carl's changes

* Update downdeep.jsx

* Rename downdeep.jsx to camp.jsx

* Rename downdeep.scss to camp.scss

* Rename src/views/downdeep/camp.jsx to src/views/camp/camp.jsx

* Rename src/views/downdeep/camp.scss to src/views/camp/camp.scss

* Rename src/views/downdeep/l10n.json to src/views/camp/l10n.json

* Update camp.jsx

* Add files via upload

* Update camp.jsx

* Update camp.scss

* Update l10n.json

* Create filler

* Add files via upload

* Delete bubbles.svg

* Delete dolphin.svg

* Delete fish-divider.svg

* Delete fish-divider2.svg

* Delete map.svg

* Delete ocean-bottom.svg

* Delete ocean-top.svg

* Delete treasure.svg

* Update camp.scss

* Update camp.scss

* Update camp.scss

* Update camp.jsx

* whoops

* Update camp.scss

* Update l10n.json

* Update camp.scss

* Update camp.jsx

* Update _colors.scss

* Update camp.scss

* Update camp.scss

* Update camp.scss

* Update camp.scss

* Update _colors.scss

* Update camp.scss

* Update camp.scss
parent 3f90e985
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 760 additions and 0 deletions
src/_colors.scss
View file @ 4a9418d4
...@@ -34,3 +34,6 @@ $link-blue: $ui-blue; ...@@ -34,3 +34,6 @@ $link-blue: $ui-blue;
$splash-green: #9c0; $splash-green: #9c0;
$splash-pink: #c2479d; $splash-pink: #c2479d;
$splash-blue: #199ed7; $splash-blue: #199ed7;
/* Down Deep */
$dd-darkblue: hsla(195, 72.4, 17.1, 1);
src/routes.json
View file @ 4a9418d4
...@@ -97,6 +97,13 @@ ...@@ -97,6 +97,13 @@
"view": "dmca/dmca", "view": "dmca/dmca",
"title": "DMCA" "title": "DMCA"
}, },
{
"name": "camp",
"pattern": "^/camp/?$",
"routeAlias": "/camp/?$",
"view": "camp/camp",
"title": "Down Deep"
},
{ {
"name": "educator-landing", "name": "educator-landing",
"pattern": "^/educators/?$", "pattern": "^/educators/?$",
......
src/views/camp/camp.jsx 0 → 100644
View file @ 4a9418d4
var React = require('react');
var injectIntl = require('react-intl').injectIntl;
var FormattedMessage = require('react-intl').FormattedMessage;
var FormattedHTMLMessage = require('react-intl').FormattedHTMLMessage;
var render = require('../../lib/render.jsx');
var TitleBanner = require('../../components/title-banner/title-banner.jsx');
var FlexRow = require('../../components/flex-row/flex-row.jsx');
var Page = require('../../components/page/www/page.jsx');
require('./camp.scss');
var Camp = injectIntl(React.createClass({
type: 'Camp',
render: function () {
return (
<div>
<TitleBanner className="masthead mod-blue-bg">
<img src="/images/camp/ocean-top.svg" alt="Top" className="topImg"/>
<div className="inner">
<div className="title-content">
<h1 className="title-banner-h1">
<FormattedMessage id='camp.title' />
</h1>
<h4 className="intro title-banner-p">
<FormattedMessage id='camp.dates' />
</h4>
<img src="/images/camp/bubbles.svg" alt="Bubbles" className="bubbles"/>
</div>
</div>
</TitleBanner>
<div className="gradient1">
<section id="particpate">
<div className="inner">
<center>
<h2><FormattedMessage id='camp.welcome' /></h2>
<p id="intro">
<FormattedHTMLMessage id='camp.welcomeIntro' />
</p>
</center>
<center>
<img src="/images/camp/fish-divider.svg" className="fishDivider" />
</center>
<h2>
<center><FormattedMessage id='camp.part1Dates' /></center>
</h2>
<center>
<FlexRow className="sidebar-row">
<div className="body-copy column">
<h3><FormattedMessage id='camp.detailsTitle' /></h3>
<p>
<FormattedMessage id='camp.part1Details' />
</p>
</div>
<div className="sidebar column">
<h3><FormattedMessage id='camp.particpateTitle' /></h3>
<p>
<FormattedHTMLMessage id='camp.part1Particpate' />
</p>
</div>
</FlexRow>
<center>
<img src="/images/camp/fish-divider2.svg" className="fishDivider" />
</center>
<h2>
<center><FormattedMessage id='camp.part2Dates' /></center>
</h2>
<FlexRow className="sidebar-row">
<div className="body-copy column">
<h3><FormattedMessage id='camp.detailsTitle' /></h3>
<p>
<FormattedMessage id='camp.part2Details' />
</p>
</div>
<div className="sidebar column">
<h3><FormattedMessage id='camp.particpateTitle' /></h3>
<p>
<FormattedHTMLMessage id='camp.part2Particpate' />
</p>
</div>
</FlexRow>
<center>
<img src="/images/camp/fish-divider.svg" className="fishDivider" />
</center>
<h2>
<center><FormattedMessage id='camp.part3Dates' /></center>
</h2>
<FlexRow className="sidebar-row">
<div className="body-copy column">
<h3><FormattedMessage id='camp.detailsTitle' /></h3>
<p>
<FormattedMessage id='camp.part3Details' />
</p>
</div>
<div className="sidebar column">
<h3><FormattedMessage id='camp.particpateTitle' /></h3>
<p>
<FormattedHTMLMessage id='camp.part3Particpate' />
</p>
</div>
</FlexRow>
</center>
</div>
</section>
<img src="/images/camp/bubbles.svg" alt="Bubbles" className="bubbles"/>
<section id="info">
<div className="inner">
<center><h2><FormattedMessage id='camp.helpfulInfo' /></h2></center>
<FlexRow className="info-content">
<div>
<img src="/images/camp/dolphin.svg" alt="Dolphin" className="infoImg" />
<p>
<FormattedHTMLMessage id='camp.infoCounselors' />
</p>
</div>
<div>
<img src="/images/camp/treasure.svg" className="infoImg" />
<p>
<FormattedMessage id='camp.infoPart3' />
</p>
</div>
<div>
<img src="/images/camp/map.svg" className="infoImg" />
<p>
<FormattedMessage id='camp.infoTime' />
</p>
</div>
</FlexRow>
</div>
</section>
<img src="/images/camp/ocean-bottom.svg" alt="Top" className="bottomImg"/>
</div>
</div>
);
}
}));
render(<Page><Camp /></Page>, document.getElementById('app'));
src/views/camp/camp.scss 0 → 100644
View file @ 4a9418d4
@import "../../colors";
@import "../../frameless";
#view {
padding: 0;
}
.topImg {
margin-top: -10px;
padding: 0;
width: 100%;
}
.bubbles {
display: block;
margin: 0 auto;
margin-top: .938em;
width: 45%;
}
.inner a {
text-decoration: underline;
}
.inner a:hover {
text-decoration: underline;
color: $ui-light-gray;
}
h3 {
border-bottom: 1px solid $ui-border;
}
.flex-row {
&.sidebar-row {
align-items: flex-start;
.body-copy {
width: $cols5;
}
.sidebar {
width: $cols5;
}
}
}
#particpate {
position: relative;
h2, h3, p {
color: $ui-white;
}
}
#info {
h2, p {
color: $ui-white;
}
}
.info-content {
div {
max-width: $cols4;
text-align: center;
}
}
.infoImg {
transform: scale(.8);
height: 120px;
-webkit-transform: scale(.8); /* Saf3.1+, Chrome */
-moz-transform: scale(.8); /* FF3.5+ */
-ms-transform: scale(.8); /* IE9 */
-o-transform: scale(.8); /* Opera 10.5+ */
}
.bottomImg {
margin-bottom: -5px;
margin-left: -4px;
padding: 0;
width: 102%;
}
.title-banner {
margin: 0;
padding: 0;
}
.fishDivider {
margin: .875em 0;
}
.gradient1 {
position: relative;
background: $ui-blue; /* For browsers that do not support gradients */
background: -webkit-linear-gradient($ui-blue, $dd-darkblue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient($ui-blue, $dd-darkblue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient($ui-blue, $dd-darkblue); /* For Firefox 3.6 to 15 */
background: linear-gradient($ui-blue, $dd-darkblue);
.intro {
max-width: $cols9;
}
}
src/views/camp/l10n.json 0 → 100644
View file @ 4a9418d4
{
"camp.title": "Scratch Camp: Down Deep",
"camp.dates": "July 24th - August 13th",
"camp.welcome": "Welcome to Scratch Camp 2017!",
"camp.welcomeIntro": "Come take a dive into the ocean with us and design your very own creation. Your creation can be anything you might find in the ocean - real or made up! <br /> In this year’s camp, dive down deep with us in these three parts:",
"camp.part1Dates":"Part 1 (July 24th - July 30th)",
"camp.detailsTitle": "Details:",
"camp.part1Details": "Create a project introducing us to a character, real or imagined, that lives in the ocean. You could create a monster from the depths, a cute little starfish, a taco eating shark, or anything else you can imagine.",
"camp.particpateTitle": "How to Particpate:",
"camp.part1Particpate": "Part 1 of camp will take place in the <a href=\"https://scratch.mit.edu/studios/4160302/\">Main Camp Cabin studio</a>. Here you can ask questions, view other Scratchers' creations, and submit your own. Go to the studio to learn more!",
"camp.part2Dates": "Part 2 (July 31st - August 6th)",
"camp.part2Details": "Now make your character interactive! Does your character have questions to ask us? What happens when you click on it? Does it have any special powers? And more!",
"camp.part2Particpate":"Part 2 of camp will also take place in the <a href=\"https://scratch.mit.edu/studios/4160302/\">Main Camp Cabin studio</a>. Here you can ask questions, view other Scratchers' creations, and submit your own. Go to the studio to learn more!",
"camp.part3Dates": "Part 3 (August 7th - August 13th)",
"camp.part3Details": "Create a project using your own creation along with other Scratchers’ creations. It could be a game, story, animation, or anything you come up with!",
"camp.part3Particpate":"The <a href=\"https://scratch.mit.edu/studios/4160301/\">Final Projects Camp Cabin studio</a> will hold part 3 of this year's Scratch Camp. Here you can submit your final project, give feedback to others, and celebrate Scratch Camp! Swim on over to the studio when part 3 comes out!",
"camp.helpfulInfo": "Helpful Information",
"camp.infoCounselors": "The <a href=\"https://scratch.mit.edu/studios/4160300//\">Camp Counselors studio</a> offers a variety of examples for your ocean creation. You can also directly communicate with the Counselors there.",
"camp.infoPart3":"Remember, in part 3, you must use some other creations made for this Scratch Camp. Use their part 2 project to learn about the character's personality!",
"camp.infoTime":"Don't worry if you aren't around the whole time, you can always participate in whatever part you are available for! Just have fun and dive deep!"
}
static/images/camp/bubbles.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/dolphin.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/fish-divider.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/fish-divider2.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/map.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/ocean-bottom.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/ocean-top.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
static/images/camp/treasure.svg 0 → 100644
View file @ 4a9418d4
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment