mirror of
https://github.com/DOI-DO/j40-cejst-2.git
synced 2025-02-22 17:44:20 -08:00
Update Download sidebar, add new alert (#1587)
* Update Download sidebar, add new alert - Fixes #1567 - Cleaned up styles related to buttons. - Refactored buttons a little to make easier to maintain. - Updated test snapshots/translation files * Fixes * More text fixes
This commit is contained in:
parent
5b5d6051a8
commit
6ab7d76fdb
17 changed files with 525 additions and 124 deletions
|
@ -207,6 +207,32 @@
|
|||
"value": "About"
|
||||
}
|
||||
],
|
||||
"common.pages.alerts.additional_docs_available.description": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "Download new technical support and other documentation and "
|
||||
},
|
||||
{
|
||||
"children": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "send feedback"
|
||||
}
|
||||
],
|
||||
"type": 8,
|
||||
"value": "link2"
|
||||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": "."
|
||||
}
|
||||
],
|
||||
"common.pages.alerts.additional_docs_available.title": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "Additional documentation now available"
|
||||
}
|
||||
],
|
||||
"common.pages.alerts.public_comment_period.description": [
|
||||
{
|
||||
"type": 0,
|
||||
|
@ -2596,9 +2622,19 @@
|
|||
}
|
||||
],
|
||||
"methodology.page.downloadPacket.header.text": [
|
||||
{
|
||||
"children": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "Files available for download"
|
||||
"value": "NEW"
|
||||
}
|
||||
],
|
||||
"type": 8,
|
||||
"value": "callout"
|
||||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": " files available for download"
|
||||
}
|
||||
],
|
||||
"methodology.page.downloadPacket.info.shape.last.updated": [
|
||||
|
@ -2614,7 +2650,21 @@
|
|||
"methodology.page.downloadPacket.info.text1": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "Download the data sources used in the CEJST (.csv and .xlsx, "
|
||||
"value": "Download the data sources used in the CEJST (.csv, .xlxs, "
|
||||
},
|
||||
{
|
||||
"children": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": ".pdf"
|
||||
}
|
||||
],
|
||||
"type": 8,
|
||||
"value": "callout"
|
||||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": " that describes how to use the list, and a codebook, "
|
||||
},
|
||||
{
|
||||
"type": 1,
|
||||
|
@ -2622,7 +2672,21 @@
|
|||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": " unzipped), the shapefile, along with a codebook (.zip, "
|
||||
"value": " unzipped), the shapefile, along with a "
|
||||
},
|
||||
{
|
||||
"children": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "codebook"
|
||||
}
|
||||
],
|
||||
"type": 8,
|
||||
"value": "callout"
|
||||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": " (.zip, "
|
||||
},
|
||||
{
|
||||
"type": 1,
|
||||
|
@ -2638,7 +2702,7 @@
|
|||
},
|
||||
{
|
||||
"type": 0,
|
||||
"value": ")."
|
||||
"value": " unzipped)."
|
||||
}
|
||||
],
|
||||
"methodology.page.downloadPacket.info.tsd.last.updated": [
|
||||
|
@ -2673,6 +2737,18 @@
|
|||
"value": "boldtag"
|
||||
}
|
||||
],
|
||||
"methodology.page.downloadPacket.updated.tag.text": [
|
||||
{
|
||||
"children": [
|
||||
{
|
||||
"type": 0,
|
||||
"value": "Updated"
|
||||
}
|
||||
],
|
||||
"type": 8,
|
||||
"value": "boldtag"
|
||||
}
|
||||
],
|
||||
"methodology.page.formula.first": [
|
||||
{
|
||||
"children": [
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React from 'react';
|
||||
import React, {FC} from 'react';
|
||||
import {Button, Grid, Tag} from '@trussworks/react-uswds';
|
||||
|
||||
import * as styles from './downloadPacket.module.scss';
|
||||
|
@ -8,6 +8,24 @@ import * as METHODOLOGY_COPY from '../../data/copy/methodology';
|
|||
import downloadIcon from '/node_modules/uswds/dist/img/usa-icons/file_download.svg';
|
||||
|
||||
const DownloadPacket = () => {
|
||||
// inline components to make build layout below more readable
|
||||
const UpdateTag = () => <div className={styles.tagContainer}><Tag
|
||||
className={styles.updateTag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.UPDATED_TAG}</Tag></div>;
|
||||
|
||||
const NewTag = () => <div className={styles.tagContainer}>
|
||||
<Tag className={styles.newTag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag></div>;
|
||||
|
||||
const DownloadButton: FC = ({children}) =>
|
||||
<Button className={styles.downloadBoxButton} type="button">
|
||||
<span className={styles.downloadButtonIconSpan}>
|
||||
<img src={downloadIcon} className={styles.downloadButtonIcon}
|
||||
alt={'download icon for download package'} />
|
||||
</span>
|
||||
<span className={styles.downloadButtonText} >
|
||||
{children}
|
||||
</span>
|
||||
</Button>;
|
||||
|
||||
return (
|
||||
<Grid>
|
||||
<div className={styles.downloadBoxContainer}>
|
||||
|
@ -20,23 +38,17 @@ const DownloadPacket = () => {
|
|||
</div>
|
||||
|
||||
{/* Download box description 1 */}
|
||||
<div className={styles.dataSourceText}>
|
||||
<div className={styles.downloadSourceText}>
|
||||
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.DESCRIPTION1}
|
||||
</div>
|
||||
|
||||
{/* Download box button 1 */}
|
||||
<div className={styles.dataSourceButtonContainer}>
|
||||
<div className={styles.downloadButtonContainer}>
|
||||
<UpdateTag/>
|
||||
<a data-cy={'download-link'}
|
||||
download
|
||||
href={METHODOLOGY_COPY.DOWNLOAD_ZIP_URL}>
|
||||
<Button className={styles.downloadBoxButton} type="button">
|
||||
<div>
|
||||
<img src={downloadIcon} alt={'download icon for download package'}/>
|
||||
</div>
|
||||
<div className={styles.dataSourceButtonText}>
|
||||
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT1}
|
||||
</div>
|
||||
</Button>
|
||||
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT1}</DownloadButton>
|
||||
</a>
|
||||
</div>
|
||||
<div className={styles.lastUpdated}>
|
||||
|
@ -45,21 +57,12 @@ const DownloadPacket = () => {
|
|||
|
||||
|
||||
{/* Download box button 2 */}
|
||||
<div className={styles.shapefileButtonContainer}>
|
||||
<div className={styles.newTagContainer}>
|
||||
<Tag className={styles.newtag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag>
|
||||
</div>
|
||||
<div className={styles.downloadButtonContainer}>
|
||||
<UpdateTag/>
|
||||
<a data-cy={'shapefile-link'}
|
||||
download
|
||||
href={METHODOLOGY_COPY.DOWNLOAD_SHAPEFILE_URL}>
|
||||
<Button className={styles.downloadBoxButton} type="button">
|
||||
<div>
|
||||
<img src={downloadIcon} alt={'download icon for download package'}/>
|
||||
</div>
|
||||
<div className={styles.shapeFileButtonText}>
|
||||
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT2}
|
||||
</div>
|
||||
</Button>
|
||||
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT2}</DownloadButton>
|
||||
</a>
|
||||
</div>
|
||||
<div className={styles.lastUpdated}>
|
||||
|
@ -67,30 +70,20 @@ const DownloadPacket = () => {
|
|||
</div>
|
||||
|
||||
{/* Download box button 3 */}
|
||||
<div className={styles.shapefileButtonContainer}>
|
||||
<div className={styles.newTagContainer}>
|
||||
<Tag className={styles.newtag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag>
|
||||
</div>
|
||||
<div className={styles.downloadButtonContainer}>
|
||||
<NewTag/>
|
||||
{/* target and rel required since PDFs open in browser and don't download */}
|
||||
<a data-cy={'shapefile-link'}
|
||||
<a data-cy={'tsd-link'}
|
||||
download
|
||||
target={'_blank'}
|
||||
rel={'noreferrer'}
|
||||
href={METHODOLOGY_COPY.DOWNLOAD_TSD_URL}>
|
||||
<Button className={styles.downloadBoxButton} type="button">
|
||||
<div>
|
||||
<img src={downloadIcon} alt={'download icon for download package'}/>
|
||||
</div>
|
||||
<div className={styles.shapeFileButtonText}>
|
||||
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT3}
|
||||
</div>
|
||||
</Button>
|
||||
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT3}</DownloadButton>
|
||||
</a>
|
||||
</div>
|
||||
<div className={styles.lastUpdated}>
|
||||
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.TSD_LAST_UPDATED}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -10,12 +10,33 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
<div>
|
||||
<div>
|
||||
<div>
|
||||
Files available for download
|
||||
<span>
|
||||
NEW
|
||||
</span>
|
||||
files available for download
|
||||
</div>
|
||||
<div>
|
||||
Download the data sources used in the CEJST (.csv and .xlsx, 52MB unzipped), the shapefile, along with a codebook (.zip, 742MB unzipped) or the technical support document (.pdf, 913kB).
|
||||
Download the data sources used in the CEJST (.csv, .xlxs,
|
||||
<span>
|
||||
.pdf
|
||||
</span>
|
||||
that describes how to use the list, and a codebook, 53MB unzipped), the shapefile, along with a
|
||||
<span>
|
||||
codebook
|
||||
</span>
|
||||
(.zip, 742MB unzipped) or the technical support document (.pdf, 2.5MB unzipped).
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<span
|
||||
class="usa-tag"
|
||||
data-testid="tag"
|
||||
>
|
||||
<strong>
|
||||
Updated
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
<a
|
||||
data-cy="download-link"
|
||||
download=""
|
||||
|
@ -26,20 +47,20 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download data sources
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
Last updated: 04/06/22
|
||||
Last updated: 04/26/22
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -48,7 +69,7 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
data-testid="tag"
|
||||
>
|
||||
<strong>
|
||||
NEW
|
||||
Updated
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
|
@ -62,20 +83,20 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download shapefile
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
Last updated: 04/06/22
|
||||
Last updated: 04/26/22
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -89,7 +110,7 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
</span>
|
||||
</div>
|
||||
<a
|
||||
data-cy="shapefile-link"
|
||||
data-cy="tsd-link"
|
||||
download=""
|
||||
href="//"
|
||||
rel="noreferrer"
|
||||
|
@ -100,15 +121,15 @@ exports[`download packet component defined checks if component renders 1`] = `
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download technical support document
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -47,9 +47,8 @@
|
|||
@include u-text('semibold');
|
||||
}
|
||||
|
||||
// Data source text
|
||||
.dataSourceText {
|
||||
@include baseTextStyle();
|
||||
.downloadSourceText {
|
||||
@include u-margin-top(2);
|
||||
}
|
||||
|
||||
// Last updated
|
||||
|
@ -59,32 +58,28 @@
|
|||
@include u-margin-top(1);
|
||||
}
|
||||
|
||||
// Data source button
|
||||
.dataSourceButtonContainer {
|
||||
@include baseButtonContainerStyles();
|
||||
|
||||
.dataSourceButtonText {
|
||||
@include baseButtonTextStyle();
|
||||
}
|
||||
}
|
||||
|
||||
// Shapefile text
|
||||
.shapeFileText {
|
||||
@include baseTextStyle();
|
||||
@include u-margin-top(7);
|
||||
}
|
||||
// Shapefile button
|
||||
.shapefileButtonContainer{
|
||||
// Data source button (scoped)
|
||||
.downloadButtonContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@include baseButtonContainerStyles();
|
||||
text-align: center;
|
||||
|
||||
.shapeFileButtonText {
|
||||
.downloadButtonText {
|
||||
@include baseButtonTextStyle();
|
||||
@include u-margin-right(3);
|
||||
}
|
||||
@include u-margin-right(1);
|
||||
}
|
||||
|
||||
.downloadButtonIconSpan {
|
||||
display: contents;
|
||||
max-width: 1.5em;
|
||||
}
|
||||
|
||||
.downloadButtonIcon {
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -93,15 +88,27 @@
|
|||
@include u-bg('white');
|
||||
@include u-color('blue-80v');
|
||||
display: flex;
|
||||
width: 16em;
|
||||
}
|
||||
|
||||
.newTagContainer {
|
||||
.tagContainer {
|
||||
align-self: end;
|
||||
@include u-margin-bottom(-1);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.newtag {
|
||||
@include u-text("blue-70v");
|
||||
@include u-bg("yellow-20v");
|
||||
.newTag {
|
||||
@include u-text('bold');
|
||||
@include u-text("blue-80v");
|
||||
@include u-bg("gold-20v");
|
||||
}
|
||||
|
||||
.updateTag {
|
||||
@include u-text('bold');
|
||||
@include u-text("blue-80v");
|
||||
@include u-bg("gray-10");
|
||||
}
|
||||
|
||||
.newCalloutFontColor {
|
||||
@include u-text("gold-20v");
|
||||
}
|
||||
|
|
|
@ -4,15 +4,16 @@ declare namespace DownloadPacketModuleScssNamespace {
|
|||
downloadBox: string;
|
||||
downloadBoxTextBox: string;
|
||||
downloadBoxTitle: string;
|
||||
dataSourceText: string;
|
||||
dataSourceButtonContainer: string;
|
||||
shapefileButtonContainer: string;
|
||||
downloadSourceText: string;
|
||||
downloadButtonContainer: string;
|
||||
downloadBoxButton: string;
|
||||
dataSourceButtonText: string;
|
||||
shapeFileText: string;
|
||||
shapeFileButtonText: string;
|
||||
newTagContainer: string;
|
||||
newtag: string;
|
||||
downloadButtonText: string;
|
||||
downloadButtonIconSpan: string;
|
||||
downloadButtonIcon: string;
|
||||
tagContainer: string;
|
||||
newTag: string;
|
||||
updateTag: string;
|
||||
newCalloutFontColor: string;
|
||||
lastUpdated:string;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -233,6 +233,13 @@ const J40Header = () => {
|
|||
|
||||
{/* Alert */}
|
||||
{isAlertValid && <J40MainGridContainer>
|
||||
<Alert
|
||||
className={styles.alert}
|
||||
type="info"
|
||||
heading={intl.formatMessage(COMMON_COPY.ALERTS.ALERT_2_TITLE.TITLE)}>
|
||||
{COMMON_COPY.ALERTS.ALERT_2_DESCRIPTION}
|
||||
</Alert>
|
||||
|
||||
<Alert
|
||||
className={styles.alert}
|
||||
type="info"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -61,6 +61,22 @@ export const ALERTS = {
|
|||
/>,
|
||||
}}
|
||||
/>,
|
||||
|
||||
ALERT_2_TITLE: defineMessages({
|
||||
TITLE: {
|
||||
id: 'common.pages.alerts.additional_docs_available.title',
|
||||
defaultMessage: 'Additional documentation now available',
|
||||
description: 'Alert title that appears at the top of pages.',
|
||||
},
|
||||
}),
|
||||
ALERT_2_DESCRIPTION: <FormattedMessage
|
||||
id={'common.pages.alerts.additional_docs_available.description'}
|
||||
defaultMessage={`Download new technical support and other documentation and <link2>send feedback</link2>.`}
|
||||
description={`Alert title that appears at the top of pages.`}
|
||||
values={{
|
||||
link2: linkFn(`mailto:${FEEDBACK_EMAIL}`, false, true),
|
||||
}}
|
||||
/>,
|
||||
};
|
||||
|
||||
// Header
|
||||
|
|
|
@ -3,6 +3,7 @@ import React from 'react';
|
|||
import {defineMessages} from 'react-intl';
|
||||
import {FormattedDate, FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
|
||||
import {boldFn, linkFn, simpleLink} from './common';
|
||||
import * as styles from '../../components/DownloadPacket/downloadPacket.module.scss';
|
||||
|
||||
export const PAGE = defineMessages({
|
||||
TILE: {
|
||||
|
@ -72,11 +73,11 @@ export const FORMULA = {
|
|||
};
|
||||
|
||||
// Download Package
|
||||
export const DOWNLOAD_FILE_SIZE = 52;
|
||||
export const DOWNLOAD_FILE_SIZE = 53;
|
||||
export const DOWNLOAD_SHAPE_FILE_SIZE = 742;
|
||||
export const DOWNLOAD_TSD_FILE_SIZE = 913; // in KB
|
||||
export const DOWNLOAD_ZIP_LAST_UPDATED = new Date('4/6/2022').getTime();
|
||||
export const DOWNLOAD_SHAPE_LAST_UPDATED = new Date('4/6/2022').getTime();
|
||||
export const DOWNLOAD_TSD_FILE_SIZE = 2.5;
|
||||
export const DOWNLOAD_ZIP_LAST_UPDATED = new Date('4/26/2022').getTime();
|
||||
export const DOWNLOAD_SHAPE_LAST_UPDATED = new Date('4/26/2022').getTime();
|
||||
export const DOWNLOAD_TSD_LAST_UPDATED = new Date('4/19/2022').getTime();
|
||||
export const VERSION_NUMBER = 0.1;
|
||||
|
||||
|
@ -99,17 +100,23 @@ export const DOWNLOAD_TSD_URL = [
|
|||
process.env.GATSBY_TSD_DOWNLOAD_FILE_PATH,
|
||||
].join('/');
|
||||
|
||||
const newCalloutFontColorFn = (str:string) => <span className={styles.newCalloutFontColor}>{str}</span>;
|
||||
|
||||
export const DOWNLOAD_PACKAGE = {
|
||||
TITLE: <FormattedMessage
|
||||
id={'methodology.page.downloadPacket.header.text'}
|
||||
defaultMessage={`Files available for download`}
|
||||
defaultMessage={`<callout>NEW</callout> files available for download`}
|
||||
description={'Navigate to the methodology page. This is the download packet header text'}
|
||||
values= {{
|
||||
callout: newCalloutFontColorFn,
|
||||
}}
|
||||
/>,
|
||||
DESCRIPTION1: <FormattedMessage
|
||||
id={ 'methodology.page.downloadPacket.info.text1'}
|
||||
defaultMessage= {`Download the data sources used in the CEJST (.csv and .xlsx, {downloadFileSize} unzipped), the shapefile, along with a codebook (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize}).`}
|
||||
defaultMessage= {`Download the data sources used in the CEJST (.csv, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a codebook, {downloadFileSize} unzipped), the shapefile, along with a <callout>codebook</callout> (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize} unzipped).`}
|
||||
description= {'Navigate to the methodology page. This is the download packet info text'}
|
||||
values= {{
|
||||
callout: newCalloutFontColorFn,
|
||||
downloadFileSize: <FormattedNumber
|
||||
value={DOWNLOAD_FILE_SIZE}
|
||||
style="unit"
|
||||
|
@ -125,7 +132,7 @@ export const DOWNLOAD_PACKAGE = {
|
|||
tsdFileSize: <FormattedNumber
|
||||
value={DOWNLOAD_TSD_FILE_SIZE}
|
||||
style="unit"
|
||||
unit="kilobyte"
|
||||
unit="megabyte"
|
||||
unitDisplay="narrow"
|
||||
/>,
|
||||
}}
|
||||
|
@ -192,6 +199,14 @@ export const DOWNLOAD_PACKAGE = {
|
|||
boldtag: boldFn,
|
||||
}}
|
||||
/>,
|
||||
UPDATED_TAG: <FormattedMessage
|
||||
id={ 'methodology.page.downloadPacket.updated.tag.text'}
|
||||
defaultMessage= {`<boldtag>Updated</boldtag>`}
|
||||
description= {'Navigate to the methodology page. This is the update callout tag text that overlaps the button'}
|
||||
values={{
|
||||
boldtag: boldFn,
|
||||
}}
|
||||
/>,
|
||||
};
|
||||
|
||||
export const CATEGORY= {
|
||||
|
|
|
@ -91,6 +91,14 @@
|
|||
"defaultMessage": "About",
|
||||
"description": "Navigate to the About page. This is the about page title text"
|
||||
},
|
||||
"common.pages.alerts.additional_docs_available.description": {
|
||||
"defaultMessage": "Download new technical support and other documentation and <link2>send feedback</link2>.",
|
||||
"description": "Alert title that appears at the top of pages."
|
||||
},
|
||||
"common.pages.alerts.additional_docs_available.title": {
|
||||
"defaultMessage": "Additional documentation now available",
|
||||
"description": "Alert title that appears at the top of pages."
|
||||
},
|
||||
"common.pages.alerts.public_comment_period.description": {
|
||||
"defaultMessage": "The public comment period for <link1>sending feedback</link1> has been extended to {expDate1}.",
|
||||
"description": "Alert body that appears on landing page."
|
||||
|
@ -1212,7 +1220,7 @@
|
|||
"description": "Navigate to the methodology page. This is the download technical support document spreadsheet"
|
||||
},
|
||||
"methodology.page.downloadPacket.header.text": {
|
||||
"defaultMessage": "Files available for download",
|
||||
"defaultMessage": "<callout>NEW</callout> files available for download",
|
||||
"description": "Navigate to the methodology page. This is the download packet header text"
|
||||
},
|
||||
"methodology.page.downloadPacket.info.shape.last.updated": {
|
||||
|
@ -1220,7 +1228,7 @@
|
|||
"description": "Navigate to the methodology page. This is the download packet info last updated"
|
||||
},
|
||||
"methodology.page.downloadPacket.info.text1": {
|
||||
"defaultMessage": "Download the data sources used in the CEJST (.csv and .xlsx, {downloadFileSize} unzipped), the shapefile, along with a codebook (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize}).",
|
||||
"defaultMessage": "Download the data sources used in the CEJST (.csv, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a codebook, {downloadFileSize} unzipped), the shapefile, along with a <callout>codebook</callout> (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize} unzipped).",
|
||||
"description": "Navigate to the methodology page. This is the download packet info text"
|
||||
},
|
||||
"methodology.page.downloadPacket.info.tsd.last.updated": {
|
||||
|
@ -1235,6 +1243,10 @@
|
|||
"defaultMessage": "<boldtag>NEW</boldtag>",
|
||||
"description": "Navigate to the methodology page. This is the new tag text"
|
||||
},
|
||||
"methodology.page.downloadPacket.updated.tag.text": {
|
||||
"defaultMessage": "<boldtag>Updated</boldtag>",
|
||||
"description": "Navigate to the methodology page. This is the update callout tag text that overlaps the button"
|
||||
},
|
||||
"methodology.page.formula.first": {
|
||||
"defaultMessage": "<boldtag>IF</boldtag> the census tract is above the threshold for one or more environmental or climate indicators",
|
||||
"description": "Navigate to the methodology page. This is the first part of the formula used in the methodology"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
@ -447,12 +476,33 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
<div>
|
||||
<div>
|
||||
<div>
|
||||
Files available for download
|
||||
<span>
|
||||
NEW
|
||||
</span>
|
||||
files available for download
|
||||
</div>
|
||||
<div>
|
||||
Download the data sources used in the CEJST (.csv and .xlsx, 52MB unzipped), the shapefile, along with a codebook (.zip, 742MB unzipped) or the technical support document (.pdf, 913kB).
|
||||
Download the data sources used in the CEJST (.csv, .xlxs,
|
||||
<span>
|
||||
.pdf
|
||||
</span>
|
||||
that describes how to use the list, and a codebook, 53MB unzipped), the shapefile, along with a
|
||||
<span>
|
||||
codebook
|
||||
</span>
|
||||
(.zip, 742MB unzipped) or the technical support document (.pdf, 2.5MB unzipped).
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<span
|
||||
class="usa-tag"
|
||||
data-testid="tag"
|
||||
>
|
||||
<strong>
|
||||
Updated
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
<a
|
||||
data-cy="download-link"
|
||||
download=""
|
||||
|
@ -463,20 +513,20 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download data sources
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
Last updated: 04/06/22
|
||||
Last updated: 04/26/22
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -485,7 +535,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="tag"
|
||||
>
|
||||
<strong>
|
||||
NEW
|
||||
Updated
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
|
@ -499,20 +549,20 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download shapefile
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
Last updated: 04/06/22
|
||||
Last updated: 04/26/22
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -526,7 +576,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
</span>
|
||||
</div>
|
||||
<a
|
||||
data-cy="shapefile-link"
|
||||
data-cy="tsd-link"
|
||||
download=""
|
||||
href="//"
|
||||
rel="noreferrer"
|
||||
|
@ -537,15 +587,15 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
data-testid="button"
|
||||
type="button"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<img
|
||||
alt="download icon for download package"
|
||||
src="test-file-stub"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
</span>
|
||||
<span>
|
||||
Download technical support document
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
|
@ -305,6 +305,35 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
|
|||
class="grid-container-desktop-lg"
|
||||
data-testid="gridContainer"
|
||||
>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
>
|
||||
<div
|
||||
class="usa-alert__body"
|
||||
>
|
||||
<h4
|
||||
class="usa-alert__heading"
|
||||
>
|
||||
Additional documentation now available
|
||||
</h4>
|
||||
<p
|
||||
class="usa-alert__text"
|
||||
>
|
||||
Download new technical support and other documentation and
|
||||
<a
|
||||
class="usa-link usa-link--external"
|
||||
data-cy=""
|
||||
href="mailto:Screeningtool-Support@omb.eop.gov"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
send feedback
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="usa-alert usa-alert--info"
|
||||
data-testid="alert"
|
||||
|
|
Loading…
Add table
Reference in a new issue