diff --git a/network-api/networkapi/fellows/templates/fellows_directory.html b/network-api/networkapi/fellows/templates/fellows_directory.html index 541d53e96dc..b0383c83096 100644 --- a/network-api/networkapi/fellows/templates/fellows_directory.html +++ b/network-api/networkapi/fellows/templates/fellows_directory.html @@ -1,4 +1,4 @@ -{% extends "foundation-base.html" %} +{% extends "fellowships-base.html" %} {% block body %} fellows directory diff --git a/network-api/networkapi/fellows/templates/fellows_home.html b/network-api/networkapi/fellows/templates/fellows_home.html index fc3e0cfd6a5..9aa70fda26d 100644 --- a/network-api/networkapi/fellows/templates/fellows_home.html +++ b/network-api/networkapi/fellows/templates/fellows_home.html @@ -1,4 +1,4 @@ -{% extends "foundation-base.html" %} +{% extends "fellowships-base.html" %} {% block hero_banner %}
@@ -31,12 +31,12 @@

Our Fellowships have 4 areas of focus:

Science

Brief description of the theme of the Fellowship and defining characteristics of it.

- Learn More + Learn More

Open Web

Brief description of the theme of the Fellowship and defining characteristics of it.

- Learn More + Learn More

Tech Policy

diff --git a/network-api/networkapi/fellows/templates/fellows_openweb.html b/network-api/networkapi/fellows/templates/fellows_openweb.html index 552dd3e2855..cd0b1f6ea4f 100644 --- a/network-api/networkapi/fellows/templates/fellows_openweb.html +++ b/network-api/networkapi/fellows/templates/fellows_openweb.html @@ -1,5 +1,43 @@ -{% extends "foundation-base.html" %} +{% extends "fellows_type.html" %} -{% block body %} -open web fellows +{% block breadcrumb_fellowship_type %} +Open Web +{% endblock %} + +{% block fellowship_type %} +Open Web +{% endblock %} + +{% block fellowship_description %} +{% lorem 2 p %} +{% endblock %} + +{% block fellowship_illustration %} +img +{% endblock %} + +{% block benefit_illustration %} +img +{% endblock %} + +{% block benefit_description %} +{% lorem 3 p %} +{% endblock %} + +{% block benefit_list %} +
  • Corrupti quis facilis exercitationem iste. Eius debitis animi quam repellendus quo natus earum quis atque sint, dicta beatae a quaerat quibusdam est eligendi possimus in.
  • +
  • Oodit hic dolores atque ullam, laboriosam necessitatibus facere perferendis magnam fuga aliquam, officia placeat sequi eligendi, fugiat dolorem quos cumque ut reiciendis.
  • +
  • Anihil molestias velit praesentium mollitia perspiciatis officiis. Ratione ipsam quod enim dolores modi unde blanditiis aperiam, dolore non mollitia voluptatibus modi eaque beatae iste.
  • +
  • Corrupti quis facilis exercitationem iste. Eius debitis animi quam repellendus quo natus earum quis atque sint, dicta beatae a quaerat quibusdam est odit hic dolores atque ullam, laboriosam necessitatibus facere perferendis magnam fuga aliquam, officia placeat sequi eligendi, fugiat dolorem quos cumque ut reiciendis eligendi possimus in.
  • +{% endblock %} + +{% block eligibility_list %} +
  • Corrupti quis facilis exercitationem iste. Eius debitis animi quam repellendus quo natus earum quis atque sint, dicta beatae a quaerat quibusdam est eligendi possimus in.
  • +
  • Oodit hic dolores atque ullam, laboriosam necessitatibus facere perferendis magnam fuga aliquam, officia placeat sequi eligendi, fugiat dolorem quos cumque ut reiciendis.
  • +
  • Anihil molestias velit praesentium mollitia perspiciatis officiis. Ratione ipsam quod enim dolores modi unde blanditiis aperiam, dolore non mollitia voluptatibus modi eaque beatae iste.
  • +
  • Corrupti quis facilis exercitationem iste. Eius debitis animi quam repellendus quo natus earum quis atque sint, dicta beatae a quaerat quibusdam est odit hic dolores atque ullam, laboriosam necessitatibus facere perferendis magnam fuga aliquam, officia placeat sequi eligendi, fugiat dolorem quos cumque ut reiciendis eligendi possimus in.
  • +{% endblock %} + +{% block featured_fellow %} + {% endblock %} diff --git a/network-api/networkapi/fellows/templates/fellows_science.html b/network-api/networkapi/fellows/templates/fellows_science.html index 843e8fdb00b..1fdd00997be 100644 --- a/network-api/networkapi/fellows/templates/fellows_science.html +++ b/network-api/networkapi/fellows/templates/fellows_science.html @@ -1,5 +1,51 @@ -{% extends "foundation-base.html" %} +{% extends "fellows_type.html" %} -{% block body %} -science fellows +{% block breadcrumb_fellowship_type %} +Science +{% endblock %} + +{% block fellowship_type %} +Science +{% endblock %} + +{% block fellowship_description %} +

    The Mozilla Fellowships for Science present a unique opportunity for researchers who want to influence the future of open science and data sharing within their communities.

    +

    We're looking for researchers with a passion for open source and data sharing, already working to shift research practice to be more collaborative, iterative and open. Fellows will spend 10 months starting September 2017 as community catalysts at their institutions, mentoring the next generation of open data practitioners and researchers and building lasting change in the global open science community.

    +

    Throughout their fellowship term, chosen fellows will receive training and support from Mozilla to hone their skills around open source, data sharing, open science policy and licensing. They will also craft code, curriculum and other learning resources that help their local communities learn open data practices, and teach their institutional peers.

    +{% endblock %} + +{% block fellowship_illustration %} +img +{% endblock %} + +{% block benefit_illustration %} +img +{% endblock %} + +{% block benefit_description %} +

    The Fellowships are designed to allow for flexibility for both Fellows and their families. The standard fellowship offers a stipend of $60,000 USD*, paid in 10 monthly installments. Fellows are responsible for remitting all applicable taxes and other government payments as required.

    +

    To help offset cost of living, the fellowship also provides supplements for childcare and health insurance, and helps pay for research/equipment and books. The fellowships also covers the costs of required travel for fellowship activities.

    +{% endblock %} + +{% block benefit_list %} +
  • a stipend of $60,000 USD*, paid in 10 monthly installments
  • +
  • a one-time health insurance supplement for Fellows and their families, ranging from $3,500 for single Fellows to $7,000 for a couple with two or more children
  • +
  • a one-time childcare allotment of up to $6,000 for families with children
  • +
  • an allowance of up to $3,000 towards the purchase of laptop computer, digital cameras, recorders and computer software; fees for continuing studies or other courses, research fees or payments, to the extent such purchases and fees are related to the fellowship +
  • +
  • coverage in full for all approved fellowship trips – domestic and international
  • +{% endblock %} + +{% block eligibility_list %} +
  • be currently based at or affiliated with a research institution
  • +
  • have the ability to accept outside funds for this fellowship directly (i.e., not distributed through the institution)
  • +
  • be an early-career researcher (i.e., graduate students, post-docs, research scientists, lecturers)
  • +
  • specialize in scientific research: physical, life, social, library, or natural sciences
  • +
  • be able to travel
  • +
  • obtain support from their advisors. As fellows will be based at their home institutions, please note that a letter of support from their advisor is mandatory for consideration
  • +
  • have experience participating in open communities
  • +{% endblock %} + +{% block featured_fellow %} + {% endblock %} diff --git a/network-api/networkapi/fellows/templates/fellows_support.html b/network-api/networkapi/fellows/templates/fellows_support.html index ff6aa072fe3..95e283bcf45 100644 --- a/network-api/networkapi/fellows/templates/fellows_support.html +++ b/network-api/networkapi/fellows/templates/fellows_support.html @@ -1,4 +1,4 @@ -{% extends "foundation-base.html" %} +{% extends "fellowships-base.html" %} {% block body %} fellows support diff --git a/network-api/networkapi/fellows/templates/fellows_type.html b/network-api/networkapi/fellows/templates/fellows_type.html new file mode 100644 index 00000000000..009915b70c9 --- /dev/null +++ b/network-api/networkapi/fellows/templates/fellows_type.html @@ -0,0 +1,91 @@ +{% extends "fellowships-base.html" %} + +{% block body %} + +
    + +
    + +
    +
    +

    {% block fellowship_type %}{% endblock %} Fellowship

    +
    +
    + {% block fellowship_description %}{% endblock %} +
    +
    {% block fellowship_illustration %}{% endblock %}
    +
    + +
    +
    +
    +

    Stipend and Financial Benefits

    +
    +
    {% block benefit_illustration %}{% endblock %}
    +
    + {% block benefit_description %}{% endblock %} +
    +
    +

    Fellows will receive:

    +
      + {% block benefit_list %} + {% endblock %} +
    +
    +
    + +
    +
    +
    +

    Eligibility Criteria

    +
    +
    +

    Fellows must be:

    +
      + {% block eligibility_list %} + {% endblock %} +
    +
    +
    img
    +
    + +{% block featured_fellow %} +{% endblock %} + +
    +
    img
    +
    +
    +
    +

    Application are open

    +

    short copy short copy short copy short copy short copy short copy short copy short copy short copy

    +
    +
    + +
    +
    +
    +
    + +
    +
    img
    +
    +
    +
    +

    Want to support the incredible work Fellows are doing? Either as a host organization or a funder, you can join us to keep the Internet healthy.

    +
    +
    + +
    +
    +
    +
    + +{% endblock %} diff --git a/network-api/networkapi/templates/foundation-base.html b/network-api/networkapi/templates/fellowships-base.html similarity index 92% rename from network-api/networkapi/templates/foundation-base.html rename to network-api/networkapi/templates/fellowships-base.html index 8e80cf918c7..7d1af642c55 100644 --- a/network-api/networkapi/templates/foundation-base.html +++ b/network-api/networkapi/templates/fellowships-base.html @@ -1,6 +1,6 @@ -{% load settings_value %}{% load active_nav %} +{% load settings_value %}{% load fellowship_active_nav %} @@ -74,14 +74,14 @@
    - diff --git a/source/js/fellowships.js b/source/js/fellowships.js new file mode 100644 index 00000000000..a1af8a72929 --- /dev/null +++ b/source/js/fellowships.js @@ -0,0 +1,47 @@ +/* eslint no-unused-vars: ["error", { "varsIgnorePattern": "React" }] */ + +import React from 'react'; +import ReactDOM from 'react-dom'; + +import Person from './components/people/person.jsx'; + +// Embed various Fellowships pages related React components +function injectReactComponents() { + // Science Fellowship + if (document.getElementById(`featured-science-fellow`)) { + let metadata = { + featured: true, + 'internet_health_issues': [ `Decentralization`, `Open Innovation` ], + links: [], + name: `Firstname Surname`, + role: `[Area Fellowship] Fellow, [Year]`, + location: `City, Country`, + image: `https://images.pexels.com/photos/264206/pexels-photo-264206.jpeg?w=500`, + quote: `Quote quote quote quote quote quote quote quote quote quote quote quote.`, + affiliations: [`Stanford University Professor; YouthLAB founder`], + 'fellow_directory_link': { type: `science`, link: `/fellowships/directory` } + }; + + ReactDOM.render(, document.getElementById(`featured-science-fellow`)); + } + + // Open Web Fellowship + if (document.getElementById(`featured-open-web-fellow`)) { + let metadata = { + featured: true, + 'internet_health_issues': [ `Decentralization`, `Open Innovation` ], + links: [], + name: `Firstname Surname`, + role: `[Area Fellowship] Fellow, [Year]`, + location: `City, Country`, + image: `https://images.pexels.com/photos/264206/pexels-photo-264206.jpeg?w=500`, + quote: `Quote quote quote quote quote quote quote quote quote quote quote quote.`, + affiliations: [`Stanford University Professor; YouthLAB founder`], + 'fellow_directory_link': { type: `science`, link: `/fellowships/directory` } + }; + + ReactDOM.render(, document.getElementById(`featured-open-web-fellow`)); + } +} + +export default { injectReactComponents }; diff --git a/source/js/main.js b/source/js/main.js index abb3664e342..41ad8ed0057 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -17,6 +17,8 @@ import HomeNews from './components/home-news/home-news.jsx'; import News from './components/news/news.jsx'; import Upcoming from './components/upcoming/upcoming.jsx'; +import fellowships from './fellowships'; + const SHOW_MEMBER_NOTICE = false; // To be populated via XHR... @@ -231,6 +233,9 @@ let main = { if (document.querySelector(`#news`)) { ReactDOM.render(, document.querySelector(`#news`)); } + + // Fellowships pages related components + fellowships.injectReactComponents(); } }; diff --git a/source/sass/main.scss b/source/sass/main.scss index 1c3d91a3fa8..30950cdc8eb 100755 --- a/source/sass/main.scss +++ b/source/sass/main.scss @@ -47,3 +47,4 @@ $bp-xl: #{map-get($grid-breakpoints, xl)}; // >= 1200px @import './views/about'; @import './views/contact'; @import './views/projects'; +@import './views/fellowships/shared'; diff --git a/source/sass/type.scss b/source/sass/type.scss index e936057ae89..ce92431c7f1 100644 --- a/source/sass/type.scss +++ b/source/sass/type.scss @@ -41,6 +41,32 @@ a { line-height: 1.5; } +@mixin yellow-underline-nav-link($active-class-name, $font-family: "Zilla Slab") { + font-family: $font-family; + color: #231f20; + position: relative; + top: 0; + + @if $font-family == "Zilla Slab" { + letter-spacing: 0.25px; + } + + &:hover, + &#{$active-class-name} { + color: inherit; + text-decoration: none; + + &::before { + content: ''; + display: inline-block; + border-bottom: 5px solid #ffed00; + width: 100%; + position: absolute; + bottom: -5px; + } + } +} + .h1-white { font-family: "Zilla Slab"; font-weight: 600; @@ -272,16 +298,6 @@ a { } .opp-link { - font-family: "Zilla Slab"; - color: #231f20; - letter-spacing: 0.25px; - - &:hover, - &.opp-link-active { - color: inherit; - text-decoration: none; - border-bottom: 5px solid #ffed00; - } - + @include yellow-underline-nav-link(".opp-link-active"); @include scaleText(18px, 20px); } diff --git a/source/sass/utilities.scss b/source/sass/utilities.scss index 10cb95c8fe7..e3407d62362 100644 --- a/source/sass/utilities.scss +++ b/source/sass/utilities.scss @@ -31,3 +31,29 @@ background-repeat: no-repeat; background-size: contain; } + +.breadcrumb { + background: none; + padding: 0; + margin-bottom: 0; + + a { + font-weight: 500; + } +} + +.breadcrumb-item + .breadcrumb-item::before { + padding-left: 5px; + padding-right: 2px; + content: ">"; +} + +.breadcrumb-item { + &.active { + @extend .small-gray; + } + + &:not(.active) { + text-decoration: underline; + } +} diff --git a/source/sass/views/fellowships/shared.scss b/source/sass/views/fellowships/shared.scss new file mode 100644 index 00000000000..bfbcc04de76 --- /dev/null +++ b/source/sass/views/fellowships/shared.scss @@ -0,0 +1,19 @@ +#fellowships-nav { + a { + @include yellow-underline-nav-link(".active", "Nunito Sans"); + } +} + +.fellowships-list { + list-style: outside; + + &.two-column { + column-count: 2; + column-gap: 2rem; + } + + li { + margin-left: 1.1rem; + padding-left: 1.5rem; + } +}