diff --git a/.eslintrc.json b/.eslintrc.json index 3722418..2502e77 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,3 +1,14 @@ { - "extends": ["next/core-web-vitals", "next/typescript"] + "extends": [ + "next/core-web-vitals", + "next/typescript", + "eslint:recommended", + "plugin:react/recommended", + "plugin:@typescript-eslint/recommended", + "prettier" + ], + "plugins": ["react", "@typescript-eslint"], + "rules": { + "react/react-in-jsx-scope": "off" + } } diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 41b857d..fc903ca 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -30,7 +30,7 @@ jobs: - name: Setup Node uses: actions/setup-node@v3 with: - node-version: "18" + node-version: '18' cache: ${{ steps.detect-package-manager.outputs.manager }} - name: Setup Pages uses: actions/configure-pages@v2 @@ -61,7 +61,7 @@ jobs: - name: Audit URLs using Lighthouse uses: treosh/lighthouse-ci-action@v9 with: - configPath: "./lighthouserc.yml" + configPath: './lighthouserc.yml' uploadArtifacts: false # save results as an action artifacts temporaryPublicStorage: false # upload lighthouse report to the temporary storage diff --git a/.github/workflows/pages.yml b/.github/workflows/pages.yml index f32b1b2..430236c 100644 --- a/.github/workflows/pages.yml +++ b/.github/workflows/pages.yml @@ -7,7 +7,7 @@ name: Deploy Next.js site to Pages on: # Runs on pushes targeting the default branch push: - branches: ["main"] + branches: ['main'] # Allows you to run this workflow manually from the Actions tab workflow_dispatch: @@ -20,7 +20,7 @@ permissions: # Allow one concurrent deployment concurrency: - group: "pages" + group: 'pages' cancel-in-progress: true jobs: @@ -50,7 +50,7 @@ jobs: - name: Setup Node uses: actions/setup-node@v3 with: - node-version: "18" + node-version: '18' cache: ${{ steps.detect-package-manager.outputs.manager }} - name: Setup Pages uses: actions/configure-pages@v2 diff --git a/.prettierrc b/.prettierrc index 0967ef4..43cc3e4 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1 +1,8 @@ -{} +{ + "semi": true, + "trailingComma": "all", + "singleQuote": true, + "printWidth": 80, + "tabWidth": 2, + "plugins": ["prettier-plugin-tailwindcss"] +} diff --git a/akamai-loader.js b/akamai-loader.js index 1116fcb..98f37a9 100644 --- a/akamai-loader.js +++ b/akamai-loader.js @@ -1,4 +1,4 @@ -const normalizeSrc = (src) => (src[0] === "/" ? src.slice(1) : src); +const normalizeSrc = (src) => (src[0] === '/' ? src.slice(1) : src); export default function akamaiLoader({ src, width, quality }) { - return "/" + normalizeSrc(src) + "?imwidth=" + width; + return '/' + normalizeSrc(src) + '?imwidth=' + width; } diff --git a/lighthouserc.yml b/lighthouserc.yml index 8abf823..ede270c 100644 --- a/lighthouserc.yml +++ b/lighthouserc.yml @@ -1,6 +1,6 @@ ci: collect: - staticDistDir: "./out" + staticDistDir: './out' assert: assertions: categories:accessibility: [error, { minScore: 1 }] diff --git a/next.config.js b/next.config.js index be66455..b53467a 100644 --- a/next.config.js +++ b/next.config.js @@ -1,20 +1,20 @@ -const path = require("path"); +const path = require('path'); /** * @type {import('next').NextConfig} */ const nextConfig = { - output: "export", + output: 'export', reactStrictMode: true, swcMinify: true, images: { - loader: "custom", - loaderFile: "./akamai-loader.js", + loader: 'custom', + loaderFile: './akamai-loader.js', }, - basePath: "/dibbs-site", - assetPrefix: "/dibbs-site", + basePath: '/dibbs-site', + assetPrefix: '/dibbs-site', sassOptions: { - includePaths: [path.join(__dirname, "styles")], + includePaths: [path.join(__dirname, 'styles')], }, }; diff --git a/package-lock.json b/package-lock.json index 0a01a70..cb690e6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@trussworks/react-uswds": "^9.1.0", "@uswds/uswds": "^3.9.0", + "classnames": "^2.5.1", "fs": "^0.0.1-security", "gray-matter": "^4.0.3", "next": "14.2.15", @@ -23,13 +24,17 @@ "@types/react": "^18", "@types/react-dom": "^18", "autoprefixer": "^10.4.20", - "eslint": "^8", + "eslint": "^8.57.1", "eslint-config-next": "14.2.15", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-prettier": "^5.2.1", + "eslint-plugin-react": "^7.37.2", "husky": "^9.1.6", "lint-staged": "^15.2.10", "postcss": "^8", "postcss-import": "^16.1.0", - "prettier": "3.3.3", + "prettier": "^3.3.3", + "prettier-plugin-tailwindcss": "^0.6.8", "sass": "^1.79.5", "tailwindcss": "^3.4.1", "typescript": "^5" @@ -706,6 +711,19 @@ "node": ">=14" } }, + "node_modules/@pkgr/core": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.1.1.tgz", + "integrity": "sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^12.20.0 || ^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/unts" + } + }, "node_modules/@rtsao/scc": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@rtsao/scc/-/scc-1.1.0.tgz", @@ -1642,6 +1660,12 @@ "node": ">= 6" } }, + "node_modules/classnames": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", + "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==", + "license": "MIT" + }, "node_modules/cli-cursor": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz", @@ -2276,6 +2300,7 @@ "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==", "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.", "dev": true, + "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", @@ -2353,6 +2378,19 @@ } } }, + "node_modules/eslint-config-prettier": { + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz", + "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==", + "dev": true, + "license": "MIT", + "bin": { + "eslint-config-prettier": "bin/cli.js" + }, + "peerDependencies": { + "eslint": ">=7.0.0" + } + }, "node_modules/eslint-import-resolver-node": { "version": "0.3.9", "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz", @@ -2527,18 +2565,50 @@ "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9" } }, + "node_modules/eslint-plugin-prettier": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.2.1.tgz", + "integrity": "sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==", + "dev": true, + "license": "MIT", + "dependencies": { + "prettier-linter-helpers": "^1.0.0", + "synckit": "^0.9.1" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint-plugin-prettier" + }, + "peerDependencies": { + "@types/eslint": ">=8.0.0", + "eslint": ">=8.0.0", + "eslint-config-prettier": "*", + "prettier": ">=3.0.0" + }, + "peerDependenciesMeta": { + "@types/eslint": { + "optional": true + }, + "eslint-config-prettier": { + "optional": true + } + } + }, "node_modules/eslint-plugin-react": { - "version": "7.37.1", - "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.1.tgz", - "integrity": "sha512-xwTnwDqzbDRA8uJ7BMxPs/EXRB3i8ZfnOIp8BsxEQkT0nHPp+WWceqGgo6rKb9ctNi8GJLDT4Go5HAWELa/WMg==", + "version": "7.37.2", + "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.2.tgz", + "integrity": "sha512-EsTAnj9fLVr/GZleBLFbj/sSuXeWmp1eXIN60ceYnZveqEaUCyW4X+Vh4WTdUhCkW4xutXYqTXCUSyqD4rB75w==", "dev": true, + "license": "MIT", "dependencies": { "array-includes": "^3.1.8", "array.prototype.findlast": "^1.2.5", "array.prototype.flatmap": "^1.3.2", "array.prototype.tosorted": "^1.1.4", "doctrine": "^2.1.0", - "es-iterator-helpers": "^1.0.19", + "es-iterator-helpers": "^1.1.0", "estraverse": "^5.3.0", "hasown": "^2.0.2", "jsx-ast-utils": "^2.4.1 || ^3.0.0", @@ -2756,6 +2826,13 @@ "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", "dev": true }, + "node_modules/fast-diff": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", + "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", + "dev": true, + "license": "Apache-2.0" + }, "node_modules/fast-glob": { "version": "3.3.2", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz", @@ -5778,6 +5855,7 @@ "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz", "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==", "dev": true, + "license": "MIT", "bin": { "prettier": "bin/prettier.cjs" }, @@ -5788,6 +5866,98 @@ "url": "https://github.com/prettier/prettier?sponsor=1" } }, + "node_modules/prettier-linter-helpers": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz", + "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-diff": "^1.1.2" + }, + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/prettier-plugin-tailwindcss": { + "version": "0.6.8", + "resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.6.8.tgz", + "integrity": "sha512-dGu3kdm7SXPkiW4nzeWKCl3uoImdd5CTZEJGxyypEPL37Wj0HT2pLqjrvSei1nTeuQfO4PUfjeW5cTUNRLZ4sA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14.21.3" + }, + "peerDependencies": { + "@ianvs/prettier-plugin-sort-imports": "*", + "@prettier/plugin-pug": "*", + "@shopify/prettier-plugin-liquid": "*", + "@trivago/prettier-plugin-sort-imports": "*", + "@zackad/prettier-plugin-twig-melody": "*", + "prettier": "^3.0", + "prettier-plugin-astro": "*", + "prettier-plugin-css-order": "*", + "prettier-plugin-import-sort": "*", + "prettier-plugin-jsdoc": "*", + "prettier-plugin-marko": "*", + "prettier-plugin-multiline-arrays": "*", + "prettier-plugin-organize-attributes": "*", + "prettier-plugin-organize-imports": "*", + "prettier-plugin-sort-imports": "*", + "prettier-plugin-style-order": "*", + "prettier-plugin-svelte": "*" + }, + "peerDependenciesMeta": { + "@ianvs/prettier-plugin-sort-imports": { + "optional": true + }, + "@prettier/plugin-pug": { + "optional": true + }, + "@shopify/prettier-plugin-liquid": { + "optional": true + }, + "@trivago/prettier-plugin-sort-imports": { + "optional": true + }, + "@zackad/prettier-plugin-twig-melody": { + "optional": true + }, + "prettier-plugin-astro": { + "optional": true + }, + "prettier-plugin-css-order": { + "optional": true + }, + "prettier-plugin-import-sort": { + "optional": true + }, + "prettier-plugin-jsdoc": { + "optional": true + }, + "prettier-plugin-marko": { + "optional": true + }, + "prettier-plugin-multiline-arrays": { + "optional": true + }, + "prettier-plugin-organize-attributes": { + "optional": true + }, + "prettier-plugin-organize-imports": { + "optional": true + }, + "prettier-plugin-sort-imports": { + "optional": true + }, + "prettier-plugin-style-order": { + "optional": true + }, + "prettier-plugin-svelte": { + "optional": true + } + } + }, "node_modules/process": { "version": "0.11.10", "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", @@ -6748,6 +6918,23 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/synckit": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.9.2.tgz", + "integrity": "sha512-vrozgXDQwYO72vHjUb/HnFbQx1exDjoKzqx23aXEg2a9VIg2TSFZ8FmeZpTjUCFMYw7mpX4BE2SFu8wI7asYsw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@pkgr/core": "^0.1.0", + "tslib": "^2.6.2" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/unts" + } + }, "node_modules/tabbable": { "version": "6.2.0", "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz", diff --git a/package.json b/package.json index 74d541c..3555b2e 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "start": "next start", "lint": "next lint", "prepare": "husky", - "prettier": "prettier --write ." + "fmt": "prettier --write ." }, "lint-staged": { "**/*": "prettier --write --ignore-unknown" @@ -16,6 +16,7 @@ "dependencies": { "@trussworks/react-uswds": "^9.1.0", "@uswds/uswds": "^3.9.0", + "classnames": "^2.5.1", "fs": "^0.0.1-security", "gray-matter": "^4.0.3", "next": "14.2.15", @@ -29,13 +30,17 @@ "@types/react": "^18", "@types/react-dom": "^18", "autoprefixer": "^10.4.20", - "eslint": "^8", + "eslint": "^8.57.1", "eslint-config-next": "14.2.15", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-prettier": "^5.2.1", + "eslint-plugin-react": "^7.37.2", "husky": "^9.1.6", "lint-staged": "^15.2.10", "postcss": "^8", "postcss-import": "^16.1.0", - "prettier": "3.3.3", + "prettier": "^3.3.3", + "prettier-plugin-tailwindcss": "^0.6.8", "sass": "^1.79.5", "tailwindcss": "^3.4.1", "typescript": "^5" diff --git a/src/app/components/Footer.tsx b/src/app/components/Footer.tsx index 76437a9..2c22c29 100644 --- a/src/app/components/Footer.tsx +++ b/src/app/components/Footer.tsx @@ -1,14 +1,14 @@ -"use client"; -import { Header, PrimaryNav } from "@trussworks/react-uswds"; -import Link from "next/link"; -import Image from "next/image"; -import React from "react"; -import styles from "../styles/Home.module.scss"; -import { NavigationLink } from "./Header"; +'use client'; +import { PrimaryNav } from '@trussworks/react-uswds'; +import Link from 'next/link'; +import Image from 'next/image'; +import React from 'react'; +import styles from '../styles/Home.module.scss'; +import { NavigationLink } from './NavigationLink'; +import classNames from 'classnames'; +import { basePath } from '../utils/constants'; export default function Footer() { - const basePath = "/dibbs-site"; - const [expanded, setExpanded] = React.useState(false); const onClick = () => { if (window.innerWidth < 1024) setExpanded((prvExpanded) => !prvExpanded); @@ -16,43 +16,45 @@ export default function Footer() { const testItemsMenu = [ Home , - + Home , - + Our products , - + Case studies , - + Engage with us , ]; return ( <> -
+
+ ); } diff --git a/src/app/components/Header.tsx b/src/app/components/Header.tsx index b9015bb..0f09875 100644 --- a/src/app/components/Header.tsx +++ b/src/app/components/Header.tsx @@ -1,26 +1,20 @@ -"use client"; -import { Header, PrimaryNav } from "@trussworks/react-uswds"; -import Link from "next/link"; -import Image from "next/image"; -import { usePathname } from "next/navigation"; -import React from "react"; -import styles from "../styles/Home.module.scss"; -import { LinkProps } from "next/link"; - -interface NavigationLinkProps extends Pick { - children: React.ReactNode; -} - -export default function Navbar() { - const basePath = "/dibbs-site"; +'use client'; +import { Header as USWDSHeader, PrimaryNav } from '@trussworks/react-uswds'; +import Image from 'next/image'; +import React from 'react'; +import styles from '../styles/Home.module.scss'; +import classNames from 'classnames'; +import { basePath } from '../utils/constants'; +import { NavigationLink } from './NavigationLink'; +export default function Header() { const [expanded, setExpanded] = React.useState(false); const onClick = () => { if (window.innerWidth < 1024) setExpanded((prvExpanded) => !prvExpanded); }; const testItemsMenu = [ - + Our products , @@ -36,21 +30,23 @@ export default function Navbar() { Skip to main content -
-
+ +
- + Data Integration Building Blocks @@ -66,27 +62,7 @@ export default function Navbar() { onToggleMobileNav={onClick} />
-
+ ); } - -export function NavigationLink({ - href, - children, - onClick, -}: NavigationLinkProps) { - const pathname = usePathname(); // Use usePathname hook to get the current path - const isActive = pathname === href; - return ( - - - {children} - - - ); -} diff --git a/src/app/components/MarkdownComponent.tsx b/src/app/components/MarkdownComponent.tsx index 36fbddc..2e3df72 100644 --- a/src/app/components/MarkdownComponent.tsx +++ b/src/app/components/MarkdownComponent.tsx @@ -1,6 +1,6 @@ -import React from "react"; -import ReactMarkdown from "react-markdown"; -import { getMarkdownContent } from "../utils/markdown"; +import React from 'react'; +import ReactMarkdown from 'react-markdown'; +import { getMarkdownContent } from '../utils/markdown'; export default async function MarkdownContent(fileName: string) { const markdownContent = await getMarkdownContent(fileName); diff --git a/src/app/components/NavigationLink.tsx b/src/app/components/NavigationLink.tsx new file mode 100644 index 0000000..baf5df1 --- /dev/null +++ b/src/app/components/NavigationLink.tsx @@ -0,0 +1,28 @@ +import classNames from 'classnames'; +import Link, { LinkProps } from 'next/link'; +import { usePathname } from 'next/navigation'; +import styles from '../styles/Home.module.scss'; + +interface NavigationLinkProps extends Pick { + children: React.ReactNode; +} + +export function NavigationLink({ + href, + children, + onClick, +}: NavigationLinkProps) { + const pathname = usePathname(); // Use usePathname hook to get the current path + const isActive = pathname === href; + return ( + + + {children} + + + ); +} diff --git a/src/app/components/UsaBanner.tsx b/src/app/components/UsaBanner.tsx index 8daa40a..edeeb4c 100644 --- a/src/app/components/UsaBanner.tsx +++ b/src/app/components/UsaBanner.tsx @@ -1,5 +1,5 @@ -"use client"; -import React, { useState } from "react"; +'use client'; +import React, { useState } from 'react'; import { Banner, BannerHeader, @@ -10,14 +10,16 @@ import { BannerFlag, MediaBlockBody, Icon, -} from "@trussworks/react-uswds"; +} from '@trussworks/react-uswds'; +import { basePath } from '../utils/constants'; export default function USABanner() { - const basePath: string = "/dibbs-site"; const [isOpen, setIsOpen] = useState(false); - const flagImg: string = `${basePath}/images/us-flag.png`; - const dotGovIcon: string = `${basePath}/images/us-gov-icon.svg`; - const httpsIcon: string = `${basePath}/images/https-icon.svg`; + + const flagImg = `${basePath}/images/us-flag.png`; + const dotGovIcon = `${basePath}/images/us-gov-icon.svg`; + const httpsIcon = `${basePath}/images/https-icon.svg`; + return (

Secure .gov websites use HTTPS -
A{" "} +
A{' '} lock () - {" "} + {' '} or https:// means you've safely connected to the .gov website. Share sensitive information only on official, secure websites. diff --git a/src/app/globals.css b/src/app/globals.css index 6409f77..c5f16b8 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -1,8 +1,8 @@ @tailwind base; @tailwind components; @tailwind utilities; -@import "@trussworks/react-uswds/lib/uswds.css"; -@import "@trussworks/react-uswds/lib/index.css"; +@import '@trussworks/react-uswds/lib/uswds.css'; +@import '@trussworks/react-uswds/lib/index.css'; :root { --background: #ffffff; @@ -69,7 +69,7 @@ h1 { } h1 { - font-family: "Source Sans Pro", sans-serif; + font-family: 'Source Sans Pro', sans-serif; font-size: 40px; font-weight: 700; line-height: 50.28px; @@ -78,7 +78,7 @@ h1 { h2 { color: #224a58; - font-family: "Source Sans Pro", sans-serif; + font-family: 'Source Sans Pro', sans-serif; font-size: 2rem; font-style: normal; font-weight: 700; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 66181e2..6f50d2b 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,12 +1,16 @@ -import type { Metadata } from "next"; -import "./globals.css"; -import Script from "next/script"; -import Navbar from "./components/Header"; -import Footer from "./components/Footer"; -import USABanner from "./components/UsaBanner"; +import type { Metadata } from 'next'; +import './globals.css'; +import Script from 'next/script'; +import Header from './components/Header'; +import Footer from './components/Footer'; +import USABanner from './components/UsaBanner'; +import { basePath } from './utils/constants'; export const metadata: Metadata = { - title: "DIBBS Site", + title: 'DIBBS Site', + icons: { + icon: `${basePath}/app/favicon.ico`, + }, }; export default function RootLayout({ @@ -16,11 +20,10 @@ export default function RootLayout({ }>) { return ( -

- +
{children}
diff --git a/src/app/our-products/page.tsx b/src/app/our-products/page.tsx index 684eb9f..0ac25cb 100644 --- a/src/app/our-products/page.tsx +++ b/src/app/our-products/page.tsx @@ -1,4 +1,4 @@ -import Link from "next/link"; +import Link from 'next/link'; export default function ProductDetail() { return ( @@ -6,16 +6,16 @@ export default function ProductDetail() {

Our Products

  • - Home + Home
  • - Our products + Our products
  • - Product detail + Product detail
  • - Resources + Resources
diff --git a/src/app/page.tsx b/src/app/page.tsx index 4121084..6667fc4 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,15 +1,14 @@ -import MarkdownContent from "./components/MarkdownComponent"; -import { Grid } from "@trussworks/react-uswds"; -import Image from "next/image"; +import MarkdownContent from './components/MarkdownComponent'; +import { Grid } from '@trussworks/react-uswds'; +import Image from 'next/image'; +import { basePath } from './utils/constants'; export default async function Home() { - const basePath = "/dibbs-site"; - return ( <>
- {MarkdownContent("homepage/section_1.md")} + {MarkdownContent('homepage/section_1.md')}
@@ -23,14 +22,14 @@ export default async function Home() { alt="Placeholder" /> - {MarkdownContent("homepage/section_2.md")} + {MarkdownContent('homepage/section_2.md')}
- {MarkdownContent("homepage/section_3.md")} + {MarkdownContent('homepage/section_3.md')} - {MarkdownContent("homepage/section_4.md")} + {MarkdownContent('homepage/section_4.md')}
diff --git a/src/app/product-detail/page.tsx b/src/app/product-detail/page.tsx index 705dd72..a03c743 100644 --- a/src/app/product-detail/page.tsx +++ b/src/app/product-detail/page.tsx @@ -1,4 +1,4 @@ -import Link from "next/link"; +import Link from 'next/link'; export default function ProductDetail() { return ( @@ -6,16 +6,16 @@ export default function ProductDetail() {

Product Detail

  • - Home + Home
  • - Our products + Our products
  • - Product detail + Product detail
  • - Resources + Resources
diff --git a/src/app/resources/page.tsx b/src/app/resources/page.tsx index ee62d19..cca3a5a 100644 --- a/src/app/resources/page.tsx +++ b/src/app/resources/page.tsx @@ -1,4 +1,4 @@ -import Link from "next/link"; +import Link from 'next/link'; export default function ProductDetail() { return ( @@ -6,16 +6,16 @@ export default function ProductDetail() {

Resources

  • - Home + Home
  • - Our products + Our products
  • - Product detail + Product detail
  • - Resources + Resources
diff --git a/src/app/styles/Home.module.scss b/src/app/styles/Home.module.scss index bd31517..b1c5946 100644 --- a/src/app/styles/Home.module.scss +++ b/src/app/styles/Home.module.scss @@ -70,7 +70,7 @@ } .partnerItemHeaders { - font-family: "Public Sans", sans-serif; + font-family: 'Public Sans', sans-serif; font-weight: 700; font-size: 32px; line-height: 38px; @@ -121,7 +121,7 @@ } .partnerItemHeaders { - font-family: "Public Sans", sans-serif; + font-family: 'Public Sans', sans-serif; font-weight: 400; font-size: 22px; line-height: 26px; diff --git a/src/app/utils/constants.ts b/src/app/utils/constants.ts new file mode 100644 index 0000000..57f628d --- /dev/null +++ b/src/app/utils/constants.ts @@ -0,0 +1,3 @@ +const basePath = '/dibbs-site'; + +export { basePath }; diff --git a/src/app/utils/markdown.ts b/src/app/utils/markdown.ts index 6f30e6a..5a776d6 100644 --- a/src/app/utils/markdown.ts +++ b/src/app/utils/markdown.ts @@ -1,11 +1,11 @@ -import * as fs from "fs"; -import * as path from "path"; -import matter from "gray-matter"; +import * as fs from 'fs'; +import * as path from 'path'; +import matter from 'gray-matter'; export async function getMarkdownContent(fileName: string) { - const markdownFilePath = path.join(process.cwd(), "src/content", fileName); - const fileContents = fs.readFileSync(markdownFilePath, "utf8"); - const { content } = matter(fileContents, undefined); + const markdownFilePath = path.join(process.cwd(), 'src/content', fileName); + const fileContents = fs.readFileSync(markdownFilePath, 'utf8'); + const { content } = matter(fileContents); return content; } diff --git a/tailwind.config.ts b/tailwind.config.ts index 021c393..4dcc94f 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -1,16 +1,16 @@ -import type { Config } from "tailwindcss"; +import type { Config } from 'tailwindcss'; const config: Config = { content: [ - "./src/pages/**/*.{js,ts,jsx,tsx,mdx}", - "./src/components/**/*.{js,ts,jsx,tsx,mdx}", - "./src/app/**/*.{js,ts,jsx,tsx,mdx}", + './src/pages/**/*.{js,ts,jsx,tsx,mdx}', + './src/components/**/*.{js,ts,jsx,tsx,mdx}', + './src/app/**/*.{js,ts,jsx,tsx,mdx}', ], theme: { extend: { colors: { - background: "var(--background)", - foreground: "var(--foreground)", + background: 'var(--background)', + foreground: 'var(--foreground)', }, }, },