Logo Fixed

src/app/(client-components)/(Header)/MainNav1.tsx

@@ -24,7 +24,7 @@ const MainNav1: FC<MainNav1Props> = ({ className = "" }) => {
     <div className={`nc-MainNav1 relative z-10 ${className}`}>
       <div className="px-4 lg:container h-20 relative flex justify-between">
         <div className="hidden md:flex justify-start flex-1 space-x-4 sm:space-x-10">
-          <Logo className="w-24 self-center" />
+          <Logo className="w-24 self-center mr-28" />
           <Navigation />
         </div>
 

src/shared/Logo.tsx

@@ -17,16 +17,18 @@ const Logo: React.FC<LogoProps> = ({
   imgLight = logoLightImg,
   className = "w-24",
 }) => {
-  
   return (
     <Link
       href="/"
-      className={`ttnc-logo inline-block text-primary-6000 focus:outline-none focus:ring-0 ${className}`}
+      className={`ttnc-logo flex text-primary-6000 focus:outline-none focus:ring-0  ${className}`}
     >
       {/* <LogoSvgLight /> */}
       {/* THIS USE FOR MY CLIENT */}
       {/* PLEASE UN COMMENT BELLOW CODE AND USE IT */}
+        
       {img ? (
+        <div className={`w-96  flex flex-row max-h-12 ${imgLight ? "dark:hidden" : ""}`}>
+
         <Image
           width={40}
           height={40}
@@ -34,10 +36,16 @@ const Logo: React.FC<LogoProps> = ({
           src={img}
           alt="Logo"
         />
+          <h3 className="hidden font-bold ml-2 lg:flex items-center text-black">AQILA</h3>
+
+        </div>
+
       ) : (
         "Logo Here"
       )}
       {imgLight && (
+        <div className="w-96  flex flex-row">
+          {" "}
           <Image
             width={40}
             height={40}
@@ -45,6 +53,8 @@ const Logo: React.FC<LogoProps> = ({
             src={imgLight}
             alt="Logo-Light"
           />
+          <h3 className="hidden font-bold ml-2 lg:dark:flex items-center text-bronze-secondary">AQILA</h3>
+        </div>
       )}
     </Link>
   );