From 550a6616872033e7fbf452045efcb154a1ef5da3 Mon Sep 17 00:00:00 2001 From: Paul Kaplan Date: Tue, 10 Nov 2020 09:38:07 -0500 Subject: [PATCH 1/4] Add SEC page --- src/routes.json | 8 + src/views/sec/l10n.json | 28 ++ src/views/sec/sec.jsx | 140 ++++++++++ src/views/sec/sec.scss | 69 +++++ static/images/sec/SEC-Top-img.svg | 302 +++++++++++++++++++++ static/images/sec/SEC-bottom-img.svg | 381 +++++++++++++++++++++++++++ 6 files changed, 928 insertions(+) create mode 100644 src/views/sec/l10n.json create mode 100644 src/views/sec/sec.jsx create mode 100644 src/views/sec/sec.scss create mode 100644 static/images/sec/SEC-Top-img.svg create mode 100644 static/images/sec/SEC-bottom-img.svg diff --git a/src/routes.json b/src/routes.json index 34ee66761..77a6ab068 100644 --- a/src/routes.json +++ b/src/routes.json @@ -254,6 +254,14 @@ "view": "search/search", "title": "Search" }, + { + "name": "sec", + "pattern": "^/sec/?(\\?.*)?$", + "routeAlias": "/sec/?", + "view": "sec/sec", + "title": "Scratch Education Collaborative", + "viewportWidth": "device-width" + }, { "name": "splash", "pattern": "^/?$", diff --git a/src/views/sec/l10n.json b/src/views/sec/l10n.json new file mode 100644 index 000000000..a5e0b8b29 --- /dev/null +++ b/src/views/sec/l10n.json @@ -0,0 +1,28 @@ +{ + "sec.title": "Scratch Education Collaborative", + "sec.intro": "A global network of organizations supporting creative-coding", + "sec.projectsTitle": "Overview", + "sec.eligibilityTitle": "Eligibility", + "sec.applyTitle": "How do I apply?", + "sec.subscribe": "To receive updates about resources, events, and ideas for supporting families and educators using Scratch, {subscribeLink}", + "sec.subscribeCallToAction": "sign up for our mailing list", + "sec.applyDeadline": "The deadline for applying to the Scratch Education Collaborative is January 10th, 2021", + "sec.applyButton": "Click here to apply", + "sec.projectsIntro": "The Scratch Foundation is launching the Scratch Education Collaborative (SEC), to bring together organizations committed to supporting creative coding experiences with a focus on educators, students, and communities historically underrepresented in computing.", + "sec.projectsIntro2": "In 2021, during the pilot year of the SEC, 5 organizations from across the globe will be selected to share their work, learn from one another, and help to develop best practices and examples for implementing culturally-sustaining creative computing with Scratch.", + "sec.expectationsFromSec": "What participating organizations can expect from the SEC", + "sec.expectationsFromSecPoint1": "Opportunities to connect with and learn from peer organizations and thought leaders around the globe through virtual workshops", + "sec.expectationsFromSecPoint2": "Support in developing and promoting equity-centered creative coding resources, events, and workshops using Scratch", + "sec.expectationsFromSecPoint3": "Opportunities to connect with and learn from the Scratch Team through workshops and virtual office hours", + "sec.expectationsFromSecPoint4": "Promotion of the organization’s work and impact through Scratch Team social-channels, websites, and newsletters", + "sec.expectationsFromOrgs": "What the SEC expects of participating organizations", + "sec.expectationsFromOrgsPoint1": "Participate in 4-6 virtual workshops or meetings over the course of the year", + "sec.expectationsFromOrgsPoint2": "Support the creation of culturally-sustaining Scratch creative-coding resources for your community", + "sec.expectationsFromOrgsPoint3": "Host at least one event, tutorial, or professional development activity for your community in 2021", + "sec.expectationsFromOrgsPoint4": "Share best-practices, learnings, and challenges back with the Scratch Foundation and SEC peer organizations", + "sec.eligibilityPoint1": "Participants must be a non-profit organization, public school, school district, university, college, or government entity", + "sec.eligibilityPoint2": "Organizations must be part-of and work with communities historically underrepresented in computing", + "sec.eligibilityPoint3": "Must be able to dedicate at least one-staff person as point of contact for the program", + "sec.eligibilityPrompt": "Wondering if your organization might be a good fit for the pilot year of the Scratch Education Collaborative? {link} to find out more.", + "sec.eligibilityPromptLink": "Read the FAQ" + } diff --git a/src/views/sec/sec.jsx b/src/views/sec/sec.jsx new file mode 100644 index 000000000..7efcf2658 --- /dev/null +++ b/src/views/sec/sec.jsx @@ -0,0 +1,140 @@ +const FormattedMessage = require('react-intl').FormattedMessage; +const React = require('react'); + +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 render = require('../../lib/render.jsx'); +const Page = require('../../components/page/www/page.jsx'); + +require('./sec.scss'); + +const EducationCollaborative = () => ( +
+ +
+ +
+

+ +

+

+ +

+
+ + +
+ + +
+
+

+

+

+
+
+

+
    +
    • +
    • +
    • +
    • +
+
+ +
+

+
    +
    • +
    • +
    • +
    • +
+
+ +
+

+
    +
    • +
    • +
    • +
+
+
+

+ + + }} + /> +

+
+
+ + +
+ +
+

+

+ +

+ + +
    • +     +     +
    + +     +
    +     + +
    +
    +

    + + + + ) + }} + /> +

    +
    +
    +
    +); + +render(, document.getElementById('app')); diff --git a/src/views/sec/sec.scss b/src/views/sec/sec.scss new file mode 100644 index 000000000..e1b47de06 --- /dev/null +++ b/src/views/sec/sec.scss @@ -0,0 +1,69 @@ +@import "../../colors"; +@import "../../frameless"; + +$sec-spot: $ui-blue; + +#view { + padding: 0; +} + +.education-collaborative { + .title-banner { + &.masthead { + background-color: $sec-spot; + padding: 50px 0; + + .masthead-info { + align-items: center; + justify-content: space-between; + + @media #{$intermediate} { + justify-content: end; + } + + h1 { + margin: 0 0 1rem 0; + text-align: left; + color: $ui-white; + } + p { + margin: 0; + text-align: left; + color: $ui-white; + max-width: $cols6; + } + img { + width: $cols4; + } + + .sec-apply-buttons { + margin-top: 2rem; + li { + border: 2px solid $ui-white; + padding: 16px; + font-size: 16px; + font-weight: 500; + } + } + } + } + } + + section { + margin-bottom: 3rem; + + p, ul { + max-width: $cols8; + } + } +} + +@media #{$intermediate, $medium, $small} { + #view { + text-align: left; + } +} + + + + diff --git a/static/images/sec/SEC-Top-img.svg b/static/images/sec/SEC-Top-img.svg new file mode 100644 index 000000000..e1fe4f1f8 --- /dev/null +++ b/static/images/sec/SEC-Top-img.svg @@ -0,0 +1,302 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/sec/SEC-bottom-img.svg b/static/images/sec/SEC-bottom-img.svg new file mode 100644 index 000000000..6fdf0d7b8 --- /dev/null +++ b/static/images/sec/SEC-bottom-img.svg @@ -0,0 +1,381 @@ + + + + +SEC-bottom-img + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From ee645b250ac1c0b1d4d2a69514402ae07bd7756a Mon Sep 17 00:00:00 2001 From: Paul Kaplan Date: Mon, 16 Nov 2020 14:31:31 -0500 Subject: [PATCH 2/4] Add culturally sustaining link --- src/views/sec/l10n.json | 3 ++- src/views/sec/sec.jsx | 13 ++++++++++++- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/src/views/sec/l10n.json b/src/views/sec/l10n.json index a5e0b8b29..9ea9e55c2 100644 --- a/src/views/sec/l10n.json +++ b/src/views/sec/l10n.json @@ -9,7 +9,8 @@ "sec.applyDeadline": "The deadline for applying to the Scratch Education Collaborative is January 10th, 2021", "sec.applyButton": "Click here to apply", "sec.projectsIntro": "The Scratch Foundation is launching the Scratch Education Collaborative (SEC), to bring together organizations committed to supporting creative coding experiences with a focus on educators, students, and communities historically underrepresented in computing.", - "sec.projectsIntro2": "In 2021, during the pilot year of the SEC, 5 organizations from across the globe will be selected to share their work, learn from one another, and help to develop best practices and examples for implementing culturally-sustaining creative computing with Scratch.", + "sec.projectsIntro2": "In 2021, during the pilot year of the SEC, 5 organizations from across the globe will be selected to share their work, learn from one another, and help to develop best practices and examples for implementing {culturallySustainingLink} creative computing with Scratch.", + "sec.culturallySustaining": "culturally-sustaining", "sec.expectationsFromSec": "What participating organizations can expect from the SEC", "sec.expectationsFromSecPoint1": "Opportunities to connect with and learn from peer organizations and thought leaders around the globe through virtual workshops", "sec.expectationsFromSecPoint2": "Support in developing and promoting equity-centered creative coding resources, events, and workshops using Scratch", diff --git a/src/views/sec/sec.jsx b/src/views/sec/sec.jsx index 7efcf2658..33db6e354 100644 --- a/src/views/sec/sec.jsx +++ b/src/views/sec/sec.jsx @@ -38,7 +38,18 @@ const EducationCollaborative = () => (

    -

    +

    + + + + }} /> +

    From 2799bc97f609c5f3adb307eb267d3be1e0e79705 Mon Sep 17 00:00:00 2001 From: Paul Kaplan Date: Mon, 16 Nov 2020 14:39:37 -0500 Subject: [PATCH 3/4] Fix lint error --- src/views/sec/sec.jsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/views/sec/sec.jsx b/src/views/sec/sec.jsx index 33db6e354..a594e7f1d 100644 --- a/src/views/sec/sec.jsx +++ b/src/views/sec/sec.jsx @@ -39,7 +39,8 @@ const EducationCollaborative = () => (

    - ( > - }} /> + }} + />

    From b92b98bd1998775b89ae141993b96d5bbef8c168 Mon Sep 17 00:00:00 2001 From: Paul Kaplan Date: Mon, 16 Nov 2020 15:19:42 -0500 Subject: [PATCH 4/4] Fix hyphens --- src/views/sec/l10n.json | 8 ++++---- src/views/sec/sec.scss | 1 + 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/views/sec/l10n.json b/src/views/sec/l10n.json index 9ea9e55c2..15e16771a 100644 --- a/src/views/sec/l10n.json +++ b/src/views/sec/l10n.json @@ -1,6 +1,6 @@ { "sec.title": "Scratch Education Collaborative", - "sec.intro": "A global network of organizations supporting creative-coding", + "sec.intro": "A global network of organizations supporting creative coding", "sec.projectsTitle": "Overview", "sec.eligibilityTitle": "Eligibility", "sec.applyTitle": "How do I apply?", @@ -10,7 +10,7 @@ "sec.applyButton": "Click here to apply", "sec.projectsIntro": "The Scratch Foundation is launching the Scratch Education Collaborative (SEC), to bring together organizations committed to supporting creative coding experiences with a focus on educators, students, and communities historically underrepresented in computing.", "sec.projectsIntro2": "In 2021, during the pilot year of the SEC, 5 organizations from across the globe will be selected to share their work, learn from one another, and help to develop best practices and examples for implementing {culturallySustainingLink} creative computing with Scratch.", - "sec.culturallySustaining": "culturally-sustaining", + "sec.culturallySustaining": "culturally sustaining", "sec.expectationsFromSec": "What participating organizations can expect from the SEC", "sec.expectationsFromSecPoint1": "Opportunities to connect with and learn from peer organizations and thought leaders around the globe through virtual workshops", "sec.expectationsFromSecPoint2": "Support in developing and promoting equity-centered creative coding resources, events, and workshops using Scratch", @@ -18,12 +18,12 @@ "sec.expectationsFromSecPoint4": "Promotion of the organization’s work and impact through Scratch Team social-channels, websites, and newsletters", "sec.expectationsFromOrgs": "What the SEC expects of participating organizations", "sec.expectationsFromOrgsPoint1": "Participate in 4-6 virtual workshops or meetings over the course of the year", - "sec.expectationsFromOrgsPoint2": "Support the creation of culturally-sustaining Scratch creative-coding resources for your community", + "sec.expectationsFromOrgsPoint2": "Support the creation of culturally sustaining Scratch creative coding resources for your community", "sec.expectationsFromOrgsPoint3": "Host at least one event, tutorial, or professional development activity for your community in 2021", "sec.expectationsFromOrgsPoint4": "Share best-practices, learnings, and challenges back with the Scratch Foundation and SEC peer organizations", "sec.eligibilityPoint1": "Participants must be a non-profit organization, public school, school district, university, college, or government entity", "sec.eligibilityPoint2": "Organizations must be part-of and work with communities historically underrepresented in computing", - "sec.eligibilityPoint3": "Must be able to dedicate at least one-staff person as point of contact for the program", + "sec.eligibilityPoint3": "Must be able to dedicate at least one staff person as point of contact for the program", "sec.eligibilityPrompt": "Wondering if your organization might be a good fit for the pilot year of the Scratch Education Collaborative? {link} to find out more.", "sec.eligibilityPromptLink": "Read the FAQ" } diff --git a/src/views/sec/sec.scss b/src/views/sec/sec.scss index e1b47de06..4ceb96e9d 100644 --- a/src/views/sec/sec.scss +++ b/src/views/sec/sec.scss @@ -31,6 +31,7 @@ $sec-spot: $ui-blue; text-align: left; color: $ui-white; max-width: $cols6; + font-size: 1.65em; } img { width: $cols4;