diff --git a/frontend/src/Navigation.tsx b/frontend/src/Navigation.tsx
index 2adaa69b..aed38181 100644
--- a/frontend/src/Navigation.tsx
+++ b/frontend/src/Navigation.tsx
@@ -10,7 +10,7 @@ import Add from './assets/add.svg';
 import DocsGPT3 from './assets/cute_docsgpt3.svg';
 import Discord from './assets/discord.svg';
 import Expand from './assets/expand.svg';
-import Github from './assets/github.svg';
+import Github from './assets/git_nav.svg';
 import Hamburger from './assets/hamburger.svg';
 import openNewChat from './assets/openNewChat.svg';
 import Pin from './assets/pin.svg';
@@ -568,6 +568,8 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
                 >
                   <img
                     src={Discord}
+                    width={24}
+                    height={24}
                     alt="Join Discord community"
                     className="m-2 w-6 self-center filter dark:invert"
                   />
@@ -581,8 +583,10 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
                 >
                   <img
                     src={Twitter}
+                    width={20}
+                    height={20}
                     alt="Follow us on Twitter"
-                    className="m-2 w-5 self-center filter dark:invert"
+                    className="m-2 self-center filter dark:invert"
                   />
                 </NavLink>
                 <NavLink
@@ -595,7 +599,9 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
                   <img
                     src={Github}
                     alt="View on GitHub"
-                    className="m-2 w-6 self-center filter dark:invert"
+                    width={28}
+                    height={28}
+                    className="m-2 self-center filter dark:invert"
                   />
                 </NavLink>
               </div>
diff --git a/frontend/src/components/ConnectorAuth.tsx b/frontend/src/components/ConnectorAuth.tsx
index 402ddcb4..af7e6540 100644
--- a/frontend/src/components/ConnectorAuth.tsx
+++ b/frontend/src/components/ConnectorAuth.tsx
@@ -1,5 +1,6 @@
 import React, { useRef } from 'react';
 import { useSelector } from 'react-redux';
+import { useDarkTheme } from '../hooks';
 import { selectToken } from '../preferences/preferenceSlice';
 
 interface ConnectorAuthProps {
@@ -24,6 +25,7 @@ const ConnectorAuth: React.FC<ConnectorAuthProps> = ({
   errorMessage,
 }) => {
   const token = useSelector(selectToken);
+  const [isDarkTheme] = useDarkTheme();
   const completedRef = useRef(false);
   const intervalRef = useRef<number | null>(null);
 
@@ -109,22 +111,20 @@ const ConnectorAuth: React.FC<ConnectorAuthProps> = ({
   return (
     <>
       {errorMessage && (
-        <div className="mb-4 flex items-center gap-2 rounded-md border border-[#E60000] bg-[#FFEBEB] p-3">
-          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm-1-11v4h2v-4h-2zm0-6v2h2V5h-2z" fill="#E60000"/>
+        <div className="mb-4 flex items-center gap-2 rounded-lg border border-[#E60000] dark:border-[#D42626] bg-transparent dark:bg-[#D426261A] p-2">
+          <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M7.09974 24.5422H22.9C24.5156 24.5422 25.5228 22.7901 24.715 21.3947L16.8149 7.74526C16.007 6.34989 13.9927 6.34989 13.1848 7.74526L5.28471 21.3947C4.47686 22.7901 5.48405 24.5422 7.09974 24.5422ZM14.9998 17.1981C14.4228 17.1981 13.9507 16.726 13.9507 16.149V14.0507C13.9507 13.4736 14.4228 13.0015 14.9998 13.0015C15.5769 13.0015 16.049 13.4736 16.049 14.0507V16.149C16.049 16.726 15.5769 17.1981 14.9998 17.1981ZM16.049 21.3947H13.9507V19.2964H16.049V21.3947Z" fill={isDarkTheme ? '#EECF56' : '#E60000'} />
           </svg>
-          <span style={{ 
-            fontFamily: 'Inter', 
-            fontWeight: 400, 
-            fontSize: '15px', 
-            lineHeight: '100%',
-            color: '#E60000'
+
+          <span className='text-[#E60000] dark:text-[#E37064] text-sm' style={{
+            fontFamily: 'Inter',
+            lineHeight: '100%'
           }}>
             {errorMessage}
           </span>
         </div>
       )}
-      
+
       {isConnected ? (
         <div className="mb-4">
           <div className="w-full flex items-center justify-between rounded-[10px] bg-[#8FDD51] px-4 py-2 text-[#212121] font-medium text-sm">
diff --git a/frontend/src/components/Table.tsx b/frontend/src/components/Table.tsx
index 54aba156..9e60f622 100644
--- a/frontend/src/components/Table.tsx
+++ b/frontend/src/components/Table.tsx
@@ -71,8 +71,6 @@ const TableHead: React.FC<TableHeadProps> = ({ children, className = '' }) => {
     <thead className={`
       sticky top-0 z-10
       bg-gray-100 dark:bg-[#27282D]
-      before:content-[''] before:absolute before:top-0 before:left-0 before:right-0 before:h-px before:bg-[#EEE6FF78] dark:before:bg-[#6A6A6A]
-      after:content-[''] after:absolute after:bottom-0 after:left-0 after:right-0 after:h-px after:bg-[#EEE6FF78] dark:after:bg-[#6A6A6A]
       ${className}
     `}>
       {children}
@@ -117,7 +115,7 @@ const TableHeader: React.FC<TableCellProps> = ({
     }
   };
 
-  const baseClasses = `px-2 py-3 text-sm font-medium text-gray-700 lg:px-3 dark:text-[#59636E] border-t border-b border-[#D7D7D7] dark:border-[#6A6A6A] relative box-border ${getAlignmentClass()}`;
+  const baseClasses = `px-2 py-3 text-sm font-medium text-gray-700 lg:px-3 dark:text-[#59636E] border-b border-[#D7D7D7] dark:border-[#6A6A6A] relative box-border ${getAlignmentClass()}`;
   const widthClasses = minWidth ? minWidth : '';
 
   return (
diff --git a/frontend/src/upload/Upload.tsx b/frontend/src/upload/Upload.tsx
index 174a22d6..58f97194 100644
--- a/frontend/src/upload/Upload.tsx
+++ b/frontend/src/upload/Upload.tsx
@@ -690,10 +690,10 @@ function Upload({
         {ingestorOptions.map((option) => (
           <div
             key={option.value}
-            className={`relative flex flex-col justify-between rounded-2xl cursor-pointer w-full max-w-[181px] h-[91.2px] border border-solid pt-[21.1px] pr-[21px] pb-[15px] pl-[21px] gap-[13.1px] transition-colors duration-300 ease-out mx-auto ${
+            className={`relative flex flex-col justify-between rounded-2xl cursor-pointer w-full h-[91.2px] border border-solid pt-[21.1px] pr-[21px] pb-[15px] pl-[21px] gap-2 transition-colors duration-300 ease-out mx-auto ${
               ingestor.type === option.value 
-                ? 'bg-[#7D54D1] text-white border-[#7D54D1] shadow-[0px_0px_8px_0px_#FFFFFF1A] dark:shadow-[0px_0px_8px_0px_#FFFFFF1A]' 
-                : 'bg-transparent hover:bg-[#ECECEC]/30 dark:hover:bg-[#383838]/30 border-[#D7D7D7] dark:border-[#4A4A4A] shadow-[0px_4px_40px_-3px_#0000001A]'
+                ? 'bg-[#7D54D1] text-white border-[#7D54D1]' 
+                : 'bg-transparent hover:bg-[#ECECEC]/30 dark:hover:bg-[#383838]/30 border-[#D7D7D7] dark:border-[#4A4A4A] hover:shadow-[0_0_15px_0_#00000026] transition-shadow duration-300'
             }`}
             onClick={() => handleIngestorTypeChange(option.value as IngestorType)}
           >