diff --git a/next.config.js b/next.config.js
index b53467a..8ee7474 100644
--- a/next.config.js
+++ b/next.config.js
@@ -14,7 +14,9 @@ const nextConfig = {
basePath: '/dibbs-site',
assetPrefix: '/dibbs-site',
sassOptions: {
- includePaths: [path.join(__dirname, 'styles')],
+ includePaths: [
+ path.join(__dirname, './', 'node_modules', '@uswds', 'uswds', 'packages'),
+ ],
},
};
diff --git a/src/app/globals.css b/src/app/globals.scss
similarity index 94%
rename from src/app/globals.css
rename to src/app/globals.scss
index c5f16b8..a3ac581 100644
--- a/src/app/globals.css
+++ b/src/app/globals.scss
@@ -1,8 +1,10 @@
+@forward "uswds-settings";
+@forward "uswds";
+
+
@tailwind base;
@tailwind components;
@tailwind utilities;
-@import '@trussworks/react-uswds/lib/uswds.css';
-@import '@trussworks/react-uswds/lib/index.css';
:root {
--background: #ffffff;
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 6f50d2b..cd45059 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,10 +1,9 @@
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';
+import './globals.scss';
export const metadata: Metadata = {
title: 'DIBBS Site',
@@ -27,7 +26,6 @@ export default function RootLayout({
{children}
-