From 226017654acfb5f7b44917c7068eb9e37b922675 Mon Sep 17 00:00:00 2001
From: Vim <86254807+vim-usds@users.noreply.github.com>
Date: Thu, 26 May 2022 00:01:04 -0400
Subject: [PATCH] Implement downloads page and May 25th timed copy changes
 (#1653)

* Add initial side nav

* Add Download page as a sub-page under Meth&Data

- udpate S3 file path in .envs
- remove the DownloadPacket component
- move download copy from methodology to download
- modify header to use two types of navs:
--  mobile (with sub-pages) and
-- desktop (without subpages)
- create a SubPageNav component
- add SubPagNav to Meth and Download page
- update snapshots
- add global CSS overide to remove minus sign on mobile nav link accordion as it's permanently open

* Remove the update tag above Public eng button

* Make the 3rd bullet on explore page update on 5/25

* Make the RFI box text change after 5/25/22

* Update site with RFI expired copy, remove Alerts

- add Spanish translations
- update snapshots

* Fix typo on XLS file path

* Refactor HowYouCanHelp to standard form

* Add custom download links with icons

- add new DownloadLink compnent
- add Spanish translations

* Update download file sizes

* Allow meth&data nav link to collapse on mobile
---
 client/.env.development                       |   9 +-
 client/.env.production                        |  11 +-
 .../DownloadLink/DownloadLink.module.scss     |   7 +
 .../DownloadLink.module.scss.d.ts             |  13 +
 .../DownloadLink.test.tsx}                    |   7 +-
 .../components/DownloadLink/DownloadLink.tsx  |  40 +++
 .../__snapshots__/DownloadLink.test.tsx.snap  |  16 ++
 client/src/components/DownloadLink/index.tsx  |   3 +
 .../DownloadPacket/DownloadPacket.tsx         |  94 ------
 .../downloadPacket.test.tsx.snap              | 148 ----------
 .../DownloadPacket/downloadPacket.module.scss | 114 --------
 .../downloadPacket.module.scss.d.ts           |  26 --
 .../src/components/DownloadPacket/index.tsx   |   3 -
 .../HowYouCanHelp/HowYouCanHelp.tsx           |  27 ++
 client/src/components/HowYouCanHelp/index.tsx |  26 +-
 .../__snapshots__/howYouCanHelp.test.tsx.snap |  12 +-
 client/src/components/J40Header/J40Header.tsx | 213 +++++++-------
 .../__snapshots__/J40Header.test.tsx.snap     | 114 +++-----
 .../LinkTypeWrapper/LinkTypeWrapper.tsx       |   2 +-
 .../PublicEngageButton.module.scss            |   1 +
 .../PublicEngageButton/PublicEngageButton.tsx |  10 +-
 .../PublicEngageButton.test.tsx.snap          |   8 -
 .../RequestForInfo/RequestForInfo.tsx         |   2 -
 .../RequestForInfo.test.tsx.snap              |  25 +-
 .../SubPageNav/SubPageNav.module.scss         |   0
 .../SubPageNav/SubPageNav.module.scss.d.ts    |   0
 .../components/SubPageNav/SubPageNav.test.tsx |  35 +++
 .../src/components/SubPageNav/SubPageNav.tsx  |  39 +++
 client/src/components/SubPageNav/index.tsx    |   3 +
 client/src/data/copy/common.tsx               |   9 +-
 client/src/data/copy/contact.tsx              |  12 +-
 client/src/data/copy/downloads.tsx            | 176 ++++++++----
 client/src/data/copy/explore.tsx              |  31 +-
 client/src/data/copy/methodology.tsx          | 143 +---------
 client/src/intl/en.json                       |  78 ++---
 client/src/intl/es.json                       |  11 +-
 client/src/pages/downloads.tsx                |  59 ++--
 client/src/pages/methodology.tsx              |  15 +-
 .../tests/__snapshots__/about.test.tsx.snap   | 122 +++-----
 .../tests/__snapshots__/contact.test.tsx.snap | 147 +++-------
 .../__snapshots__/downloads.test.tsx.snap     | 263 +++++++++--------
 .../freqAskedQuestions.test.tsx.snap          | 114 +++-----
 .../__snapshots__/methodology.test.tsx.snap   | 269 +++---------------
 .../__snapshots__/publicEng.test.tsx.snap     | 114 +++-----
 .../techSupportDoc.test.tsx.snap              | 114 +++-----
 client/src/styles/global.scss                 |   1 -
 46 files changed, 966 insertions(+), 1720 deletions(-)
 create mode 100644 client/src/components/DownloadLink/DownloadLink.module.scss
 create mode 100644 client/src/components/DownloadLink/DownloadLink.module.scss.d.ts
 rename client/src/components/{DownloadPacket/downloadPacket.test.tsx => DownloadLink/DownloadLink.test.tsx} (65%)
 create mode 100644 client/src/components/DownloadLink/DownloadLink.tsx
 create mode 100644 client/src/components/DownloadLink/__snapshots__/DownloadLink.test.tsx.snap
 create mode 100644 client/src/components/DownloadLink/index.tsx
 delete mode 100644 client/src/components/DownloadPacket/DownloadPacket.tsx
 delete mode 100644 client/src/components/DownloadPacket/__snapshots__/downloadPacket.test.tsx.snap
 delete mode 100644 client/src/components/DownloadPacket/downloadPacket.module.scss
 delete mode 100644 client/src/components/DownloadPacket/downloadPacket.module.scss.d.ts
 delete mode 100644 client/src/components/DownloadPacket/index.tsx
 create mode 100644 client/src/components/HowYouCanHelp/HowYouCanHelp.tsx
 create mode 100644 client/src/components/SubPageNav/SubPageNav.module.scss
 create mode 100644 client/src/components/SubPageNav/SubPageNav.module.scss.d.ts
 create mode 100644 client/src/components/SubPageNav/SubPageNav.test.tsx
 create mode 100644 client/src/components/SubPageNav/SubPageNav.tsx
 create mode 100644 client/src/components/SubPageNav/index.tsx

diff --git a/client/.env.development b/client/.env.development
index ab9c5f79..04115b29 100644
--- a/client/.env.development
+++ b/client/.env.development
@@ -9,9 +9,12 @@ GATSBY_LOCAL_TILES_BASE_URL=http://localhost:5000/data/data-pipeline
 GATSBY_DATA_PIPELINE_SCORE_PATH_LOCAL=data_pipeline/data/score
 GATSBY_DATA_PIPELINE_SCORE_PATH=data-pipeline/data/score
 
-GATSBY_SCORE_DOWNLOAD_FILE_PATH=downloadable/Screening_Tool_Data.zip
-GATSBY_SHAPE_FILE_PATH=shapefile/usa.zip
-GATSBY_TSD_DOWNLOAD_FILE_PATH=downloadable/cejst_technical_support_document.pdf
+GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP=downloadable/Screening_Tool_Data.zip
+GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP=shapefile/usa.zip
+GATSBY_FILE_DL_PATH_TSD_PDF=downloadable/cejst_technical_support_document.pdf
+GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS=downloadable/communities-2022-05-12-1914GMT.xlsx
+GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV=downloadable/communities-2022-05-12-1914GMT.csv
+GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF=downloadable/Draft_Communities_List.pdf
 
 GATSBY_MAP_TILES_PATH=tiles
 
diff --git a/client/.env.production b/client/.env.production
index 22c91533..93997e82 100644
--- a/client/.env.production
+++ b/client/.env.production
@@ -6,7 +6,12 @@
 GATSBY_CDN_TILES_BASE_URL=https://static-data-screeningtool.geoplatform.gov
 
 GATSBY_DATA_PIPELINE_SCORE_PATH=data-pipeline/data/score
-GATSBY_SCORE_DOWNLOAD_FILE_PATH=downloadable/Screening_Tool_Data.zip
-GATSBY_SHAPE_FILE_PATH=shapefile/usa.zip
-GATSBY_TSD_DOWNLOAD_FILE_PATH=downloadable/cejst_technical_support_document.pdf
+
+GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP=downloadable/Screening_Tool_Data.zip
+GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP=shapefile/usa.zip
+GATSBY_FILE_DL_PATH_TSD_PDF=downloadable/cejst_technical_support_document.pdf
+GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS=downloadable/communities-2022-05-12-1914GMT.csv
+GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV=downloadable/communities-2022-05-12-1914GMT.xlsx
+GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF=downloadable/Draft_Communities_List.pdf
+
 GATSBY_MAP_TILES_PATH=tiles
diff --git a/client/src/components/DownloadLink/DownloadLink.module.scss b/client/src/components/DownloadLink/DownloadLink.module.scss
new file mode 100644
index 00000000..e9e3357d
--- /dev/null
+++ b/client/src/components/DownloadLink/DownloadLink.module.scss
@@ -0,0 +1,7 @@
+@use '../../styles/design-system.scss' as *;
+
+.downloadIcon {
+    height: 1rem;
+    vertical-align: middle;
+    filter: invert(57%) sepia(6%) saturate(3932%) hue-rotate(163deg) brightness(86%) contrast(88%);
+}
\ No newline at end of file
diff --git a/client/src/components/DownloadLink/DownloadLink.module.scss.d.ts b/client/src/components/DownloadLink/DownloadLink.module.scss.d.ts
new file mode 100644
index 00000000..f409f6c7
--- /dev/null
+++ b/client/src/components/DownloadLink/DownloadLink.module.scss.d.ts
@@ -0,0 +1,13 @@
+declare namespace DownloadLinkNamespace {
+    export interface IDownloadLink {
+        downloadIcon: string;
+    }
+  }
+
+declare const DownloadLinkModule: DownloadLinkNamespace.IDownloadLink & {
+    /** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
+    locals: DownloadLinkNamespace.IDownloadLink;
+  };
+
+  export = DownloadLinkModule;
+
diff --git a/client/src/components/DownloadPacket/downloadPacket.test.tsx b/client/src/components/DownloadLink/DownloadLink.test.tsx
similarity index 65%
rename from client/src/components/DownloadPacket/downloadPacket.test.tsx
rename to client/src/components/DownloadLink/DownloadLink.test.tsx
index 62fde8c7..5aee7219 100644
--- a/client/src/components/DownloadPacket/downloadPacket.test.tsx
+++ b/client/src/components/DownloadLink/DownloadLink.test.tsx
@@ -1,12 +1,12 @@
 import * as React from 'react';
 import {render} from '@testing-library/react';
 import {LocalizedComponent} from '../../test/testHelpers';
-import DownloadPacket from './DownloadPacket';
+import DownloadLink from './DownloadLink';
 
-describe('download packet component defined', () => {
+describe('rendering of the DownloadLink disadvantaged', () => {
   const {asFragment} = render(
       <LocalizedComponent>
-        <DownloadPacket />
+        <DownloadLink href="https://google.com" linkText="Google"/>
       </LocalizedComponent>,
   );
 
@@ -14,4 +14,3 @@ describe('download packet component defined', () => {
     expect(asFragment()).toMatchSnapshot();
   });
 });
-
diff --git a/client/src/components/DownloadLink/DownloadLink.tsx b/client/src/components/DownloadLink/DownloadLink.tsx
new file mode 100644
index 00000000..0dec1ecb
--- /dev/null
+++ b/client/src/components/DownloadLink/DownloadLink.tsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import {defineMessages, useIntl} from 'gatsby-plugin-intl';
+
+import {IDefineMessage} from '../../data/copy/common';
+
+// @ts-ignore
+import fileDownloadIcon from '/node_modules/uswds/dist/img/usa-icons/file_download.svg';
+import * as styles from './DownloadLink.module.scss';
+
+export const DOWNLOAD_ICON = defineMessages({
+  ALT_TAG: {
+    id: 'downloads.page.download.icon.alt.tag',
+    defaultMessage: 'The icon used to indicate that the file is downloadable',
+    description: 'Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable',
+  },
+});
+
+interface IDownloadLink {
+    href: string | IDefineMessage,
+    linkText: string | JSX.Element,
+}
+const DownloadLink = ({href, linkText}:IDownloadLink) => {
+  const intl = useIntl();
+
+  if (href && typeof href !== `string`) {
+    href = intl.formatMessage(href);
+  }
+  return (
+    <>
+      <a href={href} download>{linkText}</a>
+      <img
+        className={styles.downloadIcon}
+        src={fileDownloadIcon}
+        alt={intl.formatMessage(DOWNLOAD_ICON.ALT_TAG)}
+      />
+    </>
+  );
+};
+
+export default DownloadLink;
diff --git a/client/src/components/DownloadLink/__snapshots__/DownloadLink.test.tsx.snap b/client/src/components/DownloadLink/__snapshots__/DownloadLink.test.tsx.snap
new file mode 100644
index 00000000..57a1c021
--- /dev/null
+++ b/client/src/components/DownloadLink/__snapshots__/DownloadLink.test.tsx.snap
@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`rendering of the DownloadLink disadvantaged checks if component renders 1`] = `
+<DocumentFragment>
+  <a
+    download=""
+    href="https://google.com"
+  >
+    Google
+  </a>
+  <img
+    alt="The icon used to indicate that the file is downloadable"
+    src="test-file-stub"
+  />
+</DocumentFragment>
+`;
diff --git a/client/src/components/DownloadLink/index.tsx b/client/src/components/DownloadLink/index.tsx
new file mode 100644
index 00000000..29d3e029
--- /dev/null
+++ b/client/src/components/DownloadLink/index.tsx
@@ -0,0 +1,3 @@
+import DownloadLink from './DownloadLink';
+
+export default DownloadLink;
diff --git a/client/src/components/DownloadPacket/DownloadPacket.tsx b/client/src/components/DownloadPacket/DownloadPacket.tsx
deleted file mode 100644
index ca010367..00000000
--- a/client/src/components/DownloadPacket/DownloadPacket.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-import React, {FC} from 'react';
-import {Button, Grid, Tag} from '@trussworks/react-uswds';
-
-import * as styles from './downloadPacket.module.scss';
-import * as METHODOLOGY_COPY from '../../data/copy/methodology';
-
-// @ts-ignore
-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}>
-        <div className={styles.downloadBox}>
-          <div className={styles.downloadBoxTextBox}>
-
-            {/* Download box title */}
-            <div className={styles.downloadBoxTitle}>
-              {METHODOLOGY_COPY.DOWNLOAD_PACKAGE.TITLE}
-            </div>
-
-            {/* Download box description 1 */}
-            <div className={styles.downloadSourceText}>
-              {METHODOLOGY_COPY.DOWNLOAD_PACKAGE.DESCRIPTION1}
-            </div>
-
-            {/* Download box button 1 */}
-            <div className={styles.downloadButtonContainer}>
-              <UpdateTag/>
-              <a data-cy={'download-link'}
-                download
-                href={METHODOLOGY_COPY.DOWNLOAD_ZIP_URL}>
-                <DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT1}</DownloadButton>
-              </a>
-            </div>
-            <div className={styles.lastUpdated}>
-              {METHODOLOGY_COPY.DOWNLOAD_PACKAGE.ZIP_LAST_UPDATED}
-            </div>
-
-
-            {/* Download box button 2 */}
-            <div className={styles.downloadButtonContainer}>
-              <UpdateTag/>
-              <a data-cy={'shapefile-link'}
-                download
-                href={METHODOLOGY_COPY.DOWNLOAD_SHAPEFILE_URL}>
-                <DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT2}</DownloadButton>
-              </a>
-            </div>
-            <div className={styles.lastUpdated}>
-              {METHODOLOGY_COPY.DOWNLOAD_PACKAGE.SHAPE_LAST_UPDATED}
-            </div>
-
-            {/* Download box button 3 */}
-            <div className={styles.downloadButtonContainer}>
-              <NewTag/>
-              {/* target and rel required since PDFs open in browser and don't download */}
-              <a data-cy={'tsd-link'}
-                download
-                target={'_blank'}
-                rel={'noreferrer'}
-                href={METHODOLOGY_COPY.DOWNLOAD_TSD_URL}>
-                <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>
-    </Grid>
-  );
-};
-
-export default DownloadPacket;
diff --git a/client/src/components/DownloadPacket/__snapshots__/downloadPacket.test.tsx.snap b/client/src/components/DownloadPacket/__snapshots__/downloadPacket.test.tsx.snap
deleted file mode 100644
index e47b2418..00000000
--- a/client/src/components/DownloadPacket/__snapshots__/downloadPacket.test.tsx.snap
+++ /dev/null
@@ -1,148 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`download packet component defined checks if component renders 1`] = `
-<DocumentFragment>
-  <div
-    class=""
-    data-testid="grid"
-  >
-    <div>
-      <div>
-        <div>
-          <div>
-            <span>
-              NEW
-            </span>
-             files available for download
-          </div>
-          <div>
-            Download the data sources used in the CEJST (.csv, .xlxs, 
-            <span>
-              .pdf
-            </span>
-             that describes how to use the list, and a 
-            <span>
-              codebook
-            </span>
-            , 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=""
-              href="//"
-            >
-              <button
-                class="usa-button"
-                data-testid="button"
-                type="button"
-              >
-                <span>
-                  <img
-                    alt="download icon for download package"
-                    src="test-file-stub"
-                  />
-                </span>
-                <span>
-                  Download data sources
-                </span>
-              </button>
-            </a>
-          </div>
-          <div>
-            Last updated: 05/04/22 
-          </div>
-          <div>
-            <div>
-              <span
-                class="usa-tag"
-                data-testid="tag"
-              >
-                <strong>
-                  Updated
-                </strong>
-              </span>
-            </div>
-            <a
-              data-cy="shapefile-link"
-              download=""
-              href="//"
-            >
-              <button
-                class="usa-button"
-                data-testid="button"
-                type="button"
-              >
-                <span>
-                  <img
-                    alt="download icon for download package"
-                    src="test-file-stub"
-                  />
-                </span>
-                <span>
-                  Download shapefile
-                </span>
-              </button>
-            </a>
-          </div>
-          <div>
-            Last updated: 04/26/22 
-          </div>
-          <div>
-            <div>
-              <span
-                class="usa-tag"
-                data-testid="tag"
-              >
-                <strong>
-                  NEW
-                </strong>
-              </span>
-            </div>
-            <a
-              data-cy="tsd-link"
-              download=""
-              href="//"
-              rel="noreferrer"
-              target="_blank"
-            >
-              <button
-                class="usa-button"
-                data-testid="button"
-                type="button"
-              >
-                <span>
-                  <img
-                    alt="download icon for download package"
-                    src="test-file-stub"
-                  />
-                </span>
-                <span>
-                  Download technical support document
-                </span>
-              </button>
-            </a>
-          </div>
-          <div>
-            Last updated: 04/19/22 
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</DocumentFragment>
-`;
diff --git a/client/src/components/DownloadPacket/downloadPacket.module.scss b/client/src/components/DownloadPacket/downloadPacket.module.scss
deleted file mode 100644
index 54df5440..00000000
--- a/client/src/components/DownloadPacket/downloadPacket.module.scss
+++ /dev/null
@@ -1,114 +0,0 @@
-@use '../../styles/design-system.scss' as *;
-
-@mixin baseButtonContainerStyles {
-  align-self: center;
-  @include u-margin-top(2);
-
-  a {
-    text-decoration: none;
-  }
-
-  img {
-    // This should be a global css-filter value as it's generated
-    // from the primary color.
-    filter: invert(15%) sepia(9%) saturate(5666%) hue-rotate(175deg) brightness(96%) contrast(95%);
-  }
-}
-
-@mixin baseTextStyle {
-  @include typeset('sans', 'xs', 3);
-  @include u-margin-top(2);
-  @include u-margin-bottom(2);
-
-};
-
-@mixin baseButtonTextStyle {
-  padding-top: 4px;
-  padding-left: 5px;
-}
-
-.downloadBoxContainer {
-    color: whitesmoke;
-    margin: auto;
-    @include u-margin-top(2.5);
-
-    .downloadBox {
-      @include u-bg('blue-80v');
-      border-radius: 6px 6px;
-      // @include u-margin-top(3);
-
-      .downloadBoxTextBox {
-        padding: 25px 25px;
-        display: flex;
-        flex-direction: column;
-
-        .downloadBoxTitle {
-          @include typeset('sans', 'xs', 3);
-          @include u-text('semibold');
-        }
-
-        .downloadSourceText {
-          @include u-margin-top(2);
-        }
-
-        // Last updated
-        .lastUpdated {
-          font-style: italic;
-          align-self: center;
-          @include u-margin-top(1);
-        }
-
-        // Data source button (scoped)
-        .downloadButtonContainer {
-          display: flex;
-          flex-direction: column;
-          @include baseButtonContainerStyles();
-          text-align: center;
-
-          .downloadButtonText {
-            @include baseButtonTextStyle();
-            @include u-margin-right(1);
-          }
-
-          .downloadButtonIconSpan {
-            display: contents;
-            max-width: 1.5em;
-          }
-
-          .downloadButtonIcon {
-            width: 1.5em;
-            height: 1.5em;
-          }
-        }
-      }
-    }
-  }
-
-  .downloadBoxButton {
-    @include u-bg('white');
-    @include u-color('blue-80v');
-    display: flex;
-    width: 16em;
-  }
-
-  .tagContainer {
-    align-self: end;
-    @include u-margin-bottom(-1);
-    z-index: 2;
-  }
-
-  .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");
-  }
diff --git a/client/src/components/DownloadPacket/downloadPacket.module.scss.d.ts b/client/src/components/DownloadPacket/downloadPacket.module.scss.d.ts
deleted file mode 100644
index 4246152f..00000000
--- a/client/src/components/DownloadPacket/downloadPacket.module.scss.d.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-declare namespace DownloadPacketModuleScssNamespace {
-    export interface IDownloadPacketModuleScss {
-        downloadBoxContainer: string;
-        downloadBox: string;
-        downloadBoxTextBox: string;
-        downloadBoxTitle: string;
-        downloadSourceText: string;
-        downloadButtonContainer: string;
-        downloadBoxButton: string;
-        downloadButtonText: string;
-        downloadButtonIconSpan: string;
-        downloadButtonIcon: string;
-        tagContainer: string;
-        newTag: string;
-        updateTag: string;
-        newCalloutFontColor: string;
-        lastUpdated:string;
-    }
-  }
-
-declare const DownloadPacketModuleScssModule: DownloadPacketModuleScssNamespace.IDownloadPacketModuleScss & {
-    /** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
-    locals: DownloadPacketModuleScssNamespace.IDownloadPacketModuleScss;
-  };
-
-export = DownloadPacketModuleScssModule;
diff --git a/client/src/components/DownloadPacket/index.tsx b/client/src/components/DownloadPacket/index.tsx
deleted file mode 100644
index 54609c0c..00000000
--- a/client/src/components/DownloadPacket/index.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-import DownloadPacket from './DownloadPacket';
-
-export default DownloadPacket;
diff --git a/client/src/components/HowYouCanHelp/HowYouCanHelp.tsx b/client/src/components/HowYouCanHelp/HowYouCanHelp.tsx
new file mode 100644
index 00000000..0ba4ed46
--- /dev/null
+++ b/client/src/components/HowYouCanHelp/HowYouCanHelp.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+
+import * as styles from './howYouCanHelp.module.scss';
+import * as EXPLORE_COPY from '../../data/copy/explore';
+
+const HowYouCanHelp = () => {
+  return (
+    <div className={styles.howYouCanHelpContainer}>
+      <h2>
+        {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.HEADING}
+      </h2>
+      <ul className={styles.howYouCanHelpListWrapper}>
+        <li className={styles.howYouCanHelpList}>
+          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_1}
+        </li>
+        <li className={styles.howYouCanHelpList}>
+          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_2}
+        </li>
+        <li className={styles.howYouCanHelpList}>
+          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_3}
+        </li>
+      </ul>
+    </div>
+  );
+};
+
+export default HowYouCanHelp;
diff --git a/client/src/components/HowYouCanHelp/index.tsx b/client/src/components/HowYouCanHelp/index.tsx
index 0ba4ed46..9963e57d 100644
--- a/client/src/components/HowYouCanHelp/index.tsx
+++ b/client/src/components/HowYouCanHelp/index.tsx
@@ -1,27 +1,3 @@
-import React from 'react';
-
-import * as styles from './howYouCanHelp.module.scss';
-import * as EXPLORE_COPY from '../../data/copy/explore';
-
-const HowYouCanHelp = () => {
-  return (
-    <div className={styles.howYouCanHelpContainer}>
-      <h2>
-        {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.HEADING}
-      </h2>
-      <ul className={styles.howYouCanHelpListWrapper}>
-        <li className={styles.howYouCanHelpList}>
-          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_1}
-        </li>
-        <li className={styles.howYouCanHelpList}>
-          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_2}
-        </li>
-        <li className={styles.howYouCanHelpList}>
-          {EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_3}
-        </li>
-      </ul>
-    </div>
-  );
-};
+import HowYouCanHelp from './HowYouCanHelp';
 
 export default HowYouCanHelp;
diff --git a/client/src/components/HowYouCanHelp/tests/__snapshots__/howYouCanHelp.test.tsx.snap b/client/src/components/HowYouCanHelp/tests/__snapshots__/howYouCanHelp.test.tsx.snap
index d40c188f..e94d6bb3 100644
--- a/client/src/components/HowYouCanHelp/tests/__snapshots__/howYouCanHelp.test.tsx.snap
+++ b/client/src/components/HowYouCanHelp/tests/__snapshots__/howYouCanHelp.test.tsx.snap
@@ -30,17 +30,7 @@ exports[`rendering of the HowYouCanHelp checks if various text fields are visibl
         .
       </li>
       <li>
-        Respond to our Request for Information on 
-        <a
-          class="usa-link usa-link--external"
-          data-cy=""
-          href="https://www.federalregister.gov/d/2022-03920"
-          rel="noreferrer"
-          target="_blank"
-        >
-          federalregister.gov
-        </a>
-        .
+        The Request for Information on the Federal Register is now closed.
       </li>
     </ul>
   </div>
diff --git a/client/src/components/J40Header/J40Header.tsx b/client/src/components/J40Header/J40Header.tsx
index 011e127b..e8a87b66 100644
--- a/client/src/components/J40Header/J40Header.tsx
+++ b/client/src/components/J40Header/J40Header.tsx
@@ -5,14 +5,14 @@ import {
   NavMenuButton,
   PrimaryNav,
   Grid,
-  Alert,
-  // NavDropDownButton,
-  // Menu,
+  NavDropDownButton,
+  Menu,
 } from '@trussworks/react-uswds';
 import BetaBanner from '../BetaBanner';
 import J40MainGridContainer from '../J40MainGridContainer';
 import GovernmentBanner from '../GovernmentBanner';
 import Language from '../Language';
+import {useWindowSize} from 'react-use';
 
 // @ts-ignore
 import siteLogo from '../../images/j40-logo-v2.png';
@@ -20,73 +20,79 @@ import * as styles from './J40Header.module.scss';
 import * as COMMON_COPY from '../../data/copy/common';
 import {PAGES_ENDPOINTS} from '../../data/constants';
 
+/**
+ * The J40Header component will control how the header looks for both mobile and desktop
+ *
+ * The Header is defined as
+ * 1. Two rows of Banners (ie, official gov website and beta site)
+ * 2. Logo and Nav Links Row
+ * 3. Any Alerts
+ *
+ * @return {JSX.Element}
+ */
 const J40Header = () => {
   const intl = useIntl();
+  const {width} = useWindowSize();
 
-  const titleL1 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_1);
-  const titleL2 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_2);
+  // 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 mobile menu toggle
+   * State variable to control the toggling of mobile menu button
    */
   const [mobileNavOpen, setMobileNavOpen] = useState(false);
   const toggleMobileNav = (): void =>
     setMobileNavOpen((prevOpen) => !prevOpen);
 
