Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Modal Join us #44

Merged
merged 2 commits into from
Nov 9, 2021
Merged

Modal Join us #44

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
4e1c188
Modal Join us
sidneygijzen Nov 4, 2021
3391dc2
Merge branch develop - new dockerfile
jorgejesus Nov 9, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions components/footer/component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,18 @@ import { Link } from 'lib/routes';

import Icon from 'components/icon';
import AboutModal from 'components/about-modal';
import JoinUsModal from 'components/join-us-modal';

import './style.scss';

const Footer = () => {
const [aboutModalOpen, setAboutModalOpen] = useState(false);
const [joinUsModalOpen, setJoinUsModalOpen] = useState(false);

return (
<>
<AboutModal open={aboutModalOpen} onClose={() => setAboutModalOpen(false)} />
<JoinUsModal open={joinUsModalOpen} onClose={() => setJoinUsModalOpen(false)} />
<footer className="c-footer">
<div className="container ">
<div className="row py-4">
Expand Down Expand Up @@ -41,6 +44,15 @@ const Footer = () => {
About us
</button>
</li>
<li>
<button
type="button"
className="nav-link pb-0"
onClick={() => setJoinUsModalOpen(true)}
>
Join us
</button>
</li>
<li>
<a href="mailto:info@soilsrevealed.org" className="nav-link pb-0">
Contact
Expand Down
23 changes: 20 additions & 3 deletions components/homepage/section-1/component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,13 @@ import Image from 'next/image';
import { Link } from 'lib/routes';
import { logEvent } from 'utils/analytics';
import AboutModal from 'components/about-modal';
import JoinUsModal from 'components/join-us-modal';

import './style.scss';

const Section1 = () => {
const [aboutModalOpen, setAboutModalOpen] = useState(false);
const [joinUsModalOpen, setJoinUsModalOpen] = useState(false);

const onClickExplore = useCallback(() => {
logEvent('Homepage', 'click on calls to action buttons', 'explore map (top of page)');
Expand All @@ -20,9 +22,15 @@ const Section1 = () => {
setAboutModalOpen(true);
}, [setAboutModalOpen]);

const onClickJoinUs = useCallback(() => {
logEvent('Homepage', 'click on calls to action buttons', 'join us (top of page)');
setJoinUsModalOpen(true);
}, [setJoinUsModalOpen]);

return (
<>
<AboutModal open={aboutModalOpen} onClose={() => setAboutModalOpen(false)} />
<JoinUsModal open={joinUsModalOpen} onClose={() => setJoinUsModalOpen(false)} />
<section className="c-homepage-section-1">
<div className="scroll-text-container">
<div className="container text-center">
Expand All @@ -36,15 +44,15 @@ const Section1 = () => {
biggest impact.
</div>
</div>
<div className="row">
<div className="col-sm-12 col-md-4 offset-md-2 text-center text-md-right mb-3 mb-md-0">
<div className="row justify-content-center">
<div className="col-sm-12 col-md-auto mb-3 mb-md-0">
<Link to="explore">
<a className="btn btn-primary btn-fixed-width" onClick={onClickExplore}>
Explore map
</a>
</Link>
</div>
<div className="col-sm-12 col-md-4 text-center text-md-left">
<div className="col-sm-12 col-md-auto mb-3 mb-md-0">
<button
type="button"
className="btn btn-outline-primary btn-fixed-width"
Expand All @@ -53,6 +61,15 @@ const Section1 = () => {
About us
</button>
</div>
<div className="col-sm-12 col-md-auto">
<button
type="button"
className="btn btn-outline-primary btn-fixed-width"
onClick={onClickJoinUs}
>
Join us
</button>
</div>
</div>
</div>
<div className="scroll-text">
Expand Down
23 changes: 20 additions & 3 deletions components/homepage/section-7/component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,13 @@ import PropTypes from 'prop-types';
import { Link } from 'lib/routes';
import { logEvent } from 'utils/analytics';
import AboutModal from 'components/about-modal';
import JoinUsModal from 'components/join-us-modal';

import './style.scss';

const Section7 = ({ configuration }) => {
const [aboutModalOpen, setAboutModalOpen] = useState(false);
const [joinUsModalOpen, setJoinUsModalOpen] = useState(false);

const onClickExplore = useCallback(() => {
logEvent('Homepage', 'click on calls to action buttons', 'explore map (bottom of page)');
Expand All @@ -19,9 +21,15 @@ const Section7 = ({ configuration }) => {
setAboutModalOpen(true);
}, [setAboutModalOpen]);

const onClickJoinUs = useCallback(() => {
logEvent('Homepage', 'click on calls to action buttons', 'join us (bottom of page)');
setJoinUsModalOpen(true);
}, [setJoinUsModalOpen]);

return (
<>
<AboutModal open={aboutModalOpen} onClose={() => setAboutModalOpen(false)} />
<JoinUsModal open={joinUsModalOpen} onClose={() => setJoinUsModalOpen(false)} />
<section id={configuration.anchor} className="c-homepage-section-7">
<div className="container">
<div className="row mb-5">
Expand All @@ -34,15 +42,15 @@ const Section7 = ({ configuration }) => {
for future scenarios.
</div>
</div>
<div className="row">
<div className="col-sm-12 col-md-4 offset-md-2 text-center text-md-right mb-3">
<div className="row justify-content-center">
<div className="col-sm-12 col-md-auto mb-3 mb-md-0 text-center">
<Link route="explore">
<a className="btn btn-secondary btn-fixed-width" onClick={onClickExplore}>
Explore map
</a>
</Link>
</div>
<div className="col-sm-12 col-md-4 text-center text-md-left">
<div className="col-sm-12 col-md-auto mb-3 mb-md-0 text-center">
<button
type="button"
className="btn btn-outline-secondary btn-fixed-width"
Expand All @@ -51,6 +59,15 @@ const Section7 = ({ configuration }) => {
About us
</button>
</div>
<div className="col-sm-12 col-md-auto text-center">
<button
type="button"
className="btn btn-outline-secondary btn-fixed-width"
onClick={onClickJoinUs}
>
Join us
</button>
</div>
</div>
</div>
</section>
Expand Down
104 changes: 104 additions & 0 deletions components/join-us-modal/component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
import React from 'react';
import PropTypes from 'prop-types';
import Image from 'next/image';

import Modal from 'components/modal';

import './style.scss';

const JoinUsModal = ({ open, onClose }) => (
<Modal open={open} onClose={onClose} title="Join us" className="c-join-us-modal">
<h1 className="mb-4">Join us</h1>

<p>
Would you like to help us improve Soils Revealed? We need your assistance to expand
space-time, predictive modelling analyses of SOC stock changes, the{' '}
<a href="https://doi.org/10.1111/ejss.12998" target="_blank" rel="noopener noreferrer">
approach piloted for Argentina
</a>
, to the whole globe.
</p>

<p>
Please share your field-measured soil data with the Soils Revealed team. Shared data will be
safeguarded in the ISRIC World Data Centre (WDC)-Soils repository and standardised according
to the{' '}
<a
href="https://essd.copernicus.org/articles/12/299/2020/"
target="_blank"
rel="noopener noreferrer"
>
WoSIS
</a>{' '}
workflow in accord with the license defined by each{' '}
<a
href="https://www.isric.org/explore/wosis/wosis-contributing-institutions-and-experts"
target="_blank"
rel="noopener noreferrer"
>
data provider
</a>
.
</p>

<p>
Prospective data contributors may email{' '}
<a href="mailto:info@soilsrevealed.org" target="_blank" rel="noopener noreferrer">
info@soilsrevealed.org
</a>{' '}
for details on desired formats and{' '}
<a
href="/files/data-sharing-agreement-soils-revealed-isric.pdf"
target="_blank"
rel="noopener noreferrer"
>
licensing
</a>
. Upon registration, new data contributors will be acknowledged below with their logo. Thanks
for sharing your data!
</p>

<p>Present data contributors (through WoSIS):</p>
<div className="container mt-3">
<div className="row align-items-center text-center">
<div className="col-6 col-md-3 pl-md-0">
<a
href="https://www.isric.org/explore/wosis/wosis-contributing-institutions-and-experts"
target="_blank"
rel="noopener noreferrer"
>
<Image
src="/images/join-us-wosis-present-data-contributors.jpg"
alt="Location of soil profiles provided with the \'WoSIS September 2019 snapshot\'"
width={200}
height={100}
/>
</a>
</div>
</div>
</div>

<p className="mt-4">New data contributions from:</p>
<div className="container mt-3">
<div className="row align-items-center text-center">
<div className="col-6 col-md-3 pl-md-0 text-left">
<a href="https://www.argentina.gob.ar/inta" target="_blank" rel="noopener noreferrer">
<Image
src="/images/inta-logo.jpg"
alt="Instituto Nacional de Tecnología Agropecuaria"
width={75}
height={75}
/>
</a>
</div>
</div>
</div>
</Modal>
);

JoinUsModal.propTypes = {
open: PropTypes.bool.isRequired,
onClose: PropTypes.func.isRequired,
};

export default JoinUsModal;
3 changes: 3 additions & 0 deletions components/join-us-modal/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import Component from './component';

export default Component;
19 changes: 19 additions & 0 deletions components/join-us-modal/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
@import 'css/settings';

.c-join-us-modal {
max-width: rem(850);

@include media-breakpoint-up(lg, $grid-breakpoints) {
padding: rem(50) rem(100);
}

h1 {
@include font-size($font-size-xxl);
text-align: center;
}

img {
display: inline-block;
max-width: 100%;
}
}
Binary file added public/files/data-sharing-agreement-soils-revealed-isric.pdf
View file
Open in desktop
Binary file not shown.
Binary file added public/images/inta-logo.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/images/join-us-wosis-present-data-contributors.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.