Merge pull request #3 from mitchell131/scss-test

Scss test
2025-06-29 22:23:45 +02:00 · 2025-06-29 22:23:45 +02:00 · b768099c35
commit b768099c35
parent 1f810a273e 6a879a747c
12 changed files with 248 additions and 98 deletions
--- a/payment-iq/app/components/PageLinks/PageLinks.scss
+++ b/payment-iq/app/components/PageLinks/PageLinks.scss
@ -0,0 +1,23 @@
+/* PageLinks.scss */
+
+.link-container {
+  display: flex;
+  align-items: center;
+  padding: 12px 1px;
+  border-radius: 4px;
+  color: var(--text-tertiary);
+  text-decoration: none;
+  transition: background 0.2s ease-in-out;
+
+  &:hover {
+    color: #fff;
+    background-color: var(--hover-color);
+    cursor: pointer;
+  }
+}
+
+.link-text {
+  color: var(--text-tertiary);
+  margin-left: 12px;
+  font-weight: 500;
+}
--- a/payment-iq/app/components/PageLinks/PageLinks.tsx
+++ b/payment-iq/app/components/PageLinks/PageLinks.tsx
@ -1,40 +1,16 @@
 "use client";

 import Link from "next/link";
-import { styled } from "@mui/system";
 import { ISidebarLink } from "@/app/features/dashboard/sidebar/SidebarLink.interfaces";
-
-const LinkContainer = styled("div")(({ theme }) => ({
-  display: "flex",
-  alignItems: "center",
-  padding: "12px 1px",
-  borderRadius: "4px",
-  color: theme.palette.text.tertiary,
-  textDecoration: "none",
-  transition: "background 0.2s ease-in-out",
-
-  "&:hover": {
-    color: "rgb(255, 255, 255)",
-    background: "rgba(255, 255, 255, 0.08)",
-    backgroundColor: theme.palette.action.hover,
-    cursor: "pointer",
-  },
-}));
-
-const LinkText = styled("span")(({ theme }) => ({
-  color: theme.palette.text.tertiary,
-  marginLeft: "12px",
-  fontWeight: 500,
-}));
+import clsx from "clsx"; // Utility to merge class names
+import "./PageLinks.scss";

 export default function PageLinks({ title, path, icon: Icon }: ISidebarLink) {
  return (
    <Link href={path} passHref legacyBehavior>
-      <a style={{ textDecoration: "none" }}>
-        <LinkContainer>
-          {Icon && <Icon />}
-          <LinkText>{title}</LinkText>
-        </LinkContainer>
+      <a className={clsx("link-container")}>
+        {Icon && <Icon />}
+        <span className="link-text">{title}</span>
      </a>
    </Link>
  );
--- a/payment-iq/app/features/dashboard/header/dropDown/DropDown.scss
+++ b/payment-iq/app/features/dashboard/header/dropDown/DropDown.scss
@ -0,0 +1,9 @@
+/* DropDown.scss */
+.dropdown-container {
+  .link-container {
+    color: var(--text-secondary);
+    .link-text {
+      color: var(--text-primary);
+    }
+  }
+}
--- a/payment-iq/app/features/dashboard/header/dropDown/DropDown.styled.ts
+++ b/payment-iq/app/features/dashboard/header/dropDown/DropDown.styled.ts
@ -1,9 +0,0 @@
-import { styled } from "@mui/system";
-
-export const Em = styled("em")(() => ({
-  display: "flex",
-  alignItems: "center",
-  opacity: 0.7,
-  fontStyle: "normal",
-  color: "white",
-}));
--- a/payment-iq/app/features/dashboard/header/dropDown/DropDown.tsx
+++ b/payment-iq/app/features/dashboard/header/dropDown/DropDown.tsx
@ -9,8 +9,9 @@ import {
 import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 import { SIDEBAR_LINKS } from "@/app/features/dashboard/sidebar/SidebarLink.constants";
 import { ISidebarLink } from "@/app/features/dashboard/sidebar/SidebarLink.interfaces";
-import { Em } from "./DropDown.styled";
+import { Em } from "./Em"; // If you still want to create a component for the <em> tag
 import PageLinks from "../../../../components/PageLinks/PageLinks";
+import "./DropDown.scss"; // Import the SCSS file

 interface Props {
  onChange?: (event: SelectChangeEvent<string>) => void;
@ -35,26 +36,22 @@ export default function SidebarDropdown({ onChange }: Props) {
        MenuProps={{
          PaperProps: {
            style: {
-              backgroundColor: "rgba(30, 30, 30, 0.7)", // 0.9 opacity
              maxHeight: 200,
            },
          },
        }}
      >
-        <MenuItem value="" disabled>
-          <Em>
-            Select a page
-            <ChevronRightIcon fontSize="small" sx={{ ml: 1 }} />
-          </Em>
-        </MenuItem>
-        {SIDEBAR_LINKS.map((link: ISidebarLink) => (
-          <PageLinks
-            key={link.path}
-            title={link.title}
-            path={link.path}
-            icon={link.icon}
-          />
-        ))}
+        <MenuItem value="" disabled></MenuItem>
+        <div className="dropdown-container">
+          {SIDEBAR_LINKS.map((link: ISidebarLink) => (
+            <PageLinks
+              key={link.path}
+              title={link.title}
+              path={link.path}
+              icon={link.icon}
+            />
+          ))}
+        </div>
      </Select>
    </FormControl>
  );
--- a/payment-iq/app/features/dashboard/sidebar/Sidebar.tsx
+++ b/payment-iq/app/features/dashboard/sidebar/Sidebar.tsx
@ -2,46 +2,19 @@

 import React from "react";
 import DashboardIcon from "@mui/icons-material/Dashboard";
-import { styled } from "@mui/system";
 import { SIDEBAR_LINKS } from "@/app/features/dashboard/sidebar/SidebarLink.constants";
 import PageLinks from "../../../components/PageLinks/PageLinks";
-
-const SideBarContainer = styled("aside")(({ theme }) => ({
-  position: "fixed",
-  top: 0,
-  left: 0,
-  width: 240,
-  height: "100vh",
-  backgroundColor: theme.palette.background.primary,
-  color: theme.palette.text.primary,
-  display: "flex",
-  flexDirection: "column",
-  padding: theme.spacing(2),
-  zIndex: 1100,
-  borderRight: `1px solid ${theme.palette.divider}`,
-}));
-
-const SidebarHeader = styled("div")(({ theme }) => ({
-  fontSize: "20px",
-  fontWeight: 600,
-  marginBottom: theme.spacing(3),
-  display: "flex",
-  alignItems: "center",
-  color: theme.palette.text.primary,
-}));
-
-const IconSpacing = styled(DashboardIcon)(({ theme }) => ({
-  marginLeft: theme.spacing(1),
-}));
+import "./sideBar.scss";

 const SideBar = () => {
  return (
-    <SideBarContainer>
-      <SidebarHeader>
-        <span style={{ color: "#fff" }}>
-          Betrise cashir <IconSpacing fontSize="small" />
+    <aside className="sidebar-container">
+      <div className="sidebar-header">
+        <span>
+          Betrise cashir{" "}
+          <DashboardIcon fontSize="small" className="sidebar-icon-spacing" />
        </span>
-      </SidebarHeader>
+      </div>
      {SIDEBAR_LINKS.map((link) => (
        <PageLinks
          key={link.path}
@ -50,7 +23,7 @@ const SideBar = () => {
          icon={link.icon}
        />
      ))}
-    </SideBarContainer>
+    </aside>
  );
 };

--- a/payment-iq/app/features/dashboard/sidebar/sideBar.scss
+++ b/payment-iq/app/features/dashboard/sidebar/sideBar.scss
@ -0,0 +1,27 @@
+.sidebar-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 240px;
+  height: 100vh;
+  background-color: var(--background-primary);
+  color: white;
+  display: flex;
+  flex-direction: column;
+  padding: 16px;
+  z-index: 1100;
+  border-right: 1px solid #333;
+}
+
+.sidebar-header {
+  font-size: 20px;
+  font-weight: 600;
+  margin-bottom: 24px;
+  display: flex;
+  align-items: center;
+  color: white;
+}
+
+.sidebar-icon-spacing {
+  margin-left: 8px;
+}
--- a/payment-iq/app/layout.tsx
+++ b/payment-iq/app/layout.tsx
@ -1,12 +1,17 @@
-import ThemeRegistry from '@/config/ThemeRegistry';
-import type { Metadata } from 'next';
+import ThemeRegistry from "@/config/ThemeRegistry";
+import type { Metadata } from "next";
+import "../styles/globals.scss";

 export const metadata: Metadata = {
-  title: 'Your App',
-  description: 'Generated by Next.js',
+  title: "Your App",
+  description: "Generated by Next.js",
 };

-export default function RootLayout({ children }: { children: React.ReactNode }) {
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
  return (
    <html lang="en">
      <body>
--- a/payment-iq/package.json
+++ b/payment-iq/package.json
@ -15,6 +15,7 @@
    "@mui/material": "^7.1.2",
    "@mui/x-data-grid": "^8.5.2",
    "@mui/x-date-pickers": "^8.5.3",
+    "clsx": "^2.1.1",
    "date-fns": "^4.1.0",
    "dayjs": "^1.11.13",
    "file-saver": "^2.0.5",
@ -23,6 +24,7 @@
    "react-date-range": "^2.0.1",
    "react-dom": "^19.0.0",
    "recharts": "^2.15.3",
+    "sass": "^1.89.2",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
--- a/payment-iq/styles/globals.scss
+++ b/payment-iq/styles/globals.scss
@ -1,6 +1,16 @@
+@import "./variables";
+
 :root {
-  --background: #ffffff;
-  --foreground: #171717;
+  --background: #0a0a0a;
+  --foreground: #ededed;
+  --primary-color: #{$primary-color};
+  --secondary-color: #{$secondary-color};
+  --background-primary: #{$background-primary};
+  --text-primary: #{$text-primary};
+  --text-secondary: #{$text-secondary};
+  --text-tertiary: #{$text-tertiary};
+  --hover-color: #{$hover-color};
+  --font-family-base: #{$font-family-base};
 }

@media (prefers-color-scheme: dark) {
--- a/payment-iq/styles/variables.scss
+++ b/payment-iq/styles/variables.scss
@ -0,0 +1,10 @@
+// Declare SCSS variables
+$primary-color: #1976d2;
+$secondary-color: #d32f2f;
+$background-primary: rgb(69, 190, 171);
+$text-primary: #000000;
+$text-secondary: #555555;
+$text-tertiary: #ffffff;
+$hover-color: rgba(0, 0, 0, 0.08);
+
+$font-family-base: "Roboto", "Helvetica", "Arial", sans-serif;
--- a/payment-iq/yarn.lock
+++ b/payment-iq/yarn.lock
@ -672,6 +672,95 @@
  resolved "https://registry.npmjs.org/@nolyfill/is-core-module/-/is-core-module-1.0.39.tgz"
  integrity sha512-nn5ozdjYQpUCZlWGuxcJY/KpxkWQs4DcbMCmKojjyrYDEAGy4Ce19NN4v5MduafTwJlbKc99UA8YhSVqq9yPZA==

+"@parcel/watcher-android-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.1.tgz#507f836d7e2042f798c7d07ad19c3546f9848ac1"
+  integrity sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==
+
+"@parcel/watcher-darwin-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz#3d26dce38de6590ef79c47ec2c55793c06ad4f67"
+  integrity sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==
+
+"@parcel/watcher-darwin-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.1.tgz#99f3af3869069ccf774e4ddfccf7e64fd2311ef8"
+  integrity sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==
+
+"@parcel/watcher-freebsd-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.1.tgz#14d6857741a9f51dfe51d5b08b7c8afdbc73ad9b"
+  integrity sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==
+
+"@parcel/watcher-linux-arm-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.1.tgz#43c3246d6892381db473bb4f663229ad20b609a1"
+  integrity sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==
+
+"@parcel/watcher-linux-arm-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.1.tgz#663750f7090bb6278d2210de643eb8a3f780d08e"
+  integrity sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==
+
+"@parcel/watcher-linux-arm64-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.1.tgz#ba60e1f56977f7e47cd7e31ad65d15fdcbd07e30"
+  integrity sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==
+
+"@parcel/watcher-linux-arm64-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.1.tgz#f7fbcdff2f04c526f96eac01f97419a6a99855d2"
+  integrity sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==
+
+"@parcel/watcher-linux-x64-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.1.tgz#4d2ea0f633eb1917d83d483392ce6181b6a92e4e"
+  integrity sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==
+
+"@parcel/watcher-linux-x64-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.1.tgz#277b346b05db54f55657301dd77bdf99d63606ee"
+  integrity sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==
+
+"@parcel/watcher-win32-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.1.tgz#7e9e02a26784d47503de1d10e8eab6cceb524243"
+  integrity sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==
+
+"@parcel/watcher-win32-ia32@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.1.tgz#2d0f94fa59a873cdc584bf7f6b1dc628ddf976e6"
+  integrity sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==
+
+"@parcel/watcher-win32-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.1.tgz#ae52693259664ba6f2228fa61d7ee44b64ea0947"
+  integrity sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==
+
+"@parcel/watcher@^2.4.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher/-/watcher-2.5.1.tgz#342507a9cfaaf172479a882309def1e991fb1200"
+  integrity sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==
+  dependencies:
+    detect-libc "^1.0.3"
+    is-glob "^4.0.3"
+    micromatch "^4.0.5"
+    node-addon-api "^7.0.0"
+  optionalDependencies:
+    "@parcel/watcher-android-arm64" "2.5.1"
+    "@parcel/watcher-darwin-arm64" "2.5.1"
+    "@parcel/watcher-darwin-x64" "2.5.1"
+    "@parcel/watcher-freebsd-x64" "2.5.1"
+    "@parcel/watcher-linux-arm-glibc" "2.5.1"
+    "@parcel/watcher-linux-arm-musl" "2.5.1"
+    "@parcel/watcher-linux-arm64-glibc" "2.5.1"
+    "@parcel/watcher-linux-arm64-musl" "2.5.1"
+    "@parcel/watcher-linux-x64-glibc" "2.5.1"
+    "@parcel/watcher-linux-x64-musl" "2.5.1"
+    "@parcel/watcher-win32-arm64" "2.5.1"
+    "@parcel/watcher-win32-ia32" "2.5.1"
+    "@parcel/watcher-win32-x64" "2.5.1"
+
 "@popperjs/core@^2.11.8":
  version "2.11.8"
  resolved "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz"
@ -1268,6 +1357,13 @@ chalk@^4.0.0:
    ansi-styles "^4.1.0"
    supports-color "^7.1.0"

+chokidar@^4.0.0:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-4.0.3.tgz#7be37a4c03c9aee1ecfe862a4a23b2c70c205d30"
+  integrity sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==
+  dependencies:
+    readdirp "^4.0.1"
+
 classnames@^2.2.6:
  version "2.5.1"
  resolved "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz"
@ -1518,6 +1614,11 @@ define-properties@^1.1.3, define-properties@^1.2.1:
    has-property-descriptors "^1.0.0"
    object-keys "^1.1.1"

+detect-libc@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
+  integrity sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==
+
 detect-libc@^2.0.4:
  version "2.0.4"
  resolved "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz"
@ -2181,6 +2282,11 @@ ignore@^7.0.0:
  resolved "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz"
  integrity sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==

+immutable@^5.0.2:
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/immutable/-/immutable-5.1.3.tgz#e6486694c8b76c37c063cca92399fa64098634d4"
+  integrity sha512-+chQdDfvscSF1SJqv2gn4SRO2ZyS3xL3r7IW/wWEEzrzLisnOlKiQu5ytC/BVNcS15C39WT2Hg/bjKjDMcu+zg==
+
 import-fresh@^3.2.1:
  version "3.3.1"
  resolved "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz"
@ -2549,7 +2655,7 @@ merge2@^1.3.0:
  resolved "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz"
  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==

-micromatch@^4.0.4, micromatch@^4.0.8:
+micromatch@^4.0.4, micromatch@^4.0.5, micromatch@^4.0.8:
  version "4.0.8"
  resolved "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz"
  integrity sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==
@ -2619,6 +2725,11 @@ next@15.3.3:
    "@next/swc-win32-x64-msvc" "15.3.3"
    sharp "^0.34.1"

+node-addon-api@^7.0.0:
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-7.1.1.tgz#1aba6693b0f255258a049d621329329322aad558"
+  integrity sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==
+
 object-assign@^4.1.1:
  version "4.1.1"
  resolved "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
@ -2871,6 +2982,11 @@ react@^19.0.0:
  resolved "https://registry.npmjs.org/react/-/react-19.1.0.tgz"
  integrity sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==

+readdirp@^4.0.1:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-4.1.2.tgz#eb85801435fbf2a7ee58f19e0921b068fc69948d"
+  integrity sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==
+
 recharts-scale@^0.4.4:
  version "0.4.5"
  resolved "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz"
@ -2991,6 +3107,17 @@ safe-regex-test@^1.0.3, safe-regex-test@^1.1.0:
    es-errors "^1.3.0"
    is-regex "^1.2.1"

+sass@^1.89.2:
+  version "1.89.2"
+  resolved "https://registry.yarnpkg.com/sass/-/sass-1.89.2.tgz#a771716aeae774e2b529f72c0ff2dfd46c9de10e"
+  integrity sha512-xCmtksBKd/jdJ9Bt9p7nPKiuqrlBMBuuGkQlkhZjjQk3Ty48lv93k5Dq6OPkKt4XwxDJ7tvlfrTa1MPA9bf+QA==
+  dependencies:
+    chokidar "^4.0.0"
+    immutable "^5.0.2"
+    source-map-js ">=0.6.2 <2.0.0"
+  optionalDependencies:
+    "@parcel/watcher" "^2.4.1"
+
 scheduler@^0.26.0:
  version "0.26.0"
  resolved "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz"
@ -3132,7 +3259,7 @@ simple-swizzle@^0.2.2:
  dependencies:
    is-arrayish "^0.3.1"

-source-map-js@^1.0.2:
+"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2:
  version "1.2.1"
  resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz"
  integrity sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==