+  /**
+   * State variable to hold the open/close state of each nav dropdown. This will allow for two
+   * dropdown that are being used, each corresponding to an index in the state array:
+   *
+   * index 0 = Data & Methodology dropdown (being used)
+   * index 1 = About dropdown (removed for now)
+   */
+  const [isOpen, setIsOpen] = useState([true]);
+  const onToggle = (index: number): void => {
+    setIsOpen((prevIsOpen) => {
+      const newIsOpen = [true];
+      newIsOpen[index] = !prevIsOpen[index];
+      return newIsOpen;
+    });
+  };
 
   /**
-   * The original work of this release called for creating a download page, a FAQ page and TSD page. These
-   * were to be embedded in dropdown menus in the navigation bar of the header. These were all completed.
-   * After discovering that the dropdown component from USWDS was not operating as expected, we decided to
-   * revert to another design.
-   *
-   * It was also decided that some more design was needed and that these pages along with their designs will
-   * be used in the near future. Rather than deleted the code or moving it to another branch, the assumption
-   * was made that since this will be added back in the near term, let's comment it out for now.
-   *
-   * If for some reason we haven't integrated this logic in the near future, this code will be deleted.
+   * On mobile, the Methodology & Data page should have two sub-nav links. This defines
+   * the array that will hold these links
    */
+  const methPageSubNavLinks = [
+    <Link
+      to={PAGES_ENDPOINTS.METHODOLOGY}
+      key={'methodology'}
+      activeClassName="usa-current"
+      data-cy={'nav-link-methodology'}>
+      {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
+    </Link>,
+    <Link
+      to={PAGES_ENDPOINTS.DOWNLOADS}
+      key={'downloads'}
+      activeClassName="usa-current"
+      data-cy={'nav-link-downloads'}>
+      {intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
+    </Link>,
+    // <Link
+    //   to={PAGES_ENDPOINTS.TSD}
+    //   key={'tsd'}
+    //   activeClassName="usa-current"
+    //   data-cy={'nav-link-technical-support-docs'}>
+    //   {intl.formatMessage(COMMON_COPY.HEADER.TSD)}
+    // </Link>,
+  ];
 
   /**
-   * State variable to hold the open/close state of each nav dropdown. There are currently two
-   * dropdowns that are being used, each corresponding to an index in the state array:
-   *
-   * index 0 = Data & Methodology dropdown
-   * index 1 = About dropdown
+   * In the future, we may want to add sub-pages to the About page. This array will
+   * define the sub-pages for the About page.
    */
-  // const [isOpen, setIsOpen] = useState([false, false]);
-  // const onToggle = (index: number): void => {
-  //   setIsOpen((prevIsOpen) => {
-  //     const newIsOpen = [false, false];
-  //     newIsOpen[index] = !prevIsOpen[index];
-  //     return newIsOpen;
-  //   });
-  // };
-
-  // const methPageSubNavLinks = [
-  //   <Link
-  //     to={PAGES_ENDPOINTS.METHODOLOGY}
-  //     key={'methodology'}
-  //     activeClassName="usa-current"
-  //     data-cy={'nav-link-methodology'}>
-  //     {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
-  //   </Link>,
-  //   <Link
-  //     to={PAGES_ENDPOINTS.DOWNLOADS}
-  //     key={'downloads'}
-  //     activeClassName="usa-current"
-  //     data-cy={'nav-link-downloads'}>
-  //     {intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
-  //   </Link>,
-  //   <Link
-  //     to={PAGES_ENDPOINTS.TSD}
-  //     key={'tsd'}
-  //     activeClassName="usa-current"
-  //     data-cy={'nav-link-technical-support-docs'}>
-  //     {intl.formatMessage(COMMON_COPY.HEADER.TSD)}
-  //   </Link>,
-  // ];
-
   // const aboutSubNavLinks = [
   //   <Link
   //     to={PAGES_ENDPOINTS.ABOUT}
@@ -111,6 +117,17 @@ const J40Header = () => {
   //   </Link>,
   // ];
 
+
+  /**
+   * This is the array that holds the navigation links and eventually is the one
+   * that is passed to the render function. It only defines Explore, About and
+   * Contact.
+   *
+   * The Methodology & Data link is passed in depending on screen size.
+   *
+   * For mobile: the Methodology & Data link should have sub-pages
+   * For desktop: the Methodology & Data link should NOT have sub-pages
+   */
   const navLinks = [
     <Link
       to={PAGES_ENDPOINTS.EXPLORE}
@@ -119,13 +136,6 @@ const J40Header = () => {
       data-cy={'nav-link-explore-the-map'}>
       {intl.formatMessage(COMMON_COPY.HEADER.EXPLORE)}
     </Link>,
-    <Link
-      to={PAGES_ENDPOINTS.METHODOLOGY}
-      key={'methodology'}
-      activeClassName="usa-current"
-      data-cy={'nav-link-methodology'}>
-      {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
-    </Link>,
     <Link
       to={PAGES_ENDPOINTS.ABOUT}
       key={'about'}
@@ -133,43 +143,6 @@ const J40Header = () => {
       data-cy={'nav-link-about'}>
       {intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
     </Link>,
-    // <>
-    //   <NavDropDownButton
-    //     key="methDropDown"
-    //     label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
-    //     menuId="methMenu"
-    //     isOpen={isOpen[0]}
-    //     onToggle={(): void => onToggle(0)}
-    //     data-cy={'nav-dropdown-methodology'}
-    //     className={styles.navDropDownBtn}
-    //   >
-    //   </NavDropDownButton>
-    //   <Menu
-    //     id='methMenu'
-    //     type='subnav'
-    //     items={methPageSubNavLinks}
-    //     isOpen={isOpen[0]}
-    //   >
-    //   </Menu>
-    // </>,
-    // <>
-    //   <NavDropDownButton
-    //     key="aboutDropDown"
-    //     label={intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
-    //     menuId="aboutMenu"
-    //     isOpen={isOpen[1]}
-    //     onToggle={(): void => onToggle(1)}
-    //     data-cy={'nav-dropdown-about'}
-    //   >
-    //   </NavDropDownButton>
-    //   <Menu
-    //     id='aboutMenu'
-    //     type='subnav'
-    //     items={aboutSubNavLinks}
-    //     isOpen={isOpen[1]}
-    //   >
-    //   </Menu>
-    // </>,
     <Link
       to={PAGES_ENDPOINTS.CONTACT}
       key={'contact'}
@@ -182,6 +155,40 @@ const J40Header = () => {
     </div>,
   ];
 
+  // For mobile: the Methodology & Data link should have sub-pages
+  const MethPageNavWithSubPages = () =>
+    <>
+      <NavDropDownButton
+        key="methDropDown"
+        label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
+        menuId="methMenu"
+        isOpen={isOpen[0]}
+        onToggle={(): void => onToggle(0)}
+        data-cy={'nav-dropdown-methodology'}
+      >
+      </NavDropDownButton>
+      <Menu
+        id='methMenu'
+        type='subnav'
+        items={methPageSubNavLinks}
+        isOpen={isOpen[0]}
+      >
+      </Menu>
+    </>;
+
+  // For desktop: the Methodology & Data link should NOT have sub-pages
+  const MethPageNav = () =>
+    <Link
+      to={PAGES_ENDPOINTS.METHODOLOGY}
+      key={'methodology'}
+      activeClassName="usa-current"
+      data-cy={'nav-link-methodology'}>
+      {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
+    </Link>;
+
+  // Modify navLinks to choose the appropriate Methodology & Data nav link depending on screen size
+  navLinks.splice(1, 0, width > 1024 ? <MethPageNav/> : <MethPageNavWithSubPages/>);
+
   return (
     <Header basic={true} role={'banner'}>
 
@@ -196,15 +203,15 @@ const J40Header = () => {
 
           {/* Logo */}
           <Grid col={1}>
-            <img className={styles.logo} src={siteLogo} alt={`${titleL1} ${titleL2}`} />
+            <img className={styles.logo} src={siteLogo} alt={`${logoLine1} ${logoLine2}`} />
           </Grid>
 
           {/* Logo Title */}
           <Grid col={6}>
             <div className={styles.logoTitle}>
-              <div>{titleL1}</div>
+              <div>{logoLine1}</div>
               <div className={styles.title2BetaPill}>
-                <div> {titleL2} </div>
+                <div> {logoLine2} </div>
                 <div className={styles.betaPill}>BETA</div>
               </div>
             </div>
@@ -230,7 +237,7 @@ const J40Header = () => {
       </J40MainGridContainer>
 
       {/* Alert */}
-      {<J40MainGridContainer>
+      {/* {<J40MainGridContainer>
         <Alert
           className={styles.alert}
           type="info"
@@ -245,7 +252,7 @@ const J40Header = () => {
           {COMMON_COPY.ALERTS.ALERT_1_DESCRIPTION}
         </Alert>
       </J40MainGridContainer>
-      }
+      } */}
     </Header>
   );
 };
diff --git a/client/src/components/J40Header/__snapshots__/J40Header.test.tsx.snap b/client/src/components/J40Header/__snapshots__/J40Header.test.tsx.snap
index 8a76ff1b..47473272 100644
--- a/client/src/components/J40Header/__snapshots__/J40Header.test.tsx.snap
+++ b/client/src/components/J40Header/__snapshots__/J40Header.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
 </DocumentFragment>
 `;
diff --git a/client/src/components/LinkTypeWrapper/LinkTypeWrapper.tsx b/client/src/components/LinkTypeWrapper/LinkTypeWrapper.tsx
index 86306d66..a2fa0b4f 100644
--- a/client/src/components/LinkTypeWrapper/LinkTypeWrapper.tsx
+++ b/client/src/components/LinkTypeWrapper/LinkTypeWrapper.tsx
@@ -4,7 +4,7 @@ import {Link as TrussLink} from '@trussworks/react-uswds';
 
 import {IDefineMessage} from '../../data/copy/common';
 
-interface ILinkTypeWrapper {
+export interface ILinkTypeWrapper {
     linkText?: string | JSX.Element;
     internal?: boolean;
     url: string | IDefineMessage;
diff --git a/client/src/components/PublicEngageButton/PublicEngageButton.module.scss b/client/src/components/PublicEngageButton/PublicEngageButton.module.scss
index 0a30c196..65c8e8cf 100644
--- a/client/src/components/PublicEngageButton/PublicEngageButton.module.scss
+++ b/client/src/components/PublicEngageButton/PublicEngageButton.module.scss
@@ -17,6 +17,7 @@
     display: flex;
     flex-direction: column;
     @include u-padding-top(2.5);
+    @include u-margin-top(4);
 
     .link, .link:visited {
         color:white;
diff --git a/client/src/components/PublicEngageButton/PublicEngageButton.tsx b/client/src/components/PublicEngageButton/PublicEngageButton.tsx
index f30ff5d6..53c66cf1 100644
--- a/client/src/components/PublicEngageButton/PublicEngageButton.tsx
+++ b/client/src/components/PublicEngageButton/PublicEngageButton.tsx
@@ -1,6 +1,9 @@
 import React from 'react';
 import {useIntl, Link} from 'gatsby-plugin-intl';
-import {Button, Tag} from '@trussworks/react-uswds';
+import {
+  Button,
+  // Tag
+} from '@trussworks/react-uswds';
 
 import * as styles from './PublicEngageButton.module.scss';
 import * as PUBLIC_ENG_COPY from '../../data/copy/publicEngage';
@@ -13,11 +16,12 @@ const PublicEngageButton = () => {
 
   return (
     <div className={styles.container}>
-      <div className={styles.tagContainer}>
+      {/* Remove Updated Tag for now */}
+      {/* <div className={styles.tagContainer}>
         <Tag className={styles.tag}>
           {intl.formatMessage(PUBLIC_ENG_COPY.PUBLIC_ENG_BUTTON.TAG_LABEL)}
         </Tag>
-      </div>
+      </div> */}
       <Link className={styles.link} to={'/public-engagement'}>
         <Button
           type="button"
diff --git a/client/src/components/PublicEngageButton/__snapshots__/PublicEngageButton.test.tsx.snap b/client/src/components/PublicEngageButton/__snapshots__/PublicEngageButton.test.tsx.snap
index 7d572f0e..a957b511 100644
--- a/client/src/components/PublicEngageButton/__snapshots__/PublicEngageButton.test.tsx.snap
+++ b/client/src/components/PublicEngageButton/__snapshots__/PublicEngageButton.test.tsx.snap
@@ -3,14 +3,6 @@
 exports[`rendering of the PublicEngageButton checks if component renders 1`] = `
 <DocumentFragment>
   <div>
-    <div>
-      <span
-        class="usa-tag"
-        data-testid="tag"
-      >
-        UPDATED
-      </span>
-    </div>
     <a
       href="/en/public-engagement"
     >
diff --git a/client/src/components/RequestForInfo/RequestForInfo.tsx b/client/src/components/RequestForInfo/RequestForInfo.tsx
index ad48aba6..bb8324b8 100644
--- a/client/src/components/RequestForInfo/RequestForInfo.tsx
+++ b/client/src/components/RequestForInfo/RequestForInfo.tsx
@@ -4,7 +4,6 @@ import {useIntl} from 'gatsby-plugin-intl';
 
 import * as CONTACT_COPY from '../../data/copy/contact';
 import * as styles from './RequestForInfo.module.scss';
-import * as COMMON_COPY from '../../data/copy/common';
 
 const RequestForInfo = () => {
   const intl = useIntl();
@@ -12,7 +11,6 @@ const RequestForInfo = () => {
   return (
     <SummaryBox className={styles.rfiBox} heading={intl.formatMessage(CONTACT_COPY.RFI_BOX.TITLE)}>
       <p>{CONTACT_COPY.RFI_BOX_BODY}</p>
-      <p>{COMMON_COPY.ALERTS.ALERT_1_DESCRIPTION}</p>
     </SummaryBox>
   );
 };
diff --git a/client/src/components/RequestForInfo/__snapshots__/RequestForInfo.test.tsx.snap b/client/src/components/RequestForInfo/__snapshots__/RequestForInfo.test.tsx.snap
index 21930c6c..9bad589b 100644
--- a/client/src/components/RequestForInfo/__snapshots__/RequestForInfo.test.tsx.snap
+++ b/client/src/components/RequestForInfo/__snapshots__/RequestForInfo.test.tsx.snap
@@ -18,30 +18,7 @@ exports[`rendering of the RequestForInfo checks if component renders 1`] = `
         class="usa-summary-box__text"
       >
         <p>
-          During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQ’s Request for Information available on 
-          <a
-            class="usa-link usa-link--external"
-            data-cy=""
-            href="https://www.federalregister.gov/d/2022-03920"
-            rel="noreferrer"
-            target="_blank"
-          >
-            federalregister.gov
-          </a>
-          .
-        </p>
-        <p>
-          The public comment period for 
-          <a
-            class="usa-link usa-link--external"
-            data-cy=""
-            href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-            rel="noreferrer"
-            target="_blank"
-          >
-            sending feedback
-          </a>
-           via the Request for Information has been extended to May 25, 2022.
+          The Request for Information on the Federal Register for the public beta period closed on May 25, 2022
         </p>
       </div>
     </div>
diff --git a/client/src/components/SubPageNav/SubPageNav.module.scss b/client/src/components/SubPageNav/SubPageNav.module.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/client/src/components/SubPageNav/SubPageNav.module.scss.d.ts b/client/src/components/SubPageNav/SubPageNav.module.scss.d.ts
new file mode 100644
index 00000000..e69de29b
diff --git a/client/src/components/SubPageNav/SubPageNav.test.tsx b/client/src/components/SubPageNav/SubPageNav.test.tsx
new file mode 100644
index 00000000..48e52516
--- /dev/null
+++ b/client/src/components/SubPageNav/SubPageNav.test.tsx
@@ -0,0 +1,35 @@
+import * as React from 'react';
+import {render} from '@testing-library/react';
+import {LocalizedComponent} from '../../test/testHelpers';
+import SubPageNav from './SubPageNav';
+
+describe('rendering of the SubPageNav', () => {
+  const firstLinkActive = 1;
+  const secondLinkIndex = 2;
+
+  it('checks if the first link is active', () => {
+    const {container} = render(
+        <LocalizedComponent>
+          <SubPageNav activeSubPageIndex={firstLinkActive}/>
+        </LocalizedComponent>,
+    );
+
+    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');
+  });
+
+  it('checks if the second link is active', () => {
+    const {container} = render(
+        <LocalizedComponent>
+          <SubPageNav activeSubPageIndex={secondLinkIndex}/>
+        </LocalizedComponent>,
+    );
+
+    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');
+  });
+});
diff --git a/client/src/components/SubPageNav/SubPageNav.tsx b/client/src/components/SubPageNav/SubPageNav.tsx
new file mode 100644
index 00000000..3f79401c
--- /dev/null
+++ b/client/src/components/SubPageNav/SubPageNav.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import {SideNav} from '@trussworks/react-uswds';
+import {useIntl} from 'gatsby-plugin-intl';
+
+import LinkTypeWrapper from '../LinkTypeWrapper';
+import {PAGES_ENDPOINTS} from '../../data/constants';
+import * as COMMON_COPY from '../../data/copy/common';
+
+// This prop is used to set which sub-page navigation is active
+interface ISubPageNav {
+    activeSubPageIndex?: number;
+}
+
+const SubPageNav = ({activeSubPageIndex}:ISubPageNav) => {
+  const intl = useIntl();
+
+  const subPages = [
+    <LinkTypeWrapper
+      key={0}
+      className={activeSubPageIndex === 1 ? 'usa-current' : ''}
+      url={PAGES_ENDPOINTS.METHODOLOGY}
+      internal={true}
+      linkText={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
+    />,
+    <LinkTypeWrapper
+      key={1}
+      className={activeSubPageIndex === 2 ? 'usa-current' : ''}
+      url={PAGES_ENDPOINTS.DOWNLOADS}
+      internal={true}
+      linkText={intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
+    />,
+  ];
+
+  return (
+    <SideNav items={subPages}/>
+  );
+};
+
+export default SubPageNav;
diff --git a/client/src/components/SubPageNav/index.tsx b/client/src/components/SubPageNav/index.tsx
new file mode 100644
index 00000000..27d560f7
--- /dev/null
+++ b/client/src/components/SubPageNav/index.tsx
@@ -0,0 +1,3 @@
+import SubPageNav from './SubPageNav';
+
+export default SubPageNav;
diff --git a/client/src/data/copy/common.tsx b/client/src/data/copy/common.tsx
index 48b8703f..0e28b248 100644
--- a/client/src/data/copy/common.tsx
+++ b/client/src/data/copy/common.tsx
@@ -4,6 +4,7 @@ import React from 'react';
 import {FormattedDate, FormattedMessage} from 'gatsby-plugin-intl';
 import {defineMessages} from 'react-intl';
 import LinkTypeWrapper from '../../components/LinkTypeWrapper';
+import DownloadLink from '../../components/DownloadLink';
 
 export interface IDefineMessage {
   id: string,
@@ -20,6 +21,8 @@ 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 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
 export const linkFn = (to:string | IDefineMessage, isInternal:boolean, isOpenNewTab:boolean) => (str:string) => <LinkTypeWrapper linkText={str} internal={isInternal} url={to} openUrlNewTab={isOpenNewTab}/>;
 
@@ -51,7 +54,7 @@ export const TSD = defineMessages({
 
 // Alerts
 // Expiration month is zero-based: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getMonth
-const ALERT_1_EXPIRATION_DATE= new Date(2022, 4, 25, 11, 59, 59); // May 25
+export const RFI_EXPIRATION_DATE= new Date(2022, 4, 25, 11, 59, 59); // May 25
 export const ALERTS = {
   ALERT_1_TITLE: defineMessages({
     TITLE: {
@@ -60,7 +63,7 @@ export const ALERTS = {
       description: 'Alert title that appears on landing page.',
     },
   }),
-  EXPIRATION_DATE: ALERT_1_EXPIRATION_DATE,
+  EXPIRATION_DATE: RFI_EXPIRATION_DATE,
   ALERT_1_DESCRIPTION: <FormattedMessage
     id={'common.pages.alerts.public_comment_period.description'}
     defaultMessage={`The public comment period for <link1>sending feedback</link1> via the Request for Information has been extended to {expDate1}.`}
@@ -68,7 +71,7 @@ export const ALERTS = {
     values={{
       link1: linkFn('https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version', false, true),
       expDate1: <FormattedDate
-        value={ALERT_1_EXPIRATION_DATE}
+        value={RFI_EXPIRATION_DATE}
         year="numeric"
         month="short"
         day="numeric"
diff --git a/client/src/data/copy/contact.tsx b/client/src/data/copy/contact.tsx
index 393e593a..18a8d02c 100644
--- a/client/src/data/copy/contact.tsx
+++ b/client/src/data/copy/contact.tsx
@@ -1,10 +1,9 @@
 /* eslint-disable max-len */
 import React from 'react';
 import {defineMessages} from 'react-intl';
-import {FormattedMessage} from 'gatsby-plugin-intl';
+import {FormattedDate, FormattedMessage} from 'gatsby-plugin-intl';
 import * as COMMON_COPY from './common';
 import {PAGES_ENDPOINTS} from '../constants';
-import {FOOTER} from './common';
 
 export const PAGE_INTRO = defineMessages({
   PAGE_TILE: {
@@ -49,10 +48,15 @@ export const RFI_BOX = defineMessages({
 
 export const RFI_BOX_BODY = <FormattedMessage
   id={'contact.page.request.for.info.box.body'}
-  defaultMessage={`During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQ’s Request for Information available on <link1>federalregister.gov</link1>.`}
+  defaultMessage={`The Request for Information on the Federal Register for the public beta period closed on {rfiExpDate}`}
   description={'Navigate to the contact page, this is the body of the request for information box'}
   values={{
-    link1: COMMON_COPY.linkFn(FOOTER.RFI_LINK.defaultMessage, false, true),
+    rfiExpDate: <FormattedDate
+      value={COMMON_COPY.RFI_EXPIRATION_DATE}
+      year="numeric"
+      month="long"
+      day="numeric"
+    />,
   }}
 />;
 
diff --git a/client/src/data/copy/downloads.tsx b/client/src/data/copy/downloads.tsx
index aef40cbe..d17934d4 100644
--- a/client/src/data/copy/downloads.tsx
+++ b/client/src/data/copy/downloads.tsx
@@ -2,7 +2,7 @@
 import React from 'react';
 import {defineMessages} from 'react-intl';
 import {FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
-import {simpleLink} from './common';
+import * as COMMON_COPY from './common';
 
 export const PAGE_INTRO = defineMessages({
   PAGE_TILE: {
@@ -27,53 +27,129 @@ export const PAGE_INTRO = defineMessages({
   },
 });
 
-export const DOWNLOAD_LINKS = {
-  EXCEL: <FormattedMessage
-    id={'downloads.page.excel.link'}
-    defaultMessage={`
-        <link1>Excel file</link1> (.xlxs {excelFileSize} unzipped)
-      `}
-    description={'On the downloads page, the description of the excel link'}
-    values={{
-      link1: (str:string) => <a href='/about'>{str}</a>,
-      excelFileSize: <FormattedNumber
-        value={54}
-        style="unit"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-    }}
-  />,
-  CSV: <FormattedMessage
-    id={'downloads.page.csv.link'}
-    defaultMessage={`
-        <link1>CSV file </link1> (.csv {csvFileSize} unzipped)
-      `}
-    description={'On the downloads page, the description of the csv link'}
-    values={{
-      link1: simpleLink('/csv'),
-      csvFileSize: <FormattedNumber
-        value={52}
-        style="unit"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-    }}
-  />,
-  SHAPE: <FormattedMessage
-    id={'downloads.page.shape.link'}
-    defaultMessage={`
-        <link1>Shapefiles </link1> (Codebook included with geojson {shapeFileSize} unzipped)
-      `}
-    description={'On the downloads page, the description of the shapefiles link'}
-    values={{
-      link1: simpleLink('/shape'),
-      shapeFileSize: <FormattedNumber
-        value={110}
-        style="unit"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-    }}
-  />,
+const getDownloadFileUrl = (filePath:string | undefined) => {
+  return [
+    process.env.GATSBY_CDN_TILES_BASE_URL,
+    process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
+    filePath,
+  ].join('/');
+};
+
+// Define meta data on dowload files
+export const DOWNLOAD_FILES = {
+  SCREENING_TOOL_DATA_ZIP: {
+    SIZE: 53.7, // MB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+  COMMUNITIES_LIST_CSV: {
+    SIZE: 28.1, // MB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+  COMMUNITIES_LIST_XLS: {
+    SIZE: 24.9, // MB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+  SHAPE_FILE: {
+    SIZE: 741, // MB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+  TSD: {
+    SIZE: 2.5, // MB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_TSD_PDF),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+  HOW_TO_COMMUNITIES: {
+    SIZE: 674, // KB
+    URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF),
+    LAST_UPDATED: new Date('5/4/2022').getTime(),
+  },
+};
+
+// If this is not a function, it will cause a circular dependency
+export const getDownloadIconAltTag = () => defineMessages({
+  ALT_TAG: {
+    id: 'downloads.page.download.icon.alt.tag',
+    defaultMessage: 'The icon used to indicate that the file is downloadable',
+    description: 'Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable',
+  },
+});
+
+export const DOWNLOAD_LINKS = {
+  LINK1: <FormattedMessage
+    id={'download.page.download.file.1'}
+    defaultMessage={`
+      <link1>Communities list data</link1> (.xlsx {cldXlsFileSize})
+      `}
+    description={'Navigate to the download page. This is first download file link'}
+    values={{
+      link1: COMMON_COPY.downloadLink(DOWNLOAD_FILES.COMMUNITIES_LIST_XLS.URL),
+      cldXlsFileSize: <FormattedNumber
+        value={DOWNLOAD_FILES.COMMUNITIES_LIST_XLS.SIZE}
+        style="unit"
+        unit="megabyte"
+        unitDisplay="narrow"
+      />,
+    }}
+  />,
+  LINK2: <FormattedMessage
+    id={'download.page.download.file.2'}
+    defaultMessage={`<link2>Communities list data</link2> (.csv {cldCsvFileSize})`}
+    description={'Navigate to the download page. This is second download file link'}
+    values={{
+      link2: COMMON_COPY.downloadLink(DOWNLOAD_FILES.COMMUNITIES_LIST_CSV.URL),
+      cldCsvFileSize: <FormattedNumber
+        value={DOWNLOAD_FILES.COMMUNITIES_LIST_CSV.SIZE}
+        style="unit"
+        unit="megabyte"
+        unitDisplay="narrow"
+      />,
+    }}
+  />,
+  LINK3: <FormattedMessage
+    id={'download.page.download.file.3'}
+    defaultMessage={`<link3>Shapefile</link3> (Codebook included with geojson {shapeFileSize} unzipped)`}
+    description={'Navigate to the download page. This is third download file link'}
+    values={{
+      link3: COMMON_COPY.downloadLink(DOWNLOAD_FILES.SHAPE_FILE.URL),
+      shapeFileSize: <FormattedNumber
+        value={DOWNLOAD_FILES.SHAPE_FILE.SIZE}
+        style="unit"
+        unit="megabyte"
+        unitDisplay="narrow"
+      />,
+    }}
+  />,
+  LINK4: <FormattedMessage
+    id={'download.page.download.file.4'}
+    defaultMessage={`<link4>Technical support document</link4> (.pdf {tsdFileSize})`}
+    description={'Navigate to the download page. This is fourth download file link'}
+    values={{
+      link4: COMMON_COPY.linkFn(DOWNLOAD_FILES.TSD.URL, false, true),
+      tsdFileSize: <FormattedNumber
+        value={DOWNLOAD_FILES.TSD.SIZE}
+        style="unit"
+        unit="megabyte"
+        unitDisplay="narrow"
+      />,
+    }}
+  />,
+  LINK5: <FormattedMessage
+    id={'download.page.download.file.5'}
+    defaultMessage={`<link5>How to use the list of communities</link5> (.pdf {howToCommFileSize})`}
+    description={'Navigate to the download page. This is fifth download file link'}
+    values={{
+      link5: COMMON_COPY.linkFn(DOWNLOAD_FILES.HOW_TO_COMMUNITIES.URL, false, true),
+      howToCommFileSize: <FormattedNumber
+        value={DOWNLOAD_FILES.HOW_TO_COMMUNITIES.SIZE}
+        style="unit"
+        unit="kilobyte"
+        unitDisplay="narrow"
+      />,
+    }}
+  />,
+  // };
 };
diff --git a/client/src/data/copy/explore.tsx b/client/src/data/copy/explore.tsx
index 61238dcf..150718a7 100644
--- a/client/src/data/copy/explore.tsx
+++ b/client/src/data/copy/explore.tsx
@@ -5,8 +5,8 @@ import {defineMessages} from 'react-intl';
 import {FormattedDate, FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
 
 import * as COMMON_COPY from './common';
+import * as DOWNLOADS_COPY from './downloads';
 import * as METHODOLOGY_COPY from './methodology';
-import {simpleLink, linkFn} from './common';
 import {PAGES_ENDPOINTS} from '../constants';
 
 export const PAGE_INTRO = defineMessages({
@@ -32,7 +32,7 @@ export const PAGE_DESCRIPTION = <FormattedMessage
     `}
   description={'On the explore the map page, the description of the page'}
   values={{
-    link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
+    link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
   }}
 />;
 
@@ -777,15 +777,15 @@ export const DOWNLOAD_DRAFT = {
       map that will download the data packet
     `}
     values={{
-      link1: simpleLink(METHODOLOGY_COPY.DOWNLOAD_ZIP_URL),
+      link1: COMMON_COPY.downloadLink(DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.URL),
       downloadFileSize: <FormattedNumber
-        value={METHODOLOGY_COPY.DOWNLOAD_FILE_SIZE}
+        value={DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.SIZE}
         style="unit"
         unit="megabyte"
         unitDisplay="narrow"
       />,
       dateUpdated: <FormattedDate
-        value={METHODOLOGY_COPY.DOWNLOAD_ZIP_LAST_UPDATED}
+        value={DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.LAST_UPDATED}
         year="2-digit"
         month="2-digit"
         day="2-digit"
@@ -809,7 +809,7 @@ export const NOTE_ON_TERRITORIES = {
     `}
     description={`Navigate to the explore the map page. Under the map, you will see territories paragraph 1`}
     values={{
-      link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
+      link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
     }}
   />,
   PARA_2: <FormattedMessage
@@ -863,10 +863,10 @@ export const NOTE_ON_TRIBAL_NATIONS = {
     `}
     description={`Navigate to the explore the map page. Under the map, you will see tribal nations paragraph 1`}
     values={{
-      link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
-      link2: linkFn(`https://www.whitehouse.gov/wp-content/uploads/2022/01/CEQ-Tribal-Consultation-Plan-04.26.2021.pdf`, false, true),
-      link3: linkFn(`https://www.whitehouse.gov/briefing-room/presidential-actions/2021/01/26/memorandum-on-tribal-consultation-and-strengthening-nation-to-nation-relationships/`, false, true),
-      link4: linkFn(`https://www.federalregister.gov/documents/2000/11/09/00-29003/consultation-and-coordination-with-indian-tribal-governments`, false, true),
+      link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
+      link2: COMMON_COPY.linkFn(`https://www.whitehouse.gov/wp-content/uploads/2022/01/CEQ-Tribal-Consultation-Plan-04.26.2021.pdf`, false, true),
+      link3: COMMON_COPY.linkFn(`https://www.whitehouse.gov/briefing-room/presidential-actions/2021/01/26/memorandum-on-tribal-consultation-and-strengthening-nation-to-nation-relationships/`, false, true),
+      link4: COMMON_COPY.linkFn(`https://www.federalregister.gov/documents/2000/11/09/00-29003/consultation-and-coordination-with-indian-tribal-governments`, false, true),
     }}
   />,
 };
@@ -884,7 +884,7 @@ export const HOW_YOU_CAN_HELP_LIST_ITEMS = {
     `}
     defaultMessage={`View the <link1>Methodology & data</link1> page and send feedback.`}
     values={{
-      link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
+      link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
     }}
   />,
   LIST_ITEM_2: <FormattedMessage
@@ -892,16 +892,13 @@ export const HOW_YOU_CAN_HELP_LIST_ITEMS = {
     description={`Navigate to the explore the map page. Under the map, you will see share your feedback`}
     defaultMessage={`Use the map to find communities and <link1>share your feedback</link1>.`}
     values={{
-      link1: linkFn(`mailto:${COMMON_COPY.FEEDBACK_EMAIL}`, false, true),
+      link1: COMMON_COPY.linkFn(`mailto:${COMMON_COPY.FEEDBACK_EMAIL}`, false, true),
     }}
   />,
   LIST_ITEM_3: <FormattedMessage
     id={'explore.map.page.under.map.how.you.can.help.list.item.3'}
-    description={`Navigate to the explore the map page. Under the map, you will see share your feedback`}
-    defaultMessage={`Respond to our Request for Information on <link1>federalregister.gov</link1>.`}
-    values={{
-      link1: linkFn(`https://www.federalregister.gov/d/2022-03920`, false, true),
-    }}
+    description={`Navigate to the explore the map page. Under the map, you will see RFI is expired`}
+    defaultMessage={`The Request for Information on the Federal Register is now closed.`}
   />,
 
 };
diff --git a/client/src/data/copy/methodology.tsx b/client/src/data/copy/methodology.tsx
index 66a14484..dcdf505d 100644
--- a/client/src/data/copy/methodology.tsx
+++ b/client/src/data/copy/methodology.tsx
@@ -1,9 +1,10 @@
 /* eslint-disable max-len */
 import React from 'react';
 import {defineMessages} from 'react-intl';
-import {FormattedDate, FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
+import {FormattedMessage} from 'gatsby-plugin-intl';
 import {boldFn, linkFn, simpleLink} from './common';
-import * as styles from '../../components/DownloadPacket/downloadPacket.module.scss';
+
+export const VERSION_NUMBER = 0.1;
 
 export const PAGE = defineMessages({
   TILE: {
@@ -40,7 +41,6 @@ export const PAGE = defineMessages({
 
 });
 
-
 export const FORMULA = {
   INTRO: <FormattedMessage
     id={'methodology.page.formula.intro'}
@@ -72,143 +72,6 @@ export const FORMULA = {
   />,
 };
 
-// Download Package
-export const DOWNLOAD_FILE_SIZE = 53;
-export const DOWNLOAD_SHAPE_FILE_SIZE = 742;
-export const DOWNLOAD_TSD_FILE_SIZE = 2.5;
-export const DOWNLOAD_ZIP_LAST_UPDATED = new Date('5/4/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;
-
-export const DOWNLOAD_ZIP_URL = [
-  process.env.GATSBY_CDN_TILES_BASE_URL,
-  process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
-  process.env.GATSBY_SCORE_DOWNLOAD_FILE_PATH,
-].join('/');
-
-export const DOWNLOAD_SHAPEFILE_URL = [
-  process.env.GATSBY_CDN_TILES_BASE_URL,
-  process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
-  process.env.GATSBY_SHAPE_FILE_PATH,
-].join('/');
-
-// TSD = Tech Support Document
-export const DOWNLOAD_TSD_URL = [
-  process.env.GATSBY_CDN_TILES_BASE_URL,
-  process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
-  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={`<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, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a <callout>codebook</callout>, {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"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-      shapefileSize: <FormattedNumber
-        value={DOWNLOAD_SHAPE_FILE_SIZE}
-        style="unit"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-      tsdFileSize: <FormattedNumber
-        value={DOWNLOAD_TSD_FILE_SIZE}
-        style="unit"
-        unit="megabyte"
-        unitDisplay="narrow"
-      />,
-    }}
-  />,
-  ZIP_LAST_UPDATED: <FormattedMessage
-    id={'methodology.page.downloadPacket.info.zip.last.updated'}
-    defaultMessage={`Last updated: {downloadLastUpdated} `}
-    description={'Navigate to the methodology page. This is the download packet info last updated'}
-    values={{
-      downloadLastUpdated: <FormattedDate
-        value={DOWNLOAD_ZIP_LAST_UPDATED}
-        year="2-digit"
-        month="2-digit"
-        day="2-digit"
-      />,
-    }}
-  />,
-  SHAPE_LAST_UPDATED: <FormattedMessage
-    id={'methodology.page.downloadPacket.info.shape.last.updated'}
-    defaultMessage={`Last updated: {shapeLastUpdated} `}
-    description={'Navigate to the methodology page. This is the download packet info last updated'}
-    values={{
-      shapeLastUpdated: <FormattedDate
-        value={DOWNLOAD_SHAPE_LAST_UPDATED}
-        year="2-digit"
-        month="2-digit"
-        day="2-digit"
-      />,
-    }}
-  />,
-  TSD_LAST_UPDATED: <FormattedMessage
-    id={'methodology.page.downloadPacket.info.tsd.last.updated'}
-    defaultMessage={`Last updated: {tsdLastUpdated} `}
-    description={'Navigate to the methodology page. This is the download packet info last updated'}
-    values={{
-      tsdLastUpdated: <FormattedDate
-        value={DOWNLOAD_TSD_LAST_UPDATED}
-        year="2-digit"
-        month="2-digit"
-        day="2-digit"
-      />,
-    }}
-  />,
-  BUTTON_TEXT1: <FormattedMessage
-    id={'methodology.page.downloadPacket.button1.text'}
-    defaultMessage={'Download data sources'}
-    description={'Navigate to the methodology page. This is the download packet button text'}
-  />,
-  BUTTON_TEXT2: <FormattedMessage
-    id={'methodology.page.downloadPacket.button2.text'}
-    defaultMessage={'Download shapefile'}
-    description={'Navigate to the methodology page. This is the download shapefiles text'}
-  />,
-  BUTTON_TEXT3: <FormattedMessage
-    id={'methodology.page.downloadPacket.button3.text'}
-    defaultMessage={'Download technical support document'}
-    description={'Navigate to the methodology page. This is the download technical support document spreadsheet'}
-  />,
-  NEW_TAG: <FormattedMessage
-    id={'methodology.page.downloadPacket.new.tag.text'}
-    defaultMessage={`<boldtag>NEW</boldtag>`}
-    description={'Navigate to the methodology page. This is the new tag text'}
-    values={{
-      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 = {
   HEADING: <FormattedMessage
     id={'methodology.page.indicator.categories.heading'}
diff --git a/client/src/intl/en.json b/client/src/intl/en.json
index 4cacf94c..c489c2e8 100644
--- a/client/src/intl/en.json
+++ b/client/src/intl/en.json
@@ -272,7 +272,7 @@
     "description": "Navigate to the contact page, this is the contact page header text"
   },
   "contact.page.request.for.info.box.body": {
-    "defaultMessage": "During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQ’s Request for Information available on <link1>federalregister.gov</link1>.",
+    "defaultMessage": "The Request for Information on the Federal Register for the public beta period closed on {rfiExpDate}",
     "description": "Navigate to the contact page, this is the body of the request for information box"
   },
   "contact.page.request.for.info.box.title": {
@@ -287,17 +287,33 @@
     "defaultMessage": "Contact",
     "description": "Navigate to the contact page, this is the contact page title text"
   },
-  "downloads.page.csv.link": {
-    "defaultMessage": "<link1>CSV file </link1> (.csv {csvFileSize} unzipped)",
-    "description": "On the downloads page, the description of the csv link"
+  "download.page.download.file.1": {
+    "defaultMessage": "<link1>Communities list data</link1> (.xlsx {cldXlsFileSize})",
+    "description": "Navigate to the download page. This is first download file link"
+  },
+  "download.page.download.file.2": {
+    "defaultMessage": "<link2>Communities list data</link2> (.csv {cldCsvFileSize})",
+    "description": "Navigate to the download page. This is second download file link"
+  },
+  "download.page.download.file.3": {
+    "defaultMessage": "<link3>Shapefile</link3> (Codebook included with geojson {shapeFileSize} unzipped)",
+    "description": "Navigate to the download page. This is third download file link"
+  },
+  "download.page.download.file.4": {
+    "defaultMessage": "<link4>Technical support document</link4> (.pdf {tsdFileSize})",
+    "description": "Navigate to the download page. This is fourth download file link"
+  },
+  "download.page.download.file.5": {
+    "defaultMessage": "<link5>How to use the list of communities</link5> (.pdf {howToCommFileSize})",
+    "description": "Navigate to the download page. This is fifth download file link"
   },
   "downloads.page.description1.text": {
     "defaultMessage": "The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:",
     "description": "Navigate to the Downloads page, this will be the page description1 text"
   },
-  "downloads.page.excel.link": {
-    "defaultMessage": "<link1>Excel file</link1> (.xlxs {excelFileSize} unzipped)",
-    "description": "On the downloads page, the description of the excel link"
+  "downloads.page.download.icon.alt.tag": {
+    "defaultMessage": "The icon used to indicate that the file is downloadable",
+    "description": "Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable"
   },
   "downloads.page.heading1.text": {
     "defaultMessage": "Downloads",
@@ -307,10 +323,6 @@
     "defaultMessage": "File formats",
     "description": "Navigate to the Downloads page, this will be the page heading2 text"
   },
-  "downloads.page.shape.link": {
-    "defaultMessage": "<link1>Shapefiles </link1> (Codebook included with geojson {shapeFileSize} unzipped)",
-    "description": "On the downloads page, the description of the shapefiles link"
-  },
   "downloads.page.title.text": {
     "defaultMessage": "Downloads",
     "description": "Navigate to the Downloads page, this will be the page title text"
@@ -816,8 +828,8 @@
     "description": "Navigate to the explore the map page. Under the map, you will see share your feedback"
   },
   "explore.map.page.under.map.how.you.can.help.list.item.3": {
-    "defaultMessage": "Respond to our Request for Information on <link1>federalregister.gov</link1>.",
-    "description": "Navigate to the explore the map page. Under the map, you will see share your feedback"
+    "defaultMessage": "The Request for Information on the Federal Register is now closed.",
+    "description": "Navigate to the explore the map page. Under the map, you will see RFI is expired"
   },
   "explore.map.page.under.map.note.on.territories.intro": {
     "defaultMessage": "A note on the U.S. territories",
@@ -1235,46 +1247,6 @@
     "defaultMessage": "All categories",
     "description": "Navigate to the methodology page. Navigate to the dataset section. This is the portion of the dataset card Used In text for all methodologies"
   },
-  "methodology.page.downloadPacket.button1.text": {
-    "defaultMessage": "Download data sources",
-    "description": "Navigate to the methodology page. This is the download packet button text"
-  },
-  "methodology.page.downloadPacket.button2.text": {
-    "defaultMessage": "Download shapefile",
-    "description": "Navigate to the methodology page. This is the download shapefiles text"
-  },
-  "methodology.page.downloadPacket.button3.text": {
-    "defaultMessage": "Download technical support document",
-    "description": "Navigate to the methodology page. This is the download technical support document spreadsheet"
-  },
-  "methodology.page.downloadPacket.header.text": {
-    "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": {
-    "defaultMessage": "Last updated: {shapeLastUpdated}",
-    "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, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a <callout>codebook</callout>, {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": {
-    "defaultMessage": "Last updated: {tsdLastUpdated}",
-    "description": "Navigate to the methodology page. This is the download packet info last updated"
-  },
-  "methodology.page.downloadPacket.info.zip.last.updated": {
-    "defaultMessage": "Last updated: {downloadLastUpdated}",
-    "description": "Navigate to the methodology page. This is the download packet info last updated"
-  },
-  "methodology.page.downloadPacket.new.tag.text": {
-    "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"
diff --git a/client/src/intl/es.json b/client/src/intl/es.json
index 11c2a6b0..34c24fba 100644
--- a/client/src/intl/es.json
+++ b/client/src/intl/es.json
@@ -67,12 +67,17 @@
     "contact.page.fab.survey.text": "Ayude a mejorar el sitio web y los datos",
     "contact.page.general": "Para comentarios generales, envíe un correo eléctronico a {general_email_address}.",
     "contact.page.header.text": "Contacto",
-    "contact.page.request.for.info.box.body": "Durante el periodo beta, se pueden enviar comentarios sobre la Herramienta para la evaluación de la justicia climática y económica mediante la Solicitud de información del CEQ que se encuentra disponible en <link1>federalregister.gov</link1>.",
+    "contact.page.request.for.info.box.body": "La Solicitud de Información en el Registro Federal para el período beta público cerró el {rfiExpDate}",
     "contact.page.request.for.info.box.title": "Solicitud de información",
     "contact.page.sub.header.text": "Envíenos un correo electrónico",
     "contact.page.title.text": "Contacto",
-    "downloads.page.csv.link": "<link1>Archivo CSV </link1> (.csv {csvFileSize} descomprimido)",
+    "download.page.download.file.1": "<link1>Datos de la lista de comunidades</link1> (.xlsx {cldXlsFileSize})",
+    "download.page.download.file.2": "<link2>Datos de la lista de comunidades</link2> (.csv {cldCsvFileSize})",
+    "download.page.download.file.3": "<link3>Archivo de forma</link3> (Libro de códigos incluido con geojson {shapeFileSize} descomprimido)",
+    "download.page.download.file.4": "<link4>Documento de soporte técnico</link4> (.pdf {tsdFileSize})",
+    "download.page.download.file.5": "<link5>Cómo utilizar la lista de comunidades</link5> (.pdf {howToCommFileSize})",
     "downloads.page.description1.text": "Los conjuntos de datos que se utilizan en la herramienta, junto con un diccionario de datos e información sobre cómo utilizar la lista de comunidades (.pdf) están disponibles en los siguientes formatos del archivo:",
+    "downloads.page.download.icon.alt.tag": "El icono utilizado para indicar que el archivo se puede descargar",
     "downloads.page.excel.link": "<link1>Archivo Excel</link1> (.xlxs {excelFileSize} descomprimido)",
     "downloads.page.heading1.text": "Descargas",
     "downloads.page.heading2.text": "Formatos del archivo",
@@ -205,7 +210,7 @@
     "explore.map.page.under.map.how.you.can.help.heading": "Contribuya a mejorar la herramienta",
     "explore.map.page.under.map.how.you.can.help.list.item.1": "Vaya a la página <link1>Metodología y datos</link1> y envíe sus comentarios.",
     "explore.map.page.under.map.how.you.can.help.list.item.2": "Use la herramienta para buscar comunidades y <link1>enviar sus comentarios</link1>.",
-    "explore.map.page.under.map.how.you.can.help.list.item.3": "En <link1>federalregister.gov</link1>, responda a nuestra Solicitud de información.",
+    "explore.map.page.under.map.how.you.can.help.list.item.3": "La Solicitud de Información en el Registro Federal ya está cerrada.",
     "explore.map.page.under.map.note.on.territories.intro": "Observaciones sobre los territorios de los Estados Unidos",
     "explore.map.page.under.map.note.on.territories.para.1": "Las fuentes de datos que se describen en la página <link1>Metodología y datos</link1> se usan para identificar las comunidades desfavorecidas en los cincuenta estados y el Distrito de Columbia. No obstante, no todas estas fuentes de datos están disponibles actualmente para los territorios de los EE. UU.",
     "explore.map.page.under.map.note.on.territories.para.2": "Para Puerto Rico, se usan los datos de la Encuesta sobre la Comunidad Estadounidense (ACS, por sus siglas en inglés) de 2015 a 2019 de la Oficina del Censo para la tasa de inscripción en educación superior y los demás campos de la categoría Capacitación y desarrollo de la fuerza laboral a fin de identificar las comunidades desfavorecidas. Por ahora, no se dispone de datos en las demás categorías.",
diff --git a/client/src/pages/downloads.tsx b/client/src/pages/downloads.tsx
index fbd5b3f7..7c8bc3e5 100644
--- a/client/src/pages/downloads.tsx
+++ b/client/src/pages/downloads.tsx
@@ -4,37 +4,64 @@ 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';
 
 import * as DOWNLOADS_COPY from '../data/copy/downloads';
-
+import * as CONSTANTS from '../data/constants';
 interface IDownloadsPageProps {
   location: Location;
 }
 
 const DownloadsPage = ({location}: IDownloadsPageProps) => {
   const intl = useIntl();
+  const {width} = useWindowSize();
 
   return (
     <Layout location={location} title={intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_TILE)}>
 
       <J40MainGridContainer>
 
-        <h1>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING1)}</h1>
+        <section className={'page-heading'}>
+          <h1>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING1)}</h1>
+          <PublicEngageButton />
+        </section>
 
-        <Grid desktop={{col: 8}}>
-          <h2>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING2)}</h2>
-          <p>
-            {intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_DESCRIPTION1)}
-          </p>
-          <p>
-            {DOWNLOADS_COPY.DOWNLOAD_LINKS.EXCEL}
-          </p>
-          <p>
-            {DOWNLOADS_COPY.DOWNLOAD_LINKS.CSV}
-          </p>
-          <p>
-            {DOWNLOADS_COPY.DOWNLOAD_LINKS.SHAPE}
-          </p>
+        <Grid row gap className={'j40-mb5-mt3'}>
+
+          <Grid col={12} tablet={{col: 8}}>
+            <h2>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING2)}</h2>
+            <p>
+              {intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_DESCRIPTION1)}
+            </p>
+            <p>
+              {DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK1}
+            </p>
+            <p>
+              {DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK2}
+            </p>
+            <p>
+              {DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK3}
+            </p>
+            <p>
+              {DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK4}
+            </p>
+            <p>
+              {DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK5}
+            </p>
+          </Grid>
+
+          {/* Second column */}
+          <Grid col={12} tablet={{col: 1}}>
+            {/* Spacer column */}
+          </Grid>
+
+          {/* Third column - Only show the SubPagNav component on desktop width */}
+          {width > CONSTANTS.USWDS_BREAKPOINTS.DESKTOP ?
+          <Grid col={12} tablet={{col: 3}}>
+            <SubPageNav activeSubPageIndex={2}/>
+          </Grid> : ''}
         </Grid>
 
       </J40MainGridContainer>
diff --git a/client/src/pages/methodology.tsx b/client/src/pages/methodology.tsx
index b1797253..7a13d839 100644
--- a/client/src/pages/methodology.tsx
+++ b/client/src/pages/methodology.tsx
@@ -4,12 +4,14 @@ import {useIntl} from 'gatsby-plugin-intl';
 
 import Categories from '../components/Categories';
 import DatasetContainer from '../components/DatasetContainer';
-import DownloadPacket from '../components/DownloadPacket';
 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';
 
+import * as CONSTANTS from '../data/constants';
 import * as METHODOLOGY_COPY from '../data/copy/methodology';
 
 interface MethodPageProps {
@@ -18,6 +20,7 @@ interface MethodPageProps {
 
 const IndexPage = ({location}: MethodPageProps) => {
   const intl = useIntl();
+  const {width} = useWindowSize();
 
   return (
     <Layout location={location} title={intl.formatMessage(METHODOLOGY_COPY.PAGE.TILE)}>
@@ -51,9 +54,15 @@ const IndexPage = ({location}: MethodPageProps) => {
           </Grid>
 
           {/* Second column */}
-          <Grid col={12} tablet={{col: 4}}>
-            <DownloadPacket />
+          <Grid col={12} tablet={{col: 1}}>
+            {/* Spacer column */}
           </Grid>
+
+          {/* Third column */}
+          {width > CONSTANTS.USWDS_BREAKPOINTS.DESKTOP ?
+          <Grid col={12} tablet={{col: 3}}>
+            <SubPageNav activeSubPageIndex={1}/>
+          </Grid> : ''}
         </Grid>
       </J40MainGridContainer>
 
diff --git a/client/src/pages/tests/__snapshots__/about.test.tsx.snap b/client/src/pages/tests/__snapshots__/about.test.tsx.snap
index 42cd4da3..e028de3e 100644
--- a/client/src/pages/tests/__snapshots__/about.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/about.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
@@ -391,14 +349,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
           About
         </h1>
         <div>
-          <div>
-            <span
-              class="usa-tag"
-              data-testid="tag"
-            >
-              UPDATED
-            </span>
-          </div>
           <a
             href="/en/public-engagement"
           >
diff --git a/client/src/pages/tests/__snapshots__/contact.test.tsx.snap b/client/src/pages/tests/__snapshots__/contact.test.tsx.snap
index 445d48b0..2e9eba0e 100644
--- a/client/src/pages/tests/__snapshots__/contact.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/contact.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
@@ -389,14 +347,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
           Contact
         </h1>
         <div>
-          <div>
-            <span
-              class="usa-tag"
-              data-testid="tag"
-            >
-              UPDATED
-            </span>
-          </div>
           <a
             href="/en/public-engagement"
           >
@@ -499,30 +449,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
                 class="usa-summary-box__text"
               >
                 <p>
-                  During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQ’s Request for Information available on 
-                  <a
-                    class="usa-link usa-link--external"
-                    data-cy=""
-                    href="https://www.federalregister.gov/d/2022-03920"
-                    rel="noreferrer"
-                    target="_blank"
-                  >
-                    federalregister.gov
-                  </a>
-                  .
-                </p>
-                <p>
-                  The public comment period for 
-                  <a
-                    class="usa-link usa-link--external"
-                    data-cy=""
-                    href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-                    rel="noreferrer"
-                    target="_blank"
-                  >
-                    sending feedback
-                  </a>
-                   via the Request for Information has been extended to May 25, 2022.
+                  The Request for Information on the Federal Register for the public beta period closed on May 25, 2022
                 </p>
               </div>
             </div>
diff --git a/client/src/pages/tests/__snapshots__/downloads.test.tsx.snap b/client/src/pages/tests/__snapshots__/downloads.test.tsx.snap
index c289baae..4e06dc5d 100644
--- a/client/src/pages/tests/__snapshots__/downloads.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/downloads.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
@@ -382,52 +340,119 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
       class="grid-container-desktop-lg"
       data-testid="gridContainer"
     >
-      <h1>
-        Downloads
-      </h1>
+      <section
+        class="page-heading"
+      >
+        <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="desktop:grid-col-8"
+        class="grid-row grid-gap j40-mb5-mt3"
         data-testid="grid"
       >
-        <h2>
-          File formats
-        </h2>
-        <p>
-          The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:
-        </p>
-        <p>
-          
-        
-          <a
-            href="/about"
-          >
-            Excel file
-          </a>
-           (.xlxs 54MB unzipped)
+        <div
+          class="grid-col-12 tablet:grid-col-8"
+          data-testid="grid"
+        >
+          <h2>
+            File formats
+          </h2>
+          <p>
+            The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:
+          </p>
+          <p>
+            
       
-        </p>
-        <p>
-          
-        
-          <a
-            href="/csv"
-          >
-            CSV file 
-          </a>
-           (.csv 52MB unzipped)
+            <a
+              download=""
+              href="//"
+            >
+              Communities list data
+            </a>
+            <img
+              alt="The icon used to indicate that the file is downloadable"
+              src="test-file-stub"
+            />
+             (.xlsx 24.9MB)
       
-        </p>
-        <p>
-          
-        
-          <a
-            href="/shape"
-          >
-            Shapefiles 
-          </a>
-           (Codebook included with geojson 110MB unzipped)
-      
-        </p>
+          </p>
+          <p>
+            <a
+              download=""
+              href="//"
+            >
+              Communities list data
+            </a>
+            <img
+              alt="The icon used to indicate that the file is downloadable"
+              src="test-file-stub"
+            />
+             (.csv 28.1MB)
+          </p>
+          <p>
+            <a
+              download=""
+              href="//"
+            >
+              Shapefile
+            </a>
+            <img
+              alt="The icon used to indicate that the file is downloadable"
+              src="test-file-stub"
+            />
+             (Codebook included with geojson 741MB unzipped)
+          </p>
+          <p>
+            <a
+              class="usa-link usa-link--external"
+              data-cy=""
+              href="//"
+              rel="noreferrer"
+              target="_blank"
+            >
+              Technical support document
+            </a>
+             (.pdf 2.5MB)
+          </p>
+          <p>
+            <a
+              class="usa-link usa-link--external"
+              data-cy=""
+              href="//"
+              rel="noreferrer"
+              target="_blank"
+            >
+              How to use the list of communities
+            </a>
+             (.pdf 674kB)
+          </p>
+        </div>
+        <div
+          class="grid-col-12 tablet:grid-col-1"
+          data-testid="grid"
+        />
       </div>
     </div>
   </main>
diff --git a/client/src/pages/tests/__snapshots__/freqAskedQuestions.test.tsx.snap b/client/src/pages/tests/__snapshots__/freqAskedQuestions.test.tsx.snap
index 9139b428..6e63debc 100644
--- a/client/src/pages/tests/__snapshots__/freqAskedQuestions.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/freqAskedQuestions.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
diff --git a/client/src/pages/tests/__snapshots__/methodology.test.tsx.snap b/client/src/pages/tests/__snapshots__/methodology.test.tsx.snap
index b9bf0017..7deb9c48 100644
--- a/client/src/pages/tests/__snapshots__/methodology.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/methodology.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
@@ -389,14 +347,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
           Methodology
         </h1>
         <div>
-          <div>
-            <span
-              class="usa-tag"
-              data-testid="tag"
-            >
-              UPDATED
-            </span>
-          </div>
           <a
             href="/en/public-engagement"
           >
@@ -475,152 +425,9 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
           </section>
         </div>
         <div
-          class="grid-col-12 tablet:grid-col-4"
+          class="grid-col-12 tablet:grid-col-1"
           data-testid="grid"
-        >
-          <div
-            class=""
-            data-testid="grid"
-          >
-            <div>
-              <div>
-                <div>
-                  <div>
-                    <span>
-                      NEW
-                    </span>
-                     files available for download
-                  </div>
-                  <div>
-                    Download the data sources used in the CEJST (.csv, .xlxs, 
-                    <span>
-                      .pdf
-                    </span>
-                     that describes how to use the list, and a 
-                    <span>
-                      codebook
-                    </span>
-                    , 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=""
-                      href="//"
-                    >
-                      <button
-                        class="usa-button"
-                        data-testid="button"
-                        type="button"
-                      >
-                        <span>
-                          <img
-                            alt="download icon for download package"
-                            src="test-file-stub"
-                          />
-                        </span>
-                        <span>
-                          Download data sources
-                        </span>
-                      </button>
-                    </a>
-                  </div>
-                  <div>
-                    Last updated: 05/04/22 
-                  </div>
-                  <div>
-                    <div>
-                      <span
-                        class="usa-tag"
-                        data-testid="tag"
-                      >
-                        <strong>
-                          Updated
-                        </strong>
-                      </span>
-                    </div>
-                    <a
-                      data-cy="shapefile-link"
-                      download=""
-                      href="//"
-                    >
-                      <button
-                        class="usa-button"
-                        data-testid="button"
-                        type="button"
-                      >
-                        <span>
-                          <img
-                            alt="download icon for download package"
-                            src="test-file-stub"
-                          />
-                        </span>
-                        <span>
-                          Download shapefile
-                        </span>
-                      </button>
-                    </a>
-                  </div>
-                  <div>
-                    Last updated: 04/26/22 
-                  </div>
-                  <div>
-                    <div>
-                      <span
-                        class="usa-tag"
-                        data-testid="tag"
-                      >
-                        <strong>
-                          NEW
-                        </strong>
-                      </span>
-                    </div>
-                    <a
-                      data-cy="tsd-link"
-                      download=""
-                      href="//"
-                      rel="noreferrer"
-                      target="_blank"
-                    >
-                      <button
-                        class="usa-button"
-                        data-testid="button"
-                        type="button"
-                      >
-                        <span>
-                          <img
-                            alt="download icon for download package"
-                            src="test-file-stub"
-                          />
-                        </span>
-                        <span>
-                          Download technical support document
-                        </span>
-                      </button>
-                    </a>
-                  </div>
-                  <div>
-                    Last updated: 04/19/22 
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
+        />
       </div>
     </div>
     <div
diff --git a/client/src/pages/tests/__snapshots__/publicEng.test.tsx.snap b/client/src/pages/tests/__snapshots__/publicEng.test.tsx.snap
index 7b4befd6..0b7ab9f2 100644
--- a/client/src/pages/tests/__snapshots__/publicEng.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/publicEng.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
diff --git a/client/src/pages/tests/__snapshots__/techSupportDoc.test.tsx.snap b/client/src/pages/tests/__snapshots__/techSupportDoc.test.tsx.snap
index 07d95e5a..1a485e4d 100644
--- a/client/src/pages/tests/__snapshots__/techSupportDoc.test.tsx.snap
+++ b/client/src/pages/tests/__snapshots__/techSupportDoc.test.tsx.snap
@@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
               <li
                 class="usa-nav__primary-item"
               >
-                <a
-                  data-cy="nav-link-methodology"
-                  href="/en/methodology"
+                <button
+                  aria-controls="methMenu"
+                  aria-expanded="true"
+                  class="usa-accordion__button usa-nav__link"
+                  data-cy="nav-dropdown-methodology"
+                  data-testid="navDropDownButton"
+                  type="button"
                 >
-                  Methodology & data
-                </a>
+                  <span>
+                    Methodology & data
+                  </span>
+                </button>
+                <ul
+                  class="usa-nav__submenu"
+                  id="methMenu"
+                >
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-methodology"
+                      href="/en/methodology"
+                    >
+                      Methodology & data
+                    </a>
+                  </li>
+                  <li
+                    class="usa-nav__submenu-item"
+                  >
+                    <a
+                      data-cy="nav-link-downloads"
+                      href="/en/downloads"
+                    >
+                      Downloads
+                    </a>
+                  </li>
+                </ul>
               </li>
               <li
                 class="usa-nav__primary-item"
@@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
         </div>
       </div>
     </div>
-    <div
-      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 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
-              rel="noreferrer"
-              target="_blank"
-            >
-              technical support
-            </a>
-             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"
-      >
-        <div
-          class="usa-alert__body"
-        >
-          <h4
-            class="usa-alert__heading"
-          >
-            Public comment period extended
-          </h4>
-          <p
-            class="usa-alert__text"
-          >
-            The public comment period for 
-            <a
-              class="usa-link usa-link--external"
-              data-cy=""
-              href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
-              rel="noreferrer"
-              target="_blank"
-            >
-              sending feedback
-            </a>
-             via the Request for Information has been extended to May 25, 2022.
-          </p>
-        </div>
-      </div>
-    </div>
   </header>
   <main
     id="main-content"
diff --git a/client/src/styles/global.scss b/client/src/styles/global.scss
index 96b703e9..ff981976 100644
--- a/client/src/styles/global.scss
+++ b/client/src/styles/global.scss
@@ -139,7 +139,6 @@ components include:
   }
 }
 
-
 /* 
 ******************************
 *      FOOTER STYLES