publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-08-29 01:31:40 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update download Box to match design sync

Browse source 
- update FAQ link copy
This commit is contained in:
Vim USDS 2022-04-06 17:54:52 -07:00
commit 73c2508a2d
9 changed files with 77 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

23
client/src/components/DownloadPacket/DownloadPacket.tsx
View file

@ -22,10 +22,6 @@ const DownloadPacket = () => {
{/* Download box description 1 */}
<div className={styles.dataSourceText}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.DESCRIPTION1}
{' '}
<span>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.LAST_UPDATED}
</span>
</div>
{/* Download box button 1 */}
@ -41,19 +37,16 @@ const DownloadPacket = () => {
</Button>
</a>
</div>
{/* Download box description 2 */}
<div className={styles.shapeFileText}>
<Tag className={styles.newtag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.DESCRIPTION2}
{' '}
<span>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.LAST_UPDATED}
</span>
<div className={styles.lastUpdated}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.LAST_UPDATED}
</div>
{/* Download box button 2 */}
<div className={styles.shapefileButtonContainer}>
<div className={styles.newTagContainer}>
<Tag className={styles.newtag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag>
</div>
<a data-cy={'shapefile-link'} download href={METHODOLOGY_COPY.DOWNLOAD_SHAPEFILE_URL}>
<Button className={styles.downloadBoxButton} type="button">
<div>
@ -65,6 +58,10 @@ const DownloadPacket = () => {
</Button>
</a>
</div>
<div className={styles.lastUpdated}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.LAST_UPDATED}
</div>
</div>
</div>

31
client/src/components/DownloadPacket/__snapshots__/downloadPacket.test.tsx.snap
View file

@ -13,10 +13,7 @@ exports[`download packet component defined checks if component renders 1`] = `
Files available for download
</div>
<div>
Download the data sources used in the CEJST (.csv and .xlsx, 52MB unzipped).
<span>
Last updated: 04/06/22
</span>
Download the data sources used in the CEJST (.csv and .xlsx, 52MB unzipped) or the shapefile, along with a codebook (.zip, 742MB unzipped).
</div>
<div>
<a
@ -42,18 +39,19 @@ exports[`download packet component defined checks if component renders 1`] = `
</a>
</div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
NEW
</span>
Download the shapefiles, along with a codebook (.cpg, .dbf, .prj, .shp and .shx, 740MB unzipped).
<span>
Last updated: 04/06/22
</span>
Last updated: 04/06/22
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
NEW
</strong>
</span>
</div>
<a
data-cy="shapefile-link"
download=""
@ -71,11 +69,14 @@ exports[`download packet component defined checks if component renders 1`] = `
/>
</div>
<div>
Download shapefiles
Download shapefile
</div>
</button>
</a>
</div>
<div>
Last updated: 04/06/22
</div>
</div>
</div>
</div>

22
client/src/components/DownloadPacket/downloadPacket.module.scss
View file

@ -2,6 +2,7 @@
@mixin baseButtonContainerStyles {
align-self: center;
@include u-margin-top(2);
a {
text-decoration: none;
@ -19,9 +20,6 @@
@include u-margin-top(2);
@include u-margin-bottom(2);
span {
font-style: italic;
}
};
@mixin baseButtonTextStyle {
@ -53,6 +51,14 @@
.dataSourceText {
@include baseTextStyle();
}
// Last updated
.lastUpdated {
font-style: italic;
align-self: center;
@include u-margin-top(1);
}
// Data source button
.dataSourceButtonContainer {
@include baseButtonContainerStyles();
@ -69,6 +75,8 @@
}
// Shapefile button
.shapefileButtonContainer{
display: flex;
flex-direction: column;
@include baseButtonContainerStyles();
.shapeFileButtonText {
@ -87,7 +95,13 @@
display: flex;
}
.newTagContainer {
align-self: end;
@include u-margin-bottom(-1);
z-index: 2;
}
.newtag {
@include u-text("blue-70v");
@include u-bg("yellow-20v");
}
}

2
client/src/components/DownloadPacket/downloadPacket.module.scss.d.ts vendored
View file

@ -11,7 +11,9 @@ declare namespace DownloadPacketModuleScssNamespace {
dataSourceButtonText: string;
shapeFileText: string;
shapeFileButtonText: string;
newTagContainer: string;
newtag: string;
lastUpdated:string;
}
}