Figma: People Page Violates The Figma Style Guide

public/locales/en/translation.json

@@ -315,8 +315,8 @@
     "confirmPassword": "confirmPassword",
     "create": "create",
     "cancel": "cancel",
-    "user": "user",
-    "profile": "profile"
+    "user": "User",
+    "profile": "Profile"
   },
   "organizationTags": {
     "title": "Organization Tags",

src/components/CheckIn/TableRow.tsx

@@ -73,7 +73,7 @@ export const TableRow = ({
       inputs.push({ name: data.name.trim() });
       const pdf = await generate({ template: tagTemplate, inputs });
       // istanbul ignore next
-      const blob = new Blob([pdf.buffer], { type: 'application/pdf' });
+      const blob = new Blob([pdf], { type: 'application/pdf' });
       // istanbul ignore next
       const url = URL.createObjectURL(blob);
       // istanbul ignore next

src/components/CollapsibleDropdown/CollapsibleDropdown.tsx

@@ -43,21 +43,21 @@ const collapsibleDropdown = ({
     <>
       <Button
         variant={showDropdown ? 'success' : ''}
-        className={showDropdown ? 'text-white' : 'text-secondary'}
+        className={showDropdown ? 'text-black' : 'text-secondary'}
         onClick={(): void => setShowDropdown(!showDropdown)}
         aria-expanded={showDropdown}
         data-testid="collapsible-dropdown"
       >
         <div className={styles.iconWrapper}>
           <IconComponent
             name={name}
-            fill={showDropdown ? 'var(--bs-white)' : 'var(--bs-secondary)'}
+            fill={showDropdown ? 'var(--bs-black)' : 'var(--bs-secondary)'}
           />
         </div>
         {tCommon(name)}
         <i
           className={`ms-auto fa  
-          ${showDropdown ? 'var(--bs-white)' : 'var(--bs-secondary)'} 
+          ${showDropdown ? 'var(--bs-black)' : 'var(--bs-secondary)'} 
           ${showDropdown ? 'fa-chevron-up' : 'fa-chevron-down'}
           `}
         />
@@ -74,7 +74,7 @@ const collapsibleDropdown = ({
                       variant={isActive === true ? 'success' : 'light'}
                       size="sm"
                       className={`${styles.collapseBtn} ${
-                        isActive === true ? 'text-white' : 'text-secondary'
+                        isActive === true ? 'text-black' : 'text-secondary'
                       }`}
                       onClick={(): void => {
                         navigate(url);
@@ -88,7 +88,7 @@ const collapsibleDropdown = ({
                       <div className="ms-auto">
                         <i
                           className={`fa me-2 fa-chevron-right ${
-                            isActive === true ? 'text-white' : 'text-secondary'
+                            isActive === true ? 'text-black' : 'text-secondary'
                           }`}
                         />
                       </div>

src/components/LeftDrawer/LeftDrawer.tsx

@@ -96,15 +96,15 @@ const leftDrawer = ({
                   <Button
                     variant={isActive === true ? 'success' : ''}
                     className={`${
-                      isActive === true ? 'text-white' : 'text-secondary'
+                      isActive === true ? 'text-black' : 'text-secondary'
                     }`}
                     data-testid="rolesBtn"
                   >
                     <div className={styles.iconWrapper}>
                       <RolesIcon
                         fill={`${
                           isActive === true
-                            ? 'var(--bs-white)'
+                            ? 'var(--bs-black)'
                             : 'var(--bs-secondary)'
                         }`}
                       />
@@ -118,7 +118,7 @@ const leftDrawer = ({
                   <Button
                     variant={isActive === true ? 'success' : ''}
                     className={`${
-                      isActive === true ? 'text-white' : 'text-secondary'
+                      isActive === true ? 'text-black' : 'text-secondary'
                     }`}
                     data-testid="communityProfileBtn"
                   >