mirror of
https://github.com/DOI-DO/j40-cejst-2.git
synced 2025-02-23 10:04:18 -08:00
Fix all link colors, prevent logo from wrapping, update non-selected side-panel (#1908)
* Update links colors - Language links - Download links - Simple links - External links - Side panel demographics links - return to top links - update snapshots * Fix wrapping on logo title - remove beta pill * Update un-selected side panel copy (desktop) - two icons are needed * Remove icons on mobile view * Remove the pub. eng. button on all pages * Add usa-link class to all links - will create consiste visible state on all links * Remove tribal toggle - remove tribal layer from feature flag and make it default
This commit is contained in:
Vim
GitHub
parent
eeb7d07c40
commit
5633d0f86e
46 changed files with 933 additions and 729 deletions
|
|
@ -23,7 +23,6 @@ import mailIcon from '/node_modules/uswds/dist/img/usa-icons/mail_outline.svg';
|
|||
interface IAreaDetailProps {
|
||||
properties: constants.J40Properties,
|
||||
hash: string[],
|
||||
isCensusLayerSelected: boolean,
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -106,7 +105,7 @@ export const indicatorFilter = (label:MessageDescriptor) => {
|
|||
* @param {IAreaDetailProps} {}
|
||||
* @return {void}
|
||||
*/
|
||||
const AreaDetail = ({properties, hash, isCensusLayerSelected}: IAreaDetailProps) => {
|
||||
const AreaDetail = ({properties, hash}: IAreaDetailProps) => {
|
||||
const intl = useIntl();
|
||||
|
||||
// console.log the properties of the census that is selected:
|
||||
|
|
@ -118,7 +117,6 @@ const AreaDetail = ({properties, hash, isCensusLayerSelected}: IAreaDetailProps)
|
|||
const countyName = properties[constants.COUNTY_NAME] ? properties[constants.COUNTY_NAME] : "N/A";
|
||||
const stateName = properties[constants.STATE_NAME] ? properties[constants.STATE_NAME] : "N/A";
|
||||
const sidePanelState = properties[constants.SIDE_PANEL_STATE];
|
||||
const landAreaName = properties[constants.LAND_AREA_NAME];
|
||||
|
||||
const isCommunityFocus = score >= constants.SCORE_BOUNDARY_THRESHOLD;
|
||||
|
||||
|
|
@ -775,7 +773,6 @@ const AreaDetail = ({properties, hash, isCensusLayerSelected}: IAreaDetailProps)
|
|||
return (
|
||||
<aside className={styles.areaDetailContainer} data-cy={'aside'}>
|
||||
{
|
||||
isCensusLayerSelected ? (
|
||||
<>
|
||||
{/* Tract Info */}
|
||||
<TractInfo
|
||||
|
|
@ -846,21 +843,11 @@ const AreaDetail = ({properties, hash, isCensusLayerSelected}: IAreaDetailProps)
|
|||
</a>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<ul className={styles.censusRow}>
|
||||
<li>
|
||||
<span className={styles.censusLabel}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_TRIBAL_INFO.LAND_AREA_NAME)}
|
||||
</span>
|
||||
<span className={styles.censusText}>{` ${landAreaName}`}</span>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
{/* All category accordions in this component */}
|
||||
{isCensusLayerSelected && <Accordion multiselectable={true} items={categoryItems} />}
|
||||
{<Accordion multiselectable={true} items={categoryItems} />}
|
||||
|
||||
{/* Methodology version */}
|
||||
<div className={styles.versionInfo}>
|
||||
|
|
|
|||
|
|
@ -52,14 +52,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for ISL
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -141,14 +142,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for ISL
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -463,14 +465,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for NAT
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -552,14 +555,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for NAT
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -2150,14 +2154,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for PUE
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -2239,14 +2244,15 @@ exports[`rendering of the Islan areas in AreaDetail checks if indicators for PUE
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
|
|||
|
|
@ -43,18 +43,21 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-agr-loss-rate"
|
||||
>
|
||||
expected agriculture loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-bld-loss-rate"
|
||||
>
|
||||
expected building loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-pop-loss-rate"
|
||||
>
|
||||
expected population loss rate
|
||||
|
|
@ -68,12 +71,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -102,12 +107,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#energy-burden"
|
||||
>
|
||||
energy burden
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#pm-25"
|
||||
>
|
||||
PM2.5 in the air
|
||||
|
|
@ -121,12 +128,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -157,12 +166,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#diesel-pm"
|
||||
>
|
||||
diesel particulate matter exposure
|
||||
</a>
|
||||
or
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#traffic-vol"
|
||||
>
|
||||
traffic proximity and volume
|
||||
|
|
@ -178,12 +189,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -212,18 +225,21 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#lead-paint"
|
||||
>
|
||||
lead paint
|
||||
</a>
|
||||
AND
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#median-home"
|
||||
>
|
||||
median home value
|
||||
</a>
|
||||
is at or less than the 90th percentile OR at or above the 90th percentile for the
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#house-burden"
|
||||
>
|
||||
housing cost burden
|
||||
|
|
@ -237,12 +253,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -271,18 +289,21 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-haz"
|
||||
>
|
||||
proximity to hazardous waste facilities
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-npl"
|
||||
>
|
||||
proximity to National Priorities List (NPL) sites
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-rmp"
|
||||
>
|
||||
proximity to Risk Management Plan (RMP) facilities
|
||||
|
|
@ -296,12 +317,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -330,6 +353,7 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#waste-water"
|
||||
>
|
||||
wastewater discharge
|
||||
|
|
@ -343,12 +367,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -377,24 +403,28 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#asthma"
|
||||
>
|
||||
asthma
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#diabetes"
|
||||
>
|
||||
diabetes
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#heart-disease"
|
||||
>
|
||||
heart disease
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#life-exp"
|
||||
>
|
||||
low life expectancy
|
||||
|
|
@ -408,12 +438,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -442,24 +474,28 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-med-inc"
|
||||
>
|
||||
low median income
|
||||
</a>
|
||||
as a percentage of area median income OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#ling-iso"
|
||||
>
|
||||
linguistic isolation
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#unemploy"
|
||||
>
|
||||
unemployment
|
||||
</a>
|
||||
OR percentage of individuals in households at or below 100% Federal
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#poverty"
|
||||
>
|
||||
poverty
|
||||
|
|
@ -473,12 +509,14 @@ exports[`rendering of the Categories checks if component renders 1`] = `
|
|||
</strong>
|
||||
10% or more of adults 25 or older have not attained a
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-school"
|
||||
>
|
||||
high school degree
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
|
|||
|
|
@ -21,18 +21,21 @@ exports[`rendering of the CategoryCard checks if component renders 1`] = `
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-agr-loss-rate"
|
||||
>
|
||||
expected agriculture loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-bld-loss-rate"
|
||||
>
|
||||
expected building loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-pop-loss-rate"
|
||||
>
|
||||
expected population loss rate
|
||||
|
|
@ -46,12 +49,14 @@ exports[`rendering of the CategoryCard checks if component renders 1`] = `
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ const DatasetContainer = () => {
|
|||
</Grid>
|
||||
|
||||
<div className={styles.returnToTop}>
|
||||
<Link to={PAGES_ENDPOINTS.METHODOLOGY}>
|
||||
<Link className={'usa-link'} to={PAGES_ENDPOINTS.METHODOLOGY}>
|
||||
{METHODOLOGY_COPY.RETURN_TO_TOP.LINK}
|
||||
</Link>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1377,6 +1377,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</div>
|
||||
<div>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/methodology"
|
||||
>
|
||||
Return to top
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ const DownloadLink = ({href, linkText}:IDownloadLink) => {
|
|||
}
|
||||
return (
|
||||
<>
|
||||
<a href={href} download>{linkText}</a>
|
||||
<a href={href} className={`usa-link`} download>{linkText}</a>
|
||||
<img
|
||||
className={styles.downloadIcon}
|
||||
src={fileDownloadIcon}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
exports[`rendering of the DownloadLink disadvantaged checks if component renders 1`] = `
|
||||
<DocumentFragment>
|
||||
<a
|
||||
class="usa-link"
|
||||
download=""
|
||||
href="https://google.com"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -141,11 +141,13 @@ exports[`rendering of the GovernmentBanner checks if component renders 1`] = `
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ exports[`rendering of the HowYouCanHelp checks if various text fields are visibl
|
|||
<li>
|
||||
View the
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/methodology"
|
||||
>
|
||||
Methodology & data
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ exports[`J40Footer renders correctly 1`] = `
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -18,22 +18,8 @@
|
|||
@include u-display("flex");
|
||||
@include u-flex-direction("column");
|
||||
@include typeset("sans", 8, 3);
|
||||
}
|
||||
|
||||
.title2BetaPill {
|
||||
@include u-display("flex");
|
||||
}
|
||||
|
||||
.betaPill {
|
||||
@include u-display("inline-block");
|
||||
@include u-bg("yellow-20v");
|
||||
@include u-radius(1);
|
||||
@include u-padding-left(2);
|
||||
@include u-padding-right(2);
|
||||
@include u-padding-top('05');
|
||||
@include u-margin-left(1);
|
||||
@include u-font("body", "2xs");
|
||||
@include u-text('bold')
|
||||
max-width: 270px;
|
||||
min-width: 218px;
|
||||
}
|
||||
|
||||
.navLinks {
|
||||
|
|
|
|||
|
|
@ -36,7 +36,6 @@ const J40Header = () => {
|
|||
|
||||
// Logo text
|
||||
const logoLine1 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_1);
|
||||
const logoLine2 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_2);
|
||||
|
||||
/**
|
||||
* State variable to control the toggling of mobile menu button
|
||||
|
|
@ -203,17 +202,13 @@ const J40Header = () => {
|
|||
|
||||
{/* Logo */}
|
||||
<Grid col={1}>
|
||||
<img className={styles.logo} src={siteLogo} alt={`${logoLine1} ${logoLine2}`} />
|
||||
<img className={styles.logo} src={siteLogo} alt={`${logoLine1}`} />
|
||||
</Grid>
|
||||
|
||||
{/* Logo Title */}
|
||||
<Grid col={6}>
|
||||
<div className={styles.logoTitle}>
|
||||
<div>{logoLine1}</div>
|
||||
<div className={styles.title2BetaPill}>
|
||||
<div> {logoLine2} </div>
|
||||
<div className={styles.betaPill}>BETA</div>
|
||||
</div>
|
||||
{logoLine1}
|
||||
</div>
|
||||
</Grid>
|
||||
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
|
|||
|
|
@ -29,7 +29,6 @@ import MapInfoPanel from './mapInfoPanel';
|
|||
import MapSearch from './MapSearch';
|
||||
import MapTractLayers from './MapTractLayers/MapTractLayers';
|
||||
import MapTribalLayer from './MapTribalLayers/MapTribalLayers';
|
||||
import LayerSelector from './LayerSelector';
|
||||
import TerritoryFocusControl from './territoryFocusControl';
|
||||
import {getOSBaseMap} from '../data/getOSBaseMap';
|
||||
|
||||
|
|
@ -86,11 +85,6 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
const [transitionInProgress, setTransitionInProgress] = useState<boolean>(false);
|
||||
const [geolocationInProgress, setGeolocationInProgress] = useState<boolean>(false);
|
||||
const [isMobileMapState, setIsMobileMapState] = useState<boolean>(false);
|
||||
const [censusSelected, setCensusSelected] = useState<boolean>(true);
|
||||
|
||||
// In order to detect that the layer has been toggled (between census and tribal),
|
||||
// this state variable will hold that information
|
||||
const [layerToggled, setLayerToggled] = useState<boolean>(false);
|
||||
const {width: windowWidth} = useWindowSize();
|
||||
|
||||
/**
|
||||
|
|
@ -176,8 +170,6 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
} else {
|
||||
// This else clause will fire when the ID is null or empty. This is the case where the map is clicked
|
||||
|
||||
setLayerToggled(false);
|
||||
|
||||
// @ts-ignore
|
||||
const feature = event.features && event.features[0];
|
||||
|
||||
|
|
@ -324,7 +316,7 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
setGeolocationInProgress(true);
|
||||
};
|
||||
|
||||
const mapBoxBaseLayer = 'tl' in flags ? `mapbox://styles/justice40/cl2qimpi2000014qeb1egpox8` : `mapbox://styles/justice40/cl5mp95tu000k14lpl21spgny`;
|
||||
const mapBoxBaseLayer = `mapbox://styles/justice40/cl2qimpi2000014qeb1egpox8`;
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
@ -364,7 +356,7 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
// ****** Map state props: ******
|
||||
// http://visgl.github.io/react-map-gl/docs/api-reference/interactive-map#map-state
|
||||
{...viewport}
|
||||
mapStyle={process.env.MAPBOX_STYLES_READ_TOKEN ? mapBoxBaseLayer : getOSBaseMap(censusSelected)}
|
||||
mapStyle={process.env.MAPBOX_STYLES_READ_TOKEN ? mapBoxBaseLayer : getOSBaseMap()}
|
||||
width="100%"
|
||||
// Ajusting this height with a conditional statement will not render the map on staging.
|
||||
// The reason for this issue is unknown. Consider styling the parent container via SASS.
|
||||
|
|
@ -379,13 +371,10 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
dragRotate={false}
|
||||
touchRotate={false}
|
||||
// eslint-disable-next-line max-len
|
||||
interactiveLayerIds={censusSelected ?
|
||||
interactiveLayerIds={
|
||||
[
|
||||
constants.HIGH_ZOOM_LAYER_ID,
|
||||
constants.PRIORITIZED_HIGH_ZOOM_LAYER_ID,
|
||||
] : [
|
||||
constants.TRIBAL_LAYER_ID,
|
||||
constants.TRIBAL_ALASKA_POINTS_LAYER_ID,
|
||||
]
|
||||
}
|
||||
|
||||
|
|
@ -401,18 +390,10 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
data-cy={'reactMapGL'}
|
||||
>
|
||||
|
||||
{/* Load either the Tribal layer or Census layer depending on the censusSelected state variable */}
|
||||
{
|
||||
censusSelected ?
|
||||
<MapTractLayers
|
||||
selectedFeature={selectedFeature}
|
||||
selectedFeatureId={selectedFeatureId}
|
||||
/> :
|
||||
<MapTribalLayer
|
||||
selectedFeature={selectedFeature}
|
||||
selectedFeatureId={selectedFeatureId}
|
||||
/>
|
||||
}
|
||||
|
||||
{/* This is the first overlayed row on the map: Search and Geolocation */}
|
||||
<div className={styles.mapHeaderRow}>
|
||||
|
|
@ -442,13 +423,6 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
{/* This will allow to select between the census tract layer and the tribal lands layer */}
|
||||
<LayerSelector
|
||||
censusSelected={censusSelected}
|
||||
setCensusSelected={setCensusSelected}
|
||||
setLayerToggled={setLayerToggled}
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
{/* This is the second row overlayed on the map, it will add the navigation controls
|
||||
|
|
@ -478,7 +452,6 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
<AreaDetail
|
||||
properties={detailViewData.properties}
|
||||
hash={zoomLatLngHash}
|
||||
isCensusLayerSelected={censusSelected}
|
||||
/>
|
||||
</Popup>
|
||||
)}
|
||||
|
|
@ -493,8 +466,6 @@ const J40Map = ({location}: IJ40Interface) => {
|
|||
featureProperties={detailViewData?.properties}
|
||||
selectedFeatureId={selectedFeature?.id}
|
||||
hash={zoomLatLngHash}
|
||||
isCensusLayerSelected={censusSelected}
|
||||
layerToggled={layerToggled}
|
||||
/>
|
||||
</Grid>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -11,13 +11,11 @@
|
|||
.languageLink {
|
||||
@include u-display("inline-block");
|
||||
@include u-margin-left(1.5);
|
||||
|
||||
cursor: pointer;
|
||||
font-size: .8rem; // government banner text size not a token
|
||||
@include u-padding-top('2px');
|
||||
|
||||
&:hover {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ const Language = ({isDesktop}:ILanguageProps) => {
|
|||
languages.map((language: React.Key | null | undefined) => (
|
||||
<a
|
||||
href="#"
|
||||
className={styles.languageLink}
|
||||
className={styles.languageLink ? `usa-link ${styles.languageLink}` : `usa-link`}
|
||||
key={language}
|
||||
onClick={() => changeLocale(language)}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -10,11 +10,13 @@ exports[`rendering of the Language component on mobile checks if component rende
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ const LinkTypeWrapper = (props:ILinkTypeWrapper) => {
|
|||
if (props.internal) {
|
||||
return (
|
||||
<Link to={`${url}`}
|
||||
className={props.className}
|
||||
className={props.className ? `usa-link ${props.className}` : `usa-link`}
|
||||
>
|
||||
{props.linkText}
|
||||
</Link>
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@ exports[`testing all link types tests external links same tab 1`] = `
|
|||
exports[`testing all link types tests internal links 1`] = `
|
||||
<DocumentFragment>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/methodology"
|
||||
>
|
||||
test link text
|
||||
|
|
|
|||
|
|
@ -9,19 +9,17 @@
|
|||
|
||||
.sidePanelInfoTitle {
|
||||
@include u-padding-top(2);
|
||||
font-size: x-large;
|
||||
line-height: 1.9rem;
|
||||
font-size: large;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sidePanelInfoHeading {
|
||||
@include u-padding-top(2);
|
||||
font-size: x-large;
|
||||
// line-height: 1.9rem;
|
||||
font-size: large;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sidePanelInfoIcon {
|
||||
@include u-height(5);
|
||||
@include u-margin-top(4);
|
||||
@include u-margin-bottom(-2)
|
||||
@include u-height(2);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,58 +1,120 @@
|
|||
import React from 'react';
|
||||
import {useIntl} from 'gatsby-plugin-intl';
|
||||
import {useWindowSize} from 'react-use';
|
||||
|
||||
// @ts-ignore
|
||||
import puzzle from '../../images/sidePanelIcons/puzzle.svg';
|
||||
import plusIcon from '/node_modules/uswds/dist/img/usa-icons/add.svg';
|
||||
// @ts-ignore
|
||||
import bellCurve from '../../images/sidePanelIcons/bellCurve.svg';
|
||||
import searchIcon from '/node_modules/uswds/dist/img/usa-icons/search.svg';
|
||||
// @ts-ignore
|
||||
import pieChart from '../../images/sidePanelIcons/pieChart.svg';
|
||||
import locateIcon from '/node_modules/uswds/dist/img/usa-icons/my_location.svg';
|
||||
// @ts-ignore
|
||||
import upDown from '../../images/sidePanelIcons/upDown.svg';
|
||||
import puzzleIcon from '../../images/sidePanelIcons/puzzle.svg';
|
||||
// @ts-ignore
|
||||
import bellCurveIcon from '../../images/sidePanelIcons/bellCurve.svg';
|
||||
// @ts-ignore
|
||||
import pieChartIcon from '../../images/sidePanelIcons/pieChart.svg';
|
||||
// @ts-ignore
|
||||
import notAvailIcon from '/node_modules/uswds/dist/img/usa-icons/do_not_disturb.svg';
|
||||
|
||||
import * as styles from './SidePanelInfo.module.scss';
|
||||
import * as constants from '../../data/constants';
|
||||
import * as EXPLORE_COPY from '../../data/copy/explore';
|
||||
|
||||
const SidePanelInfo = () => {
|
||||
const intl = useIntl();
|
||||
const {width: windowWidth} = useWindowSize();
|
||||
|
||||
return (
|
||||
<aside className={styles.sidePanelInfoContainer}>
|
||||
|
||||
{/* Heading 1 */}
|
||||
<header tabIndex={0} className={styles.sidePanelInfoTitle}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.TITLE)}
|
||||
</header>
|
||||
<p tabIndex={0}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1)}
|
||||
</p>
|
||||
<p tabIndex={0} className={styles.sidePanelInfoHeading}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.HEADING1)}
|
||||
</p>
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon}
|
||||
src={puzzle}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.ALT_TEXT_ICON1)}
|
||||
/>
|
||||
</header>
|
||||
|
||||
{/* Paragraph 1 */}
|
||||
<p tabIndex={0}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA2)}
|
||||
</p>
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon}
|
||||
src={bellCurve}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.ALT_TEXT_ICON2)}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1_PART1)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={plusIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.PLUS)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1_PART2)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={searchIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.SEARCH)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1_PART3)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={locateIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.LOCATE)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1_PART4)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={notAvailIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.MOUSE)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA1_PART5)}
|
||||
</p>
|
||||
|
||||
{/* Heading 2 */}
|
||||
<p tabIndex={0} className={styles.sidePanelInfoHeading}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.HEADING2)}
|
||||
</p>
|
||||
|
||||
{/* Paragraph 2 */}
|
||||
<p tabIndex={0}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA3)}
|
||||
</p>
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon}
|
||||
src={pieChart}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.ALT_TEXT_ICON3)}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA2_PART1)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={puzzleIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.TRACT)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA2_PART2)}
|
||||
</p>
|
||||
|
||||
{/* Paragraph 3 */}
|
||||
<p tabIndex={0}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA4)}
|
||||
</p>
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon}
|
||||
src={upDown}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.ALT_TEXT_ICON4)}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA3_PART1)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={notAvailIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.DAC_CIRCLE)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA3_PART2)}
|
||||
</p>
|
||||
|
||||
{/* Paragraph 4 */}
|
||||
<p tabIndex={0}>
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA4_PART1)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={bellCurveIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.BELL_CURVE)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA4_PART2)}
|
||||
{
|
||||
windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
|
||||
<img tabIndex={0} className={styles.sidePanelInfoIcon} src={pieChartIcon}
|
||||
alt={intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT.PIE_CHART)}
|
||||
/>
|
||||
}
|
||||
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE.PARA4_PART3)}
|
||||
</p>
|
||||
|
||||
{/* Paragraph 5 */}
|
||||
<p tabIndex={0}>
|
||||
{EXPLORE_COPY.SIDE_PANEL_INITIAL_STATE_PARA5}
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -6,36 +6,104 @@ exports[`rendering of the component expects the render to match snapshot 1`] = `
|
|||
<header
|
||||
tabindex="0"
|
||||
>
|
||||
Things to know
|
||||
|
||||
How to use the map:
|
||||
|
||||
</header>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
This tool identifies communities that are marginalized, underserved, and overburdened by pollution. These communities are located in census tracts that are at or above the thresholds in one or more of eight categories of criteria.
|
||||
Zoom in
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Zoom in or search and select to see data about any census tract of interest
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that has depicts pieces of a block selected mimicking the census block census tracts
|
||||
a plus icon indicating that the user can zoom in
|
||||
*"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
, search
|
||||
|
||||
<img
|
||||
alt="
|
||||
a magnifying glass icon informing the user can search
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
, or locate yourself
|
||||
|
||||
<img
|
||||
alt="
|
||||
a gps icon informing the user can locate
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
and select
|
||||
|
||||
<img
|
||||
alt="
|
||||
a mouse arrow icon informing the user can use the mouse
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
to see information about any census tract
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses census tracts that represent about 4,000 people, which is the smallest unit of geography for which consistent data can be displayed on the map.
|
||||
Things to know:
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses census tracts
|
||||
|
||||
<img
|
||||
alt="
|
||||
a tract icon informing the user of census tracts
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
. Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation.
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color
|
||||
|
||||
<img
|
||||
alt="
|
||||
a blue circle icon informing the user of what a disadvantaged community is depicted as
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
on the map. This color is an opacity. This is so information about the map can be seen.
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses percentiles
|
||||
|
||||
<img
|
||||
alt="
|
||||
An icon that a bell curve or gaussian distribution
|
||||
|
|
@ -43,13 +111,9 @@ exports[`rendering of the component expects the render to match snapshot 1`] = `
|
|||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool ranks each census tract using percentiles that show how much burden each tract experiences relative to all other tracts, for each criterion.
|
||||
, percentages
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that depicts a part of pie chart being removed
|
||||
|
|
@ -57,25 +121,19 @@ exports[`rendering of the component expects the render to match snapshot 1`] = `
|
|||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Percentages are used for certain variables, i.e. those relating to high school achievement rate and to the share of individuals not currently enrolled in higher education.
|
||||
, or a simple yes/no to indicate how much burden the communities are experiencing in each tract.
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that has an up arrow and a down arrow
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Thresholds for each category determine if a tract should be identified as disadvantaged because it has exceeded a certain value for the relevant indicators.
|
||||
The tool also uses thresholds. If the tract meets or exceeds the threshold of any climate, environmental, or other burden
|
||||
<strong>
|
||||
AND
|
||||
</strong>
|
||||
it meets the threshold for the associated socioeconomic burden, then communites in the tract are considered disadvantaged.
|
||||
|
||||
</p>
|
||||
</aside>
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ describe('rendering of the SubPageNav', () => {
|
|||
|
||||
const firstLink = container.querySelector(`.usa-sidenav li:nth-child(${firstLinkActive}) a`);
|
||||
const secondLink = container.querySelector(`.usa-sidenav li:nth-child(${secondLinkIndex}) a`);
|
||||
expect(firstLink?.className).toBe('usa-current');
|
||||
expect(secondLink?.className).not.toBe('usa-current');
|
||||
expect(firstLink?.className).toBe('usa-link usa-current');
|
||||
expect(secondLink?.className).not.toBe('usa-link usa-current');
|
||||
});
|
||||
|
||||
it('checks if the second link is active', () => {
|
||||
|
|
@ -29,7 +29,7 @@ describe('rendering of the SubPageNav', () => {
|
|||
|
||||
const firstLink = container.querySelector(`.usa-sidenav li:nth-child(${firstLinkActive}) a`);
|
||||
const secondLink = container.querySelector(`.usa-sidenav li:nth-child(${secondLinkIndex}) a`);
|
||||
expect(secondLink?.className).toBe('usa-current');
|
||||
expect(firstLink?.className).not.toBe('usa-current');
|
||||
expect(secondLink?.className).toBe('usa-link usa-current');
|
||||
expect(firstLink?.className).not.toBe('usa-link usa-current');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
@include u-margin-top(.5);
|
||||
}
|
||||
.demographicHeading {
|
||||
@include u-margin-top(.5);
|
||||
@include u-margin-top(1);
|
||||
font-size: .875rem;
|
||||
|
||||
span{
|
||||
|
|
@ -37,7 +37,6 @@
|
|||
|
||||
//emulate a link
|
||||
cursor:pointer;
|
||||
color:blue;
|
||||
text-decoration:underline;
|
||||
|
||||
min-width: 45px;
|
||||
|
|
@ -47,7 +46,6 @@
|
|||
.showHideIcon{
|
||||
vertical-align: middle;
|
||||
height: 1rem;
|
||||
margin-left: -8px;
|
||||
filter: invert(8%) sepia(90%) saturate(7490%) hue-rotate(247deg) brightness(105%) contrast(143%);
|
||||
|
||||
&:hover{
|
||||
|
|
|
|||
|
|
@ -40,8 +40,8 @@ const J40AccordionItem = ({id, title, children}:IJ40AccordionItem) => {
|
|||
{title}
|
||||
<span>
|
||||
{'( '}
|
||||
<button
|
||||
className={styles.showHideText}
|
||||
<a
|
||||
className={styles.showHideText ? `usa-link ${styles.showHideText}` : `usa-link`}
|
||||
id={`${id}-header`}
|
||||
aria-controls={`${id}-panel`}
|
||||
aria-expanded={isExpanded}
|
||||
|
|
@ -49,7 +49,7 @@ const J40AccordionItem = ({id, title, children}:IJ40AccordionItem) => {
|
|||
tabIndex={0}
|
||||
>
|
||||
{isExpanded ? 'hide' : 'show'}
|
||||
</button>
|
||||
</a>
|
||||
{ isExpanded ?
|
||||
<img
|
||||
className={styles.showHideIcon}
|
||||
|
|
|
|||
|
|
@ -10,14 +10,15 @@ exports[`rendering of TractDemographics component does it render a tract in Alas
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -99,14 +100,15 @@ exports[`rendering of TractDemographics component does it render a tract in Alas
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -158,14 +160,15 @@ exports[`rendering of TractDemographics component does it render a tract in Amer
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -247,14 +250,15 @@ exports[`rendering of TractDemographics component does it render a tract in Amer
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -306,14 +310,15 @@ exports[`rendering of TractDemographics component does it render a tract in NYC
|
|||
Race / Ethnicity
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="race-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="race-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
@ -395,14 +400,15 @@ exports[`rendering of TractDemographics component does it render a tract in NYC
|
|||
Age
|
||||
<span>
|
||||
(
|
||||
<button
|
||||
<a
|
||||
aria-controls="age-panel"
|
||||
aria-expanded="false"
|
||||
class="usa-link"
|
||||
id="age-header"
|
||||
tabindex="0"
|
||||
>
|
||||
show
|
||||
</button>
|
||||
</a>
|
||||
<img
|
||||
alt="expand icon"
|
||||
src="test-file-stub"
|
||||
|
|
|
|||
|
|
@ -11,36 +11,104 @@ exports[`simulate app starting up, no click on map should match the snapshot of
|
|||
<header
|
||||
tabindex="0"
|
||||
>
|
||||
Things to know
|
||||
|
||||
How to use the map:
|
||||
|
||||
</header>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
This tool identifies communities that are marginalized, underserved, and overburdened by pollution. These communities are located in census tracts that are at or above the thresholds in one or more of eight categories of criteria.
|
||||
Zoom in
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Zoom in or search and select to see data about any census tract of interest
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that has depicts pieces of a block selected mimicking the census block census tracts
|
||||
a plus icon indicating that the user can zoom in
|
||||
*"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
, search
|
||||
|
||||
<img
|
||||
alt="
|
||||
a magnifying glass icon informing the user can search
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
, or locate yourself
|
||||
|
||||
<img
|
||||
alt="
|
||||
a gps icon informing the user can locate
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
and select
|
||||
|
||||
<img
|
||||
alt="
|
||||
a mouse arrow icon informing the user can use the mouse
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
to see information about any census tract
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses census tracts that represent about 4,000 people, which is the smallest unit of geography for which consistent data can be displayed on the map.
|
||||
Things to know:
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses census tracts
|
||||
|
||||
<img
|
||||
alt="
|
||||
a tract icon informing the user of census tracts
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
. Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation.
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color
|
||||
|
||||
<img
|
||||
alt="
|
||||
a blue circle icon informing the user of what a disadvantaged community is depicted as
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
|
||||
on the map. This color is an opacity. This is so information about the map can be seen.
|
||||
|
||||
</p>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool uses percentiles
|
||||
|
||||
<img
|
||||
alt="
|
||||
An icon that a bell curve or gaussian distribution
|
||||
|
|
@ -48,13 +116,9 @@ exports[`simulate app starting up, no click on map should match the snapshot of
|
|||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
The tool ranks each census tract using percentiles that show how much burden each tract experiences relative to all other tracts, for each criterion.
|
||||
, percentages
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that depicts a part of pie chart being removed
|
||||
|
|
@ -62,25 +126,19 @@ exports[`simulate app starting up, no click on map should match the snapshot of
|
|||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Percentages are used for certain variables, i.e. those relating to high school achievement rate and to the share of individuals not currently enrolled in higher education.
|
||||
, or a simple yes/no to indicate how much burden the communities are experiencing in each tract.
|
||||
|
||||
</p>
|
||||
<img
|
||||
alt="
|
||||
An icon that has an up arrow and a down arrow
|
||||
"
|
||||
src="test-file-stub"
|
||||
tabindex="0"
|
||||
/>
|
||||
<p
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Thresholds for each category determine if a tract should be identified as disadvantaged because it has exceeded a certain value for the relevant indicators.
|
||||
The tool also uses thresholds. If the tract meets or exceeds the threshold of any climate, environmental, or other burden
|
||||
<strong>
|
||||
AND
|
||||
</strong>
|
||||
it meets the threshold for the associated socioeconomic burden, then communites in the tract are considered disadvantaged.
|
||||
|
||||
</p>
|
||||
</aside>
|
||||
|
|
|
|||
|
|
@ -7,8 +7,6 @@ interface IMapInfoPanelProps {
|
|||
featureProperties: { [key:string]: string | number } | undefined,
|
||||
selectedFeatureId: string | number | undefined
|
||||
hash: string[],
|
||||
isCensusLayerSelected: boolean,
|
||||
layerToggled: boolean, // indicates if census layer or tribal layer has been toggled
|
||||
}
|
||||
|
||||
const MapInfoPanel = ({
|
||||
|
|
@ -16,23 +14,18 @@ const MapInfoPanel = ({
|
|||
featureProperties,
|
||||
selectedFeatureId,
|
||||
hash,
|
||||
isCensusLayerSelected,
|
||||
layerToggled,
|
||||
}:IMapInfoPanelProps) => {
|
||||
return (
|
||||
<div className={className} >
|
||||
{/* The tertiary conditional statement below will control the side panel state. Currently
|
||||
{/*
|
||||
The tertiary conditional statement below will control the side panel state. Currently
|
||||
there are two states, namely showing the AreaDetail or SidePanelInfo. When a feature
|
||||
is selected, on - for example - the census tract layer, and if the Tribal Layer is the selected
|
||||
the Side Panel should revert back to the SidePanelInfo.
|
||||
|
||||
A new boolean called layerToggle captures that a layer has been selected and to render
|
||||
the SidePanelInfo component */}
|
||||
{(featureProperties && selectedFeatureId && !layerToggled) ?
|
||||
is selected, show the AreaDetail. When not selected show SidePanelInfo
|
||||
*/}
|
||||
{(featureProperties && selectedFeatureId) ?
|
||||
<AreaDetail
|
||||
properties={featureProperties}
|
||||
hash={hash}
|
||||
isCensusLayerSelected={isCensusLayerSelected}
|
||||
/> :
|
||||
<SidePanelInfo />
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ export interface IDefineMessage {
|
|||
* */
|
||||
export const italicFn = (str:string) => <i>{str}</i>;
|
||||
export const boldFn = (str:string) => <strong>{str}</strong>;
|
||||
export const simpleLink = (href:string) => (str:string) => <a href={href}>{str}</a>;
|
||||
export const simpleLink = (href:string) => (str:string) => <a className={'usa-link'} href={href}>{str}</a>;
|
||||
// export const downloadLink = (href:string) => (str:string) => <a href={href} download>{str}</a>;
|
||||
export const downloadLink = (href:string) => (str:string) => <DownloadLink href={href} linkText={str} />;
|
||||
// eslint-disable-next-line max-len
|
||||
|
|
@ -101,13 +101,8 @@ export const ALERTS = {
|
|||
export const HEADER = defineMessages({
|
||||
TITLE_LINE_1: {
|
||||
id: 'common.pages.header.title.line1',
|
||||
defaultMessage: `Climate and Economic Justice`,
|
||||
description: 'Navigate to the about page. This is Title in nav header line 1 of 2',
|
||||
},
|
||||
TITLE_LINE_2: {
|
||||
id: 'common.pages.header.title.line2',
|
||||
defaultMessage: `Screening Tool`,
|
||||
description: 'Navigate to the about page. This is Title in nav header line 2 of 2',
|
||||
defaultMessage: `Climate and Economic Justice Screening Tool`,
|
||||
description: 'Navigate to the about page. This is Title in nav header',
|
||||
},
|
||||
ABOUT: {
|
||||
id: 'common.pages.header.about',
|
||||
|
|
|
|||
|
|
@ -207,86 +207,185 @@ export const MAP = defineMessages({
|
|||
});
|
||||
|
||||
|
||||
// Side Panel copy
|
||||
// Side Panel non-selected state copy
|
||||
export const SIDE_PANEL_INITIAL_STATE = defineMessages({
|
||||
TITLE: {
|
||||
id: 'explore.map.page.side.panel.info.title',
|
||||
defaultMessage: 'Things to know',
|
||||
description: 'introductory text of ways to use the map',
|
||||
},
|
||||
PARA1: {
|
||||
id: 'explore.map.page.side.panel.info.para1',
|
||||
defaultMessage: `
|
||||
This tool identifies communities that are marginalized, underserved, and overburdened by pollution. These communities are located in census tracts that are at or above the thresholds in one or more of eight categories of criteria.
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first paragraph of this side panel`,
|
||||
},
|
||||
HEADING1: {
|
||||
id: 'explore.map.page.side.panel.info.heading1',
|
||||
defaultMessage: `
|
||||
Zoom in or search and select to see data about any census tract of interest
|
||||
How to use the map:
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first paragraph of this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the first heading of the non-selected side panel',
|
||||
},
|
||||
PARA2: {
|
||||
id: 'explore.map.page.side.panel.info.para2',
|
||||
PARA1_PART1: {
|
||||
id: 'explore.map.page.side.panel.info.para.1.part.1',
|
||||
defaultMessage: `
|
||||
The tool uses census tracts that represent about 4,000 people, which is the smallest unit of geography for which consistent data can be displayed on the map.
|
||||
Zoom in
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the second paragraph of this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Zoom in',
|
||||
},
|
||||
PARA3: {
|
||||
id: 'explore.map.page.side.panel.info.para3',
|
||||
PARA1_PART2: {
|
||||
id: 'explore.map.page.side.panel.info.para.1.part.2',
|
||||
defaultMessage: `
|
||||
The tool ranks each census tract using percentiles that show how much burden each tract experiences relative to all other tracts, for each criterion.
|
||||
, search
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the third paragraph of this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show search',
|
||||
},
|
||||
PARA4: {
|
||||
id: 'explore.map.page.side.panel.info.para4',
|
||||
PARA1_PART3: {
|
||||
id: 'explore.map.page.side.panel.info.para.1.part.2',
|
||||
defaultMessage: `
|
||||
Percentages are used for certain variables, i.e. those relating to high school achievement rate and to the share of individuals not currently enrolled in higher education.
|
||||
, or locate yourself
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the forth paragraph of this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show or locate yourself',
|
||||
},
|
||||
ALT_TEXT_ICON1: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon1',
|
||||
PARA1_PART4: {
|
||||
id: 'explore.map.page.side.panel.info.para.1.part.4',
|
||||
defaultMessage: `
|
||||
An icon that has depicts pieces of a block selected mimicking the census block census tracts
|
||||
and select
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first icon in this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show and select',
|
||||
},
|
||||
ALT_TEXT_ICON2: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon2',
|
||||
PARA1_PART5: {
|
||||
id: 'explore.map.page.side.panel.info.para.1.part.5',
|
||||
defaultMessage: `
|
||||
An icon that a bell curve or gaussian distribution
|
||||
to see information about any census tract
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the second icon in this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show to see information about any census tract',
|
||||
},
|
||||
ALT_TEXT_ICON3: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon3',
|
||||
HEADING2: {
|
||||
id: 'explore.map.page.side.panel.info.heading2',
|
||||
defaultMessage: `
|
||||
An icon that depicts a part of pie chart being removed
|
||||
Things to know:
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the third icon in this side panel`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know:`,
|
||||
},
|
||||
ALT_TEXT_ICON4: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon4',
|
||||
PARA2_PART1: {
|
||||
id: 'explore.map.page.side.panel.info.para.2.part.1',
|
||||
defaultMessage: `
|
||||
An icon that has an up arrow and a down arrow
|
||||
The tool uses census tracts
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the forth icon in this side panel`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show The tool uses census tracts',
|
||||
},
|
||||
PARA2_PART2: {
|
||||
id: 'explore.map.page.side.panel.info.para.2.part.2',
|
||||
defaultMessage: `
|
||||
. Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation.
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation.',
|
||||
},
|
||||
PARA3_PART1: {
|
||||
id: 'explore.map.page.side.panel.info.para.3.part.1',
|
||||
defaultMessage: `
|
||||
Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color',
|
||||
},
|
||||
PARA3_PART2: {
|
||||
id: 'explore.map.page.side.panel.info.para.3.part.2',
|
||||
defaultMessage: `
|
||||
on the map. This color is an opacity. This is so information about the map can be seen.
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show on the map. This color is an opacity. This is so information about the map can be seen.',
|
||||
},
|
||||
PARA4_PART1: {
|
||||
id: 'explore.map.page.side.panel.info.para.4.part.1',
|
||||
defaultMessage: `
|
||||
The tool uses percentiles
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show The tool uses percentiles',
|
||||
},
|
||||
PARA4_PART2: {
|
||||
id: 'explore.map.page.side.panel.info.para.4.part.2',
|
||||
defaultMessage: `
|
||||
, percentages
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show percentages',
|
||||
},
|
||||
PARA4_PART3: {
|
||||
id: 'explore.map.page.side.panel.info.para.4.part.3',
|
||||
defaultMessage: `
|
||||
, or a simple yes/no to indicate how much burden the communities are experiencing in each tract.
|
||||
`,
|
||||
description: '`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show or a simple yes/no to indicate how much burden the communities are experiencing in each tract.',
|
||||
},
|
||||
});
|
||||
|
||||
export const SIDE_PANEL_INITIAL_STATE_PARA5 = <FormattedMessage
|
||||
id={'explore.map.page.side.panel.info.para5'}
|
||||
defaultMessage={ `
|
||||
Thresholds for each category determine if a tract should be identified as disadvantaged because it has exceeded a certain value for the relevant indicators.
|
||||
The tool also uses thresholds. If the tract meets or exceeds the threshold of any climate, environmental, or other burden <bold>AND</bold> it meets the threshold for the associated socioeconomic burden, then communites in the tract are considered disadvantaged.
|
||||
`}
|
||||
description={`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the fifth paragraph of this side pane`}
|
||||
values={{
|
||||
bold: COMMON_COPY.boldFn,
|
||||
}}
|
||||
/>;
|
||||
|
||||
export const SIDE_PANEL_INIT_STATE_ICON_ALT_TEXT = defineMessages({
|
||||
PLUS: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.plus',
|
||||
defaultMessage: `
|
||||
a plus icon indicating that the user can zoom in
|
||||
*`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a plus icon indicating that the user can zoom in`,
|
||||
},
|
||||
SEARCH: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.search',
|
||||
defaultMessage: `
|
||||
a magnifying glass icon informing the user can search
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a magnifying glass icon informing the user can search`,
|
||||
},
|
||||
LOCATE: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.locate',
|
||||
defaultMessage: `
|
||||
a gps icon informing the user can locate
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a gps icon informing the user can locate`,
|
||||
},
|
||||
MOUSE: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.mouse',
|
||||
defaultMessage: `
|
||||
a mouse arrow icon informing the user can use the mouse
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a mouse arrow icon informing the user can use the mouse`,
|
||||
},
|
||||
TRACT: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.tract',
|
||||
defaultMessage: `
|
||||
a tract icon informing the user of census tracts
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a tract icon informing the user of census tracts`,
|
||||
},
|
||||
DAC_CIRCLE: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.dac.circle',
|
||||
defaultMessage: `
|
||||
a blue circle icon informing the user of what a disadvantaged community is depicted as
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a blue circle icon informing the user of what a disadvantaged community is depicted as`,
|
||||
},
|
||||
BELL_CURVE: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.bell',
|
||||
defaultMessage: `
|
||||
An icon that a bell curve or gaussian distribution
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that a bell curve or gaussian distribution`,
|
||||
},
|
||||
PIE_CHART: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.pie',
|
||||
defaultMessage: `
|
||||
An icon that depicts a part of pie chart being removed
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that depicts a part of pie chart being removed`,
|
||||
},
|
||||
UP_ARROW: {
|
||||
id: 'explore.map.page.side.panel.info.alt.text.icon.up.arrow',
|
||||
defaultMessage: `
|
||||
An icon that has an up arrow and a down arrow
|
||||
`,
|
||||
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that has an up arrow and a down arrow`,
|
||||
},
|
||||
});
|
||||
|
||||
export const SIDE_PANEL_VERION = {
|
||||
TITLE: <FormattedMessage
|
||||
id={'explore.map.page.side.panel.version.title'}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,6 @@
|
|||
import {Style} from 'maplibre-gl';
|
||||
|
||||
import {featureURLForTilesetName} from '../components/MapTractLayers/MapTractLayers';
|
||||
import {tribalURL} from '../components/MapTribalLayers/MapTribalLayers';
|
||||
|
||||
import * as constants from '../data/constants';
|
||||
|
||||
// *********** OPEN SOURCE BASE MAP CONSTANTS ***************
|
||||
|
|
@ -29,128 +27,15 @@ const cartoLightBaseLayer = {
|
|||
// *********** OPEN SOURCE STATIC MAP STYLES ***************
|
||||
/**
|
||||
* This function will be called when there is no MapBox token found. This function will
|
||||
* return the open source base map along with styles for the chosen source. We currently
|
||||
* have two sources, either the census tracts or the tribal layer.
|
||||
* return the open source base map along with styles for the chosen source.
|
||||
* *
|
||||
* This function returns a Style in accordance to JSON spec of MapBox
|
||||
* https://docs.mapbox.com/mapbox-gl-js/style-spec/
|
||||
*
|
||||
* @param {boolean} censusSelected
|
||||
* @return {Style}
|
||||
*/
|
||||
export const getOSBaseMap = (
|
||||
censusSelected: boolean,
|
||||
) : Style => {
|
||||
return !censusSelected ? {
|
||||
|
||||
/**
|
||||
* Tribal Source
|
||||
*/
|
||||
'version': 8,
|
||||
|
||||
/**
|
||||
* Map Sources
|
||||
* */
|
||||
'sources': {
|
||||
|
||||
/**
|
||||
* The base map source source allows us to define where the tiles can be fetched from.
|
||||
*/
|
||||
[constants.BASE_MAP_SOURCE_NAME]: {
|
||||
'type': 'raster',
|
||||
'tiles': cartoLightBaseLayer.noLabels,
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* Tribal source
|
||||
*/
|
||||
[constants.TRIBAL_SOURCE_NAME]: {
|
||||
'type': 'vector',
|
||||
'promoteId': constants.TRIBAL_ID,
|
||||
'tiles': [tribalURL()],
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
// The labels source:
|
||||
'labels': {
|
||||
'type': 'raster',
|
||||
'tiles': cartoLightBaseLayer.labelsOnly,
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Tribal Layers
|
||||
*/
|
||||
'layers': [
|
||||
|
||||
// The baseMapLayer
|
||||
{
|
||||
'id': constants.BASE_MAP_LAYER_ID,
|
||||
'source': constants.BASE_MAP_SOURCE_NAME,
|
||||
'type': 'raster',
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* Tribal layer
|
||||
*/
|
||||
{
|
||||
'id': constants.TRIBAL_LAYER_ID,
|
||||
'source': constants.TRIBAL_SOURCE_NAME,
|
||||
'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'fill-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
},
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* Tribal layer - controls the border between features
|
||||
*/
|
||||
{
|
||||
'id': constants.FEATURE_BORDER_LAYER_ID,
|
||||
'source': constants.TRIBAL_SOURCE_NAME,
|
||||
'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
'type': 'line',
|
||||
'paint': {
|
||||
'line-color': constants.FEATURE_BORDER_COLOR,
|
||||
'line-width': constants.FEATURE_BORDER_WIDTH,
|
||||
'line-opacity': constants.FEATURE_BORDER_OPACITY},
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* Alaska layer
|
||||
*/
|
||||
{
|
||||
'id': constants.TRIBAL_ALASKA_POINTS_LAYER_ID,
|
||||
'source': constants.TRIBAL_SOURCE_NAME,
|
||||
'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
'type': 'circle',
|
||||
'filter': ['==', ['geometry-type'], 'Point'],
|
||||
'paint': {
|
||||
'circle-radius': constants.TRIBAL_ALASKA_CIRCLE_RADIUS,
|
||||
'circle-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'circle-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
'circle-stroke-color': constants.FEATURE_BORDER_COLOR,
|
||||
'circle-stroke-width': constants.ALAKSA_POINTS_STROKE_WIDTH,
|
||||
'circle-stroke-opacity': constants.FEATURE_BORDER_OPACITY,
|
||||
},
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
},
|
||||
],
|
||||
} :
|
||||
{
|
||||
export const getOSBaseMap = (): Style => {
|
||||
return {
|
||||
'version': 8,
|
||||
|
||||
/**
|
||||
|
|
|
|||
111
client/src/data/tribalToggleLayerOSMap.tsx
Normal file
111
client/src/data/tribalToggleLayerOSMap.tsx
Normal file
|
|
@ -0,0 +1,111 @@
|
|||
/**
|
||||
* This file holds the tribal layer styling for the OS map in case we want to add the toggle back.
|
||||
*/
|
||||
// const tribal:any = {
|
||||
// /**
|
||||
// * Tribal Source
|
||||
// */
|
||||
// 'version': 8,
|
||||
|
||||
// /**
|
||||
// * Map Sources
|
||||
// * */
|
||||
// 'sources': {
|
||||
|
||||
// /**
|
||||
// * The base map source source allows us to define where the tiles can be fetched from.
|
||||
// */
|
||||
// [constants.BASE_MAP_SOURCE_NAME]: {
|
||||
// 'type': 'raster',
|
||||
// 'tiles': cartoLightBaseLayer.noLabels,
|
||||
// 'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
// },
|
||||
|
||||
// /**
|
||||
// * Tribal source
|
||||
// */
|
||||
// [constants.TRIBAL_SOURCE_NAME]: {
|
||||
// 'type': 'vector',
|
||||
// 'promoteId': constants.TRIBAL_ID,
|
||||
// 'tiles': [tribalURL()],
|
||||
// 'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
// },
|
||||
|
||||
// // The labels source:
|
||||
// 'labels': {
|
||||
// 'type': 'raster',
|
||||
// 'tiles': cartoLightBaseLayer.labelsOnly,
|
||||
// },
|
||||
// },
|
||||
|
||||
|
||||
// /**
|
||||
// * Tribal Layers
|
||||
// */
|
||||
// 'layers': [
|
||||
|
||||
// // The baseMapLayer
|
||||
// {
|
||||
// 'id': constants.BASE_MAP_LAYER_ID,
|
||||
// 'source': constants.BASE_MAP_SOURCE_NAME,
|
||||
// 'type': 'raster',
|
||||
// 'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
// },
|
||||
|
||||
// /**
|
||||
// * Tribal layer
|
||||
// */
|
||||
// {
|
||||
// 'id': constants.TRIBAL_LAYER_ID,
|
||||
// 'source': constants.TRIBAL_SOURCE_NAME,
|
||||
// 'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
// 'type': 'fill',
|
||||
// 'paint': {
|
||||
// 'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
// 'fill-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
// },
|
||||
// 'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
// },
|
||||
|
||||
// /**
|
||||
// * Tribal layer - controls the border between features
|
||||
// */
|
||||
// {
|
||||
// 'id': constants.FEATURE_BORDER_LAYER_ID,
|
||||
// 'source': constants.TRIBAL_SOURCE_NAME,
|
||||
// 'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
// 'type': 'line',
|
||||
// 'paint': {
|
||||
// 'line-color': constants.FEATURE_BORDER_COLOR,
|
||||
// 'line-width': constants.FEATURE_BORDER_WIDTH,
|
||||
// 'line-opacity': constants.FEATURE_BORDER_OPACITY},
|
||||
// 'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
// },
|
||||
|
||||
// /**
|
||||
// * Alaska layer
|
||||
// */
|
||||
// {
|
||||
// 'id': constants.TRIBAL_ALASKA_POINTS_LAYER_ID,
|
||||
// 'source': constants.TRIBAL_SOURCE_NAME,
|
||||
// 'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
// 'type': 'circle',
|
||||
// 'filter': ['==', ['geometry-type'], 'Point'],
|
||||
// 'paint': {
|
||||
// 'circle-radius': constants.TRIBAL_ALASKA_CIRCLE_RADIUS,
|
||||
// 'circle-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
// 'circle-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
// 'circle-stroke-color': constants.FEATURE_BORDER_COLOR,
|
||||
// 'circle-stroke-width': constants.ALAKSA_POINTS_STROKE_WIDTH,
|
||||
// 'circle-stroke-opacity': constants.FEATURE_BORDER_OPACITY,
|
||||
// },
|
||||
// 'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
// 'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
// },
|
||||
// ],
|
||||
// };
|
||||
|
|
@ -224,12 +224,8 @@
|
|||
"description": "Navigate to the about page. This is Header navigate item to the public eng page"
|
||||
},
|
||||
"common.pages.header.title.line1": {
|
||||
"defaultMessage": "Climate and Economic Justice",
|
||||
"description": "Navigate to the about page. This is Title in nav header line 1 of 2"
|
||||
},
|
||||
"common.pages.header.title.line2": {
|
||||
"defaultMessage": "Screening Tool",
|
||||
"description": "Navigate to the about page. This is Title in nav header line 2 of 2"
|
||||
"defaultMessage": "Climate and Economic Justice Screening Tool",
|
||||
"description": "Navigate to the about page. This is Title in nav header"
|
||||
},
|
||||
"common.pages.header.tsd": {
|
||||
"defaultMessage": "Technical Support Document",
|
||||
|
|
@ -903,50 +899,98 @@
|
|||
"defaultMessage": "Projected wildfire risk",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show wildfire risk"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon1": {
|
||||
"defaultMessage": "An icon that has depicts pieces of a block selected mimicking the census block census tracts",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first icon in this side panel"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon2": {
|
||||
"explore.map.page.side.panel.info.alt.text.icon.bell": {
|
||||
"defaultMessage": "An icon that a bell curve or gaussian distribution",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the second icon in this side panel"
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that a bell curve or gaussian distribution"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon3": {
|
||||
"explore.map.page.side.panel.info.alt.text.icon.dac.circle": {
|
||||
"defaultMessage": "a blue circle icon informing the user of what a disadvantaged community is depicted as",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a blue circle icon informing the user of what a disadvantaged community is depicted as"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.locate": {
|
||||
"defaultMessage": "a gps icon informing the user can locate",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a gps icon informing the user can locate"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.mouse": {
|
||||
"defaultMessage": "a mouse arrow icon informing the user can use the mouse",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a mouse arrow icon informing the user can use the mouse"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.pie": {
|
||||
"defaultMessage": "An icon that depicts a part of pie chart being removed",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the third icon in this side panel"
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that depicts a part of pie chart being removed"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon4": {
|
||||
"explore.map.page.side.panel.info.alt.text.icon.plus": {
|
||||
"defaultMessage": "a plus icon indicating that the user can zoom in *",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a plus icon indicating that the user can zoom in"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.search": {
|
||||
"defaultMessage": "a magnifying glass icon informing the user can search",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a magnifying glass icon informing the user can search"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.tract": {
|
||||
"defaultMessage": "a tract icon informing the user of census tracts",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show a tract icon informing the user of census tracts"
|
||||
},
|
||||
"explore.map.page.side.panel.info.alt.text.icon.up.arrow": {
|
||||
"defaultMessage": "An icon that has an up arrow and a down arrow",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the forth icon in this side panel"
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show An icon that has an up arrow and a down arrow"
|
||||
},
|
||||
"explore.map.page.side.panel.info.heading1": {
|
||||
"defaultMessage": "Zoom in or search and select to see data about any census tract of interest",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first paragraph of this side panel"
|
||||
"defaultMessage": "How to use the map:",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the first heading of the non-selected side panel"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para1": {
|
||||
"defaultMessage": "This tool identifies communities that are marginalized, underserved, and overburdened by pollution. These communities are located in census tracts that are at or above the thresholds in one or more of eight categories of criteria.",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the first paragraph of this side panel"
|
||||
"explore.map.page.side.panel.info.heading2": {
|
||||
"defaultMessage": "Things to know:",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know:"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para2": {
|
||||
"defaultMessage": "The tool uses census tracts that represent about 4,000 people, which is the smallest unit of geography for which consistent data can be displayed on the map.",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the second paragraph of this side panel"
|
||||
"explore.map.page.side.panel.info.para.1.part.1": {
|
||||
"defaultMessage": "Zoom in",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Zoom in"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para3": {
|
||||
"defaultMessage": "The tool ranks each census tract using percentiles that show how much burden each tract experiences relative to all other tracts, for each criterion.",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the third paragraph of this side panel"
|
||||
"explore.map.page.side.panel.info.para.1.part.2": {
|
||||
"defaultMessage": ", or locate yourself",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show or locate yourself"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para4": {
|
||||
"defaultMessage": "Percentages are used for certain variables, i.e. those relating to high school achievement rate and to the share of individuals not currently enrolled in higher education.",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the forth paragraph of this side panel"
|
||||
"explore.map.page.side.panel.info.para.1.part.4": {
|
||||
"defaultMessage": "and select",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show and select"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.1.part.5": {
|
||||
"defaultMessage": "to see information about any census tract",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show to see information about any census tract"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.2.part.1": {
|
||||
"defaultMessage": "The tool uses census tracts",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show The tool uses census tracts"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.2.part.2": {
|
||||
"defaultMessage": ". Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation.",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Census tracts are a small unit of geography. They make it possible to display data consistenly across the nation."
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.3.part.1": {
|
||||
"defaultMessage": "Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Communities that are disadvantaged live in tracts that experience burdens. These tracts are highlighted in a blueish gray color"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.3.part.2": {
|
||||
"defaultMessage": "on the map. This color is an opacity. This is so information about the map can be seen.",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show on the map. This color is an opacity. This is so information about the map can be seen."
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.4.part.1": {
|
||||
"defaultMessage": "The tool uses percentiles",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show The tool uses percentiles"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.4.part.2": {
|
||||
"defaultMessage": ", percentages",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show percentages"
|
||||
},
|
||||
"explore.map.page.side.panel.info.para.4.part.3": {
|
||||
"defaultMessage": ", or a simple yes/no to indicate how much burden the communities are experiencing in each tract.",
|
||||
"description": "`Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show or a simple yes/no to indicate how much burden the communities are experiencing in each tract."
|
||||
},
|
||||
"explore.map.page.side.panel.info.para5": {
|
||||
"defaultMessage": "Thresholds for each category determine if a tract should be identified as disadvantaged because it has exceeded a certain value for the relevant indicators.",
|
||||
"defaultMessage": "The tool also uses thresholds. If the tract meets or exceeds the threshold of any climate, environmental, or other burden <bold>AND</bold> it meets the threshold for the associated socioeconomic burden, then communites in the tract are considered disadvantaged.",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Things to know, this is the fifth paragraph of this side pane"
|
||||
},
|
||||
"explore.map.page.side.panel.info.title": {
|
||||
"defaultMessage": "Things to know",
|
||||
"description": "introductory text of ways to use the map"
|
||||
},
|
||||
"explore.map.page.side.panel.is.community.of.focus": {
|
||||
"defaultMessage": "Identified as disadvantaged?",
|
||||
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show asking IF the communities is focused on"
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import AboutCard from '../components/AboutCard/AboutCard';
|
|||
import AboutCardsContainer from '../components/AboutCard/AboutCardsContainer';
|
||||
import J40MainGridContainer from '../components/J40MainGridContainer';
|
||||
import Layout from '../components/layout';
|
||||
import PublicEngageButton from '../components/PublicEngageButton';
|
||||
|
||||
import * as ABOUT_COPY from '../data/copy/about';
|
||||
import * as COMMON_COPY from '../data/copy/common';
|
||||
|
|
@ -42,7 +41,6 @@ const AboutPage = ({location}: IAboutPageProps) => {
|
|||
|
||||
<section className={'page-heading'}>
|
||||
<h1 data-cy={'about-page-heading'}>{intl.formatMessage(ABOUT_COPY.PAGE.HEADING)}</h1>
|
||||
<PublicEngageButton />
|
||||
</section>
|
||||
|
||||
{/* Section 1 */}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ import J40MainGridContainer from '../components/J40MainGridContainer';
|
|||
import Layout from '../components/layout';
|
||||
import LinkTypeWrapper from '../components/LinkTypeWrapper';
|
||||
import RequestForInfo from '../components/RequestForInfo';
|
||||
import PublicEngageButton from '../components/PublicEngageButton';
|
||||
|
||||
import * as CONTACT_COPY from '../data/copy/contact';
|
||||
import * as COMMON_COPY from '../data/copy/common';
|
||||
|
|
@ -24,7 +23,6 @@ const ContactPage = ({location}: IContactPageProps) => {
|
|||
|
||||
<section className={'page-heading'}>
|
||||
<h1>{intl.formatMessage(CONTACT_COPY.PAGE_INTRO.PAGE_HEADING)}</h1>
|
||||
<PublicEngageButton />
|
||||
</section>
|
||||
|
||||
<Grid row gap={6}>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ import {useIntl} from 'gatsby-plugin-intl';
|
|||
|
||||
import J40MainGridContainer from '../components/J40MainGridContainer';
|
||||
import Layout from '../components/layout';
|
||||
import PublicEngageButton from '../components/PublicEngageButton';
|
||||
import SubPageNav from '../components/SubPageNav';
|
||||
import {useWindowSize} from 'react-use';
|
||||
|
||||
|
|
@ -25,7 +24,6 @@ const DownloadsPage = ({location}: IDownloadsPageProps) => {
|
|||
|
||||
<section className={'page-heading'}>
|
||||
<h1>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING1)}</h1>
|
||||
<PublicEngageButton />
|
||||
</section>
|
||||
|
||||
<Grid row gap className={'j40-mb5-mt3'}>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ import HowYouCanHelp from '../components/HowYouCanHelp';
|
|||
import J40MainGridContainer from '../components/J40MainGridContainer';
|
||||
import Layout from '../components/layout';
|
||||
import MapWrapper from '../components/MapWrapper';
|
||||
import PublicEngageButton from '../components/PublicEngageButton';
|
||||
|
||||
import * as EXPLORE_COPY from '../data/copy/explore';
|
||||
|
||||
|
|
@ -26,7 +25,6 @@ const ExporeToolPage = ({location}: IMapPageProps) => {
|
|||
|
||||
<section className={'page-heading'}>
|
||||
<h1>{intl.formatMessage(EXPLORE_COPY.PAGE_INTRO.PAGE_HEADING)}</h1>
|
||||
<PublicEngageButton />
|
||||
</section>
|
||||
|
||||
<Grid row gap className={'j40-mb5-mt3'}>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import DatasetContainer from '../components/DatasetContainer';
|
|||
import J40MainGridContainer from '../components/J40MainGridContainer';
|
||||
import MethodologyFormula from '../components/MethodologyFormula';
|
||||
import Layout from '../components/layout';
|
||||
import PublicEngageButton from '../components/PublicEngageButton';
|
||||
import SubPageNav from '../components/SubPageNav';
|
||||
import {useWindowSize} from 'react-use';
|
||||
|
||||
|
|
@ -29,7 +28,6 @@ const IndexPage = ({location}: MethodPageProps) => {
|
|||
|
||||
<section className={'page-heading'}>
|
||||
<h1>{intl.formatMessage(METHODOLOGY_COPY.PAGE.HEADING)}</h1>
|
||||
<PublicEngageButton />
|
||||
</section>
|
||||
|
||||
<Grid row gap className={'j40-mb5-mt3'}>
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -348,27 +342,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
>
|
||||
About
|
||||
</h1>
|
||||
<div>
|
||||
<a
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
<button
|
||||
class="usa-button"
|
||||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<img
|
||||
alt="an icon that represents a calendar"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
<div>
|
||||
Public engagement
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="grid-row grid-gap-lg j40-aboutcard-container "
|
||||
|
|
@ -607,6 +580,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="j40-aboutcard-sm-link"
|
||||
>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/methodology"
|
||||
>
|
||||
Methodology & data
|
||||
|
|
@ -661,6 +635,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="j40-aboutcard-sm-link"
|
||||
>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/"
|
||||
>
|
||||
Explore the map
|
||||
|
|
@ -888,7 +863,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -346,27 +340,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
<h1>
|
||||
Contact
|
||||
</h1>
|
||||
<div>
|
||||
<a
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
<button
|
||||
class="usa-button"
|
||||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<img
|
||||
alt="an icon that represents a calendar"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
<div>
|
||||
Public engagement
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="grid-row grid-gap-6"
|
||||
|
|
@ -400,6 +373,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
To provide feedback about a specific census tract, either select the send feedback button after
|
||||
selecting a census tract on the
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/"
|
||||
>
|
||||
Explore the map
|
||||
|
|
@ -535,7 +509,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -346,27 +340,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
<h1>
|
||||
Downloads
|
||||
</h1>
|
||||
<div>
|
||||
<a
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
<button
|
||||
class="usa-button"
|
||||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<img
|
||||
alt="an icon that represents a calendar"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
<div>
|
||||
Public engagement
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="grid-row grid-gap j40-mb5-mt3"
|
||||
|
|
@ -386,6 +359,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
|
||||
|
||||
<a
|
||||
class="usa-link"
|
||||
download=""
|
||||
href="//"
|
||||
>
|
||||
|
|
@ -400,6 +374,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="usa-link"
|
||||
download=""
|
||||
href="//"
|
||||
>
|
||||
|
|
@ -413,6 +388,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="usa-link"
|
||||
download=""
|
||||
href="//"
|
||||
>
|
||||
|
|
@ -533,7 +509,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -428,7 +422,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -346,27 +340,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
<h1>
|
||||
Methodology
|
||||
</h1>
|
||||
<div>
|
||||
<a
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
<button
|
||||
class="usa-button"
|
||||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<img
|
||||
alt="an icon that represents a calendar"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
<div>
|
||||
Public engagement
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="grid-row grid-gap j40-mb5-mt3"
|
||||
|
|
@ -471,18 +444,21 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-agr-loss-rate"
|
||||
>
|
||||
expected agriculture loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-bld-loss-rate"
|
||||
>
|
||||
expected building loss rate
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#exp-pop-loss-rate"
|
||||
>
|
||||
expected population loss rate
|
||||
|
|
@ -496,12 +472,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -530,12 +508,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#energy-burden"
|
||||
>
|
||||
energy burden
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#pm-25"
|
||||
>
|
||||
PM2.5 in the air
|
||||
|
|
@ -549,12 +529,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -585,12 +567,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#diesel-pm"
|
||||
>
|
||||
diesel particulate matter exposure
|
||||
</a>
|
||||
or
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#traffic-vol"
|
||||
>
|
||||
traffic proximity and volume
|
||||
|
|
@ -606,12 +590,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -640,18 +626,21 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#lead-paint"
|
||||
>
|
||||
lead paint
|
||||
</a>
|
||||
AND
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#median-home"
|
||||
>
|
||||
median home value
|
||||
</a>
|
||||
is at or less than the 90th percentile OR at or above the 90th percentile for the
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#house-burden"
|
||||
>
|
||||
housing cost burden
|
||||
|
|
@ -665,12 +654,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -699,18 +690,21 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-haz"
|
||||
>
|
||||
proximity to hazardous waste facilities
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-npl"
|
||||
>
|
||||
proximity to National Priorities List (NPL) sites
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#prox-rmp"
|
||||
>
|
||||
proximity to Risk Management Plan (RMP) facilities
|
||||
|
|
@ -724,12 +718,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -758,6 +754,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#waste-water"
|
||||
>
|
||||
wastewater discharge
|
||||
|
|
@ -771,12 +768,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -805,24 +804,28 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#asthma"
|
||||
>
|
||||
asthma
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#diabetes"
|
||||
>
|
||||
diabetes
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#heart-disease"
|
||||
>
|
||||
heart disease
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#life-exp"
|
||||
>
|
||||
low life expectancy
|
||||
|
|
@ -836,12 +839,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
is at or above the 65th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-income"
|
||||
>
|
||||
low income
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -870,24 +875,28 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
at or above the 90th percentile for
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#low-med-inc"
|
||||
>
|
||||
low median income
|
||||
</a>
|
||||
as a percentage of area median income OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#ling-iso"
|
||||
>
|
||||
linguistic isolation
|
||||
</a>
|
||||
OR
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#unemploy"
|
||||
>
|
||||
unemployment
|
||||
</a>
|
||||
OR percentage of individuals in households at or below 100% Federal
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#poverty"
|
||||
>
|
||||
poverty
|
||||
|
|
@ -901,12 +910,14 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</strong>
|
||||
10% or more of adults 25 or older have not attained a
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-school"
|
||||
>
|
||||
high school degree
|
||||
</a>
|
||||
AND 80% or more of individuals 15 or older are not enrolled in
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#high-ed-enroll-rate"
|
||||
>
|
||||
higher education
|
||||
|
|
@ -2292,6 +2303,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</div>
|
||||
<div>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="/en/methodology"
|
||||
>
|
||||
Return to top
|
||||
|
|
@ -2377,7 +2389,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -1026,7 +1020,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
|
|
@ -146,11 +146,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -194,17 +196,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="grid"
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
Climate and Economic Justice
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
Screening Tool
|
||||
</div>
|
||||
<div>
|
||||
BETA
|
||||
</div>
|
||||
</div>
|
||||
Climate and Economic Justice Screening Tool
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -315,11 +307,13 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
src="test-file-stub"
|
||||
/>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
English
|
||||
</a>
|
||||
<a
|
||||
class="usa-link"
|
||||
href="#"
|
||||
>
|
||||
Español
|
||||
|
|
@ -428,7 +422,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="usa-footer__secondary-link"
|
||||
>
|
||||
<a
|
||||
class="footer-link-first-child"
|
||||
class="usa-link footer-link-first-child"
|
||||
href="/en/public-engagement"
|
||||
>
|
||||
Engagement calendar
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue