Skip to content

Commit

Permalink
Merge pull request #17 from CDCgov/emma/904-product-content
Browse files Browse the repository at this point in the history 
Update partner with us content
  • Loading branch information
@emmastephenson
emmastephenson authored Nov 17, 2023
2 parents 178148b + d4a61c7 commit 1795ad1
Show file tree
Hide file tree
Showing 2 changed files with 83 additions and 137 deletions.
216 changes: 79 additions & 137 deletions pages/partner-with-us.js
View file
Original file line number Diff line number Diff line change
@@ -1,150 +1,92 @@
import { Button } from '@trussworks/react-uswds';
import {Button} from '@trussworks/react-uswds';
import styles from '../styles/Home.module.scss';
import getInvolved1 from '../public/get-involved-1.svg';
import getInvolved2 from '../public/get-involved-2.svg';
import getInvolved3 from '../public/get-involved-3.svg';
import mobileGetInvolved1 from '../public/mobile/get-involved-1.svg';
import mobileGetInvolved2 from '../public/mobile/get-involved-2.svg';
import mobileGetInvolved3 from '../public/mobile/get-involved-3.svg';

import Image from 'next/image';
import Head from 'next/head';

export default function GetInvolved() {
return (
<>
<Head>
<title>Partner with us - Public Health Data Infrastructure</title>
</Head>
<div className="desktop:padding-bottom-9 desktop:padding-top-3">
<div className="grid-container padding-0 maxw-desktop-lg">
<div className="padding-y-5 desktop:padding-y-7 padding-x-205">
<h1 className="text-center text-accent-cool-darker font-bold text-3xl lg:text-4xl margin-bottom-2">
Partner with us
</h1>
<div className="mx-auto desktop:padding-x-8 desktop:width-tablet-lg lg:text-center lg:font-semibold lg:text-base text-base-darkest font-public-sans-xs">
Public health agencies have a variety of opportunities to
contribute to the development of Building Blocks. Below we&apos;ve
outlined how jurisdictions can get involved at various levels of
partnership, including our beta program, focus groups, and
Community of Practice (CoP).
<br />
<br />
This is also an opportunity extended to any partner who would like
their feedback incorporated into future Building Blocks work, but
who may not be immediately available to participate in the beta program.
</div>
</div>
<div className="grid-row desktop:grid-gap-4">
<div className="desktop:grid-col-6">
<div className="padding-x-205 padding-y-5 bg-primary-lighter desktop:radius-md desktop:padding-x-4">
<div className="text-center margin-bottom-105 desktop:display-none">
<Image alt="" src={mobileGetInvolved1} layout="fixed" />
</div>
<div className="text-center margin-bottom-105 display-none desktop:display-block">
<Image alt="" src={getInvolved1} layout="fixed" />
</div>
<h2
className={`text-center text-accent-cool-darker margin-bottom-105 ${styles.partnerItemHeaders}`}
>
Beta program
</h2>
<div
className={`text-base-darkest lg:text-base font-public-sans-xs ${styles.subBodyTextLineHeight}`}
>
Our beta program is an opportunity for STLTs to define and
iterate on existing Building Blocks. By participating in this
program, STLTs will gain a greater awareness about their data
architecture strengths and weaknesses and help improve a part
of their data process.
<br /> <br />
We invite you to visit our SDK toolkit where you can explore
the full range of modular Building Blocks. If interested in
getting involved in our beta program, please reach out to our
team.
</div>
<div className="text-center margin-top-2 desktop:margin-top-7 padding-x-5 desktop:padding-x-0">
<a href='https://www.surveymonkey.com/r/L35PNRK' target='_blank' rel="noreferrer">
<Button className="desktop:padding-x-7 padding-y-2">
Learn More
</Button>
</a>
</div>
</div>
</div>
<div className="desktop:grid-col-6">
<div className="padding-x-205 desktop:padding-x-4 padding-y-5 bg-primary-lighter radius-md">
<div className="desktop:grid-col-12 text-center desktop:display-none">
<Image alt="" src={mobileGetInvolved2} layout="responsive" />
</div>
<div className="text-center margin-bottom-105 display-none desktop:display-block">
<Image alt="" src={getInvolved2} layout="fixed" />
</div>
<h2
className={`text-center text-accent-cool-darker ${styles.partnerItemHeaders} margin-top-205 desktop:margin-top-0 margin-bottom-105`}
>
Focus groups
</h2>
<div
className={`text-base-darkest lg:text-base font-public-sans-xs ${styles.subBodyTextLineHeight}`}
>
We are conducting a series of focus groups to hear back from
public health agency staff who interact with data related to
childhood lead poisoning, Legionnaires’ disease, listeria, and
HIV surveillance at any point along the data lifecycle (e.g.,
collection, ingestion, management, analysis, visualization).
<br /> <br />
The purpose of these focus groups is to gather STLT input on
how we prioritize and design potential Building Blocks. Each
focus group will last for approximately 60 minutes.
</div>
<div className="text-center margin-top-2 desktop:margin-top-4 padding-x-5 desktop:padding-x-0">
<a href='https://www.surveymonkey.com/r/L35PNRK' target='_blank' rel="noreferrer">
<Button className="desktop:padding-x-7 padding-y-2">
Learn More
</Button>
</a>
</div>
</div>
</div>
</div>
</div>
<div className="grid-container maxw-desktop-lg padding-x-205">
<div className="grid-row padding-y-5 desktop:padding-y-9 desktop:padding-top-5 desktop:padding-bottom-0">
<div className="grid-col-12 text-center desktop:display-none">
<Image alt="" src={mobileGetInvolved3} layout="responsive" />
</div>
<div className="desktop:grid-col-5 display-none desktop:display-inline-block">
<div className="desktop:padding-left-5">
<Image alt="" src={getInvolved3} layout="fixed" />
</div>
</div>
<div className="desktop:grid-col-7 desktop:padding-left-7">
<h2
className={`text-accent-cool-darker margin-bottom-105 ${styles.partnerItemHeaders} ${styles.headerText}`}
>
You can also help support the Community of Practice
</h2>
<div
className={`margin-bottom-2 text-base-darkest lg:text-base font-public-sans-xs desktop:padding-right-8 ${styles.subBodyTextLineHeight}`}
>
A CoP partner is a STLT who, in the immediate future, is
interested in offering feedback about the design principles and
application interface(s) for Building Blocks and, in the near
future, is interested in getting involved in the Building Block
ecosystem by contributing code, helping define what the open source
community will look like, or offering other services as needed.
</div>
<div className="padding-x-4 desktop:padding-x-0">
<Button className="desktop:padding-x-7 padding-y-2" onClick={() => window.location = 'mailto:[email protected]'}>
return (
<>
<Head>
<title>How to engage with us - Data Integration Building Blocks</title>
</Head>
<div className="desktop:padding-bottom-9 desktop:padding-top-3 fill-page">
<div className="grid-container padding-0 maxw-desktop-lg">
<div className="padding-y-5 desktop:padding-y-7 padding-x-205">
<h1 className="text-center text-accent-cool-darker font-bold text-3xl lg:text-4xl margin-bottom-2">
How to engage with us
</h1>
<div
className="mx-auto desktop:padding-x-8 desktop:width-tablet-lg lg:text-center lg:font-semibold lg:text-base text-base-darkest font-public-sans-xs">
Below we&apos;ve outlined how jurisdictions can start
working with the DIBBs team.
</div>
<div
className="text-center margin-top-2 desktop:margin-top-4 padding-x-5 desktop:padding-x-0 padding-top-1">
<Button className="desktop:padding-x-7 padding-y-2"
onClick={() => window.location = 'mailto:[email protected]'}>

Contact Us
</Button>
</div>
</div>
<div className="grid-row desktop:grid-gap-4">
<div className="desktop:grid-col-6">
<div
className="padding-x-205 padding-y-5 bg-primary-lighter desktop:radius-md desktop:padding-x-4">
<div
className="text-center margin-bottom-105 desktop:display-none">
<Image alt="" src={mobileGetInvolved1}
layout="fixed"/>
</div>
<div
className="text-center margin-bottom-105 display-none desktop:display-block">
<Image alt="" src={getInvolved1} layout="fixed"/>
</div>
<h2
className={`text-center text-accent-cool-darker margin-bottom-105 ${styles.partnerItemHeaders}`}
>
Try our products
</h2>
<div
className={`text-base-darkest lg:text-base font-public-sans-xs ${styles.subBodyTextLineHeight}`}
>
If your jurisdiction is interested in using our products to solve your public health data challenges, please reach out to our team. We’d love to better understand your data needs and find ways to plug in.
</div>

Contact Us
</Button>
</div>
</div>
</div>
<div className="desktop:grid-col-6">
<div
className="padding-x-205 desktop:padding-x-4 padding-y-5 bg-primary-lighter radius-md">
<div
className="text-center margin-bottom-105 desktop:display-none">
<Image alt="" src={mobileGetInvolved2}
layout="fixed"/>
</div>
<div
className="text-center margin-bottom-105 display-none desktop:display-block">
<Image alt="" src={getInvolved2} layout="fixed"/>
</div>
<h2
className={`text-center text-accent-cool-darker ${styles.partnerItemHeaders} margin-top-205 desktop:margin-top-0 margin-bottom-105`}
>
Talk to us
</h2>
<div
className={`text-base-darkest lg:text-base font-public-sans-xs padding-bottom-3 ${styles.subBodyTextLineHeight}`}
>
Want to learn more? Our team is available to talk about how we can help you improve your public health data processing workflows.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</>
);
</>
);
}
4 changes: 4 additions & 0 deletions styles/globals.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,6 +146,10 @@ h2 {
color: white !important;
}

.fill-page {
min-height: 80vh
}

@media (min-width: 64em) {
.usa-header--basic .usa-navbar {
width: 60% !important;
Expand Down

0 comments on commit 1795ad1

Please sign in to comment.