last review changes

TritonSE · Mar 4, 2024 · 3d89231 · 3d89231
1 parent 44c11d7
commit 3d89231
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 17 deletions.
diff --git a/frontend/src/components/Accordion.module.css b/frontend/src/components/Accordion.module.css
@@ -15,6 +15,6 @@
 }
 
 .lineShadow {
-  border: 1px solid #d8d8d8;
+  border: 1px solid var(--color-shadow);
   box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.15);
 }
diff --git a/frontend/src/components/Accordion.tsx b/frontend/src/components/Accordion.tsx
@@ -1,4 +1,4 @@
-import { FC, ReactNode, useEffect, useRef, useState } from "react";
+import { FC, ReactNode, useEffect, useState } from "react";
 
 import selectFAQ from "../assets/selectFAQ.svg";
 import unselectFAQ from "../assets/unselectFAQ.svg";
@@ -13,7 +13,6 @@ export type AccordionProps = {
 
 export const Accordion: FC<AccordionProps> = ({ question, children, toggleAll }) => {
   const [toggle, setIsOpen] = useState(toggleAll);
-  const contentRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
     setIsOpen(toggleAll);
@@ -31,7 +30,7 @@ export const Accordion: FC<AccordionProps> = ({ question, children, toggleAll })
           <img alt={toggle ? "-" : "+"} src={toggle ? unselectFAQ : selectFAQ} />
         </button>
       </div>
-      <div ref={contentRef}>{toggle && children}</div>
+      <div>{toggle && children}</div>
       <hr className={styles.lineShadow}></hr>
     </>
   );

diff --git a/frontend/src/components/Button.module.css b/frontend/src/components/Button.module.css
@@ -2,7 +2,7 @@
   padding: 0.5rem 1rem;
   margin: 0;
   background: var(--color-ccidc-red);
-  color: #ffffff;
+  color: var(--color-text-secondary);
   border: none;
   border-radius: 0.25rem;
   cursor: pointer;

diff --git a/frontend/src/components/FAQ.module.css b/frontend/src/components/FAQ.module.css
@@ -31,14 +31,14 @@ button {
 .textDivider2::before {
   content: "";
   height: 1px;
-  background-color: #d8d8d8;
+  background-color: var(--color-shadow);
   flex-grow: 1;
   margin-right: var(--text-divider-gap);
 }
 .textDivider2::after {
   content: "";
   height: 1px;
-  background-color: #d8d8d8;
+  background-color: var(--color-shadow);
   flex-grow: 1;
   margin-left: var(--text-divider-gap);
 }
@@ -48,7 +48,7 @@ button {
 }
 
 .lineShadow {
-  border: 1px solid #d8d8d8;
+  border: 1px solid var(--color-shadow);
   box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.15);
 }
 

diff --git a/frontend/src/components/FAQs.tsx b/frontend/src/components/FAQs.tsx
@@ -1,9 +1,8 @@
 import { useState } from "react";
 
-import { Accordion } from "../components/index.ts";
-
 import minusIcon from "../assets/minusIcon.svg";
 import plusIcon from "../assets/plusIcon.svg";
+import { Accordion } from "../components/index.ts";
 
 import styles from "./FAQ.module.css";
 
@@ -33,7 +32,7 @@ export function FAQs() {
             </span>
             <img
               src={expandAllCertificationInfo ? minusIcon : plusIcon}
-              alt={expandAllCertificationInfo ? "1" : "+"}
+              alt={expandAllCertificationInfo ? "-" : "+"}
             ></img>
           </button>
         </div>

diff --git a/frontend/src/globals.css b/frontend/src/globals.css
@@ -5,8 +5,7 @@
   --color-text-primary: #000000;
   --color-text-secondary: #ffffff;
   --color-accent: #b4b4b4;
-  --color-error: #fc3030;
-  --color-red-secondary: #ce2e21;
+  --color-shadow: #d8d8d8;
   --font-title: normal bold 2rem "Rubik", sans-serif;
   --font-heading: normal bold 1.5rem "Rubik", sans-serif;
   --font-label: normal bold 1rem "Rubik", sans-serif;

diff --git a/frontend/src/stylesheets/Candidates.module.css b/frontend/src/stylesheets/Candidates.module.css
@@ -42,7 +42,7 @@ img {
 .textDivider::after {
   content: "";
   height: 1px;
-  background-color: #d8d8d8;
+  background-color: var(--color-shadow);
   flex-grow: 1;
   margin-top: 3em;
   margin-left: var(--text-divider-gap);
@@ -63,14 +63,14 @@ img {
 .textDivider2::before {
   content: "";
   height: 1px;
-  background-color: #d8d8d8;
+  background-color: var(--color-shadow);
   flex-grow: 1;
   margin-right: var(--text-divider-gap);
 }
 .textDivider2::after {
   content: "";
   height: 1px;
-  background-color: #d8d8d8;
+  background-color: var(--color-shadow);
   flex-grow: 1;
   margin-left: var(--text-divider-gap);
 }
@@ -138,7 +138,7 @@ h3 {
   width: 38rem;
   height: 400px;
   border-radius: 10px;
-  border: 1px solid #d8d8d8;
+  border: 1px solid var(--color-shadow);
 }
 
 .pathName {