Merge pull request #389 from COS301-SE-2024/hotfix/darkmode_org_fix

Hotfix: Dark Mode Enhancements and User Deletion Image Update
COS301-SE-2024 · Oct 15, 2024 · 07b4eb5 · 07b4eb5
2 parents c1375d8 + fa00f22
commit 07b4eb5
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 23 deletions.
diff --git a/backend/src/modules/users/repositories/userAdminRepository.ts b/backend/src/modules/users/repositories/userAdminRepository.ts
@@ -108,7 +108,7 @@ export default class UserAdminRepository {
           email_address: `deleted_${rand}@gmail.com`,
           username: `deleted_${rand}`,
           image_url:
-            "https://plvofqwscloxamqxcxhz.supabase.co/storage/v1/object/public/user/profile_pictures/default.png",
+            "/images/default.png",
           fullname: "deleted_user",
           user_score: 0,
           location_id: null,

diff --git a/frontend/components/OrganizationTabs/MembersTab.tsx b/frontend/components/OrganizationTabs/MembersTab.tsx
@@ -132,7 +132,7 @@ export default function MembersTab({ organization, members, setMembers }: Member
           {members.data.map((member) => (
             <div 
               key={member.user_id} 
-              className="flex items-center justify-between p-2 hover:bg-gray-100 cursor-pointer rounded-md transition-colors duration-200"
+              className="flex items-center justify-between p-2 hover:bg-gray-100 dark:hover:bg-grey cursor-pointer rounded-md transition-colors duration-200"
               onClick={() => handleRowClick(member.user_id)}
             >
               <div className="flex items-center space-x-4">

diff --git a/frontend/components/Sidebar/Sidebar.tsx b/frontend/components/Sidebar/Sidebar.tsx
@@ -359,27 +359,27 @@ const Sidebar: React.FC<SidebarProps> = ({ isOpen, onClose }) => {
           {user && (
             <div className={styles.userAccount}>
               {showLogout && (
-                <div className={styles.logoutOverlay}>
-                  <ul className={styles.sidebarLinks}>
-                    <li>
-                      <Link href="/login" onClick={() => signOutWithToast(toast)}>
-                        <LogoutIcon />
-                        Logout
-                      </Link>
-                    </li>
-                  </ul>
-                </div>
+              <div className={`${styles.logoutOverlay} dark:border-gray-400 hover:bg-gray-200 dark:hover:bg-black dark:bg-background dark:text-white`}>
+                <ul className={styles.sidebarLinks}>
+                <li>
+                  <Link className="dark:border-none hover:bg-gray-200 dark:hover:bg-black focus:ring-green-200 dark:bg-background dark:text-white p-0 m-0" href="/login" onClick={() => signOutWithToast(toast)}>
+                  <LogoutIcon />
+                  Logout
+                  </Link>
+                </li>
+                </ul>
+              </div>
               )}
               <div className={styles.userProfile} onClick={toggleLogout}>
-                <Avatar>
-                  <AvatarImage src={user.image_url} />
-                  <AvatarFallback>{user.fullname[0].toUpperCase()}</AvatarFallback>
-                </Avatar>
-                <div className={`w-[70%] overflow-hidden overflow-ellipsis ${styles.userDetail}`}>
-                  <h3 className="inline">{user.fullname}</h3>
-                  <br />
-                  <span>@{user.username}</span>
-                </div>
+              <Avatar>
+                <AvatarImage src={user.image_url} />
+                <AvatarFallback>{user.fullname[0].toUpperCase()}</AvatarFallback>
+              </Avatar>
+              <div className={`w-[70%] overflow-hidden overflow-ellipsis ${styles.userDetail}`}>
+                <h3 className="inline">{user.fullname}</h3>
+                <br />
+                <span>@{user.username}</span>
+              </div>
               </div>
             </div>
           )}

diff --git a/frontend/styles/Custom.module.css b/frontend/styles/Custom.module.css
@@ -123,7 +123,7 @@
   top: -50px; /* Adjust this value as needed */
   width: 100%;
   background-color: white;
-  border: 1px solid #ccc;
+  border: 2px solid #ccc;
   border-radius: 15px; /* Rounded corners */
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   z-index: 10;
@@ -137,7 +137,7 @@
 }
 
 .logoutOverlay li {
-  padding: 10px;
+  padding: 0;
 }
 
 .logoutOverlay li a {