make all mention changes and formating

Author: Ezekiel8807

public/img/logo.png

@@ -1,16 +1,20 @@
 import React from 'react';
 import Image from 'next/image';
-import logo from '../../../public/img/logo.png';
+import logo from '../../../public/img/logo.svg';
 
-type logoType = {
-    logoSize: number;
-}
-
-export default function Logo({logoSize}:logoType ) {
+type LogoType = {
+  size: number;
+};
 
-    return (
-        <div className='animate-spin'>
-            <Image src={logo} alt="logo" width ={logoSize} />
-        </div>
-    );
+export default function Logo({ size }: LogoType) {
+  return (
+    <Image
+      src={logo}
+      alt="React developer community Kenya logo"
+      width={size}
+      height={size}
+      layout="fixed"
+      className="motion-safe:animate-spin"
+    />
+  );
 }

public/img/logo.svg

@@ -1 +1 @@
-export { default } from './Logo';
+export { default } from './Logo';

src/components/Logo/Logo.tsx

@@ -1,7 +1,5 @@
 import React from 'react';
 import Link from 'next/link';
-// import Image from 'next/image';
-// import logo from '../../../public/reactdevske.svg';
 import Logo from '../Logo/Logo';
 
 import {
@@ -15,22 +13,14 @@ import {
 } from '../../util/routeConstants';
 
 export default function Navbar() {
- 
   return (
     <>
       <header className="px-[181px] w-full shadow-md bg-white">
         <nav className="nav py-4 flex flex-col lg:flex-row justify-between items-center">
           <div>
             <Link href={HOME}>
               <a>
-                {/* <Image
-                  src={logo}
-                  alt="reactdevske logo"
-                  width={137}
-                  height={60}
-                /> */}
-
-                <Logo logoSize= {60} />
+                <Logo size={60} />
               </a>
             </Link>
           </div>

src/components/Logo/index.ts

@@ -4,7 +4,7 @@ module.exports = {
   theme: {
     extend: {
       animation: {
-        'spin': 'spin 10s linear infinite',
+        spin: 'spin 10s linear infinite',
       },
       fontFamily: {
         montserrat: ['Montserrat', 'sans-serif'],