style: adjust header color and footer link hover effecets

Author: nikohoffren

components/buttons/Sponsor.tsx

@@ -2,7 +2,7 @@
 function Sponsor() {
   return (
     <a
-      className='inline-block'
+      className='inline-block transition-transform duration-200 hover:scale-105 hover:drop-shadow-lg'
       target='_blank'
       rel='noopener noreferrer'
       href='https://github.com/sponsors/nikohoffren?o=esc'

components/layout/Footer.tsx

@@ -99,7 +99,7 @@ const Footer = () => {
                 >
                   <span>GitHub Stars</span>
                   {starCount !== null ? (
-                    <span className='ml-2 rounded-full bg-gray-100 px-2 py-1 text-xs text-gray-700 group-hover:bg-gray-200'>
+                    <span className='ml-2 rounded-full bg-gray-100 px-2 py-1 text-xs text-gray-700'>
                       {starCount}
                     </span>
                   ) : (

components/layout/Header.tsx

@@ -118,7 +118,7 @@ const Header = () => {
   }
 
   return (
-    <nav className='border-b border-gray-200 bg-[var(--bg-primary)] shadow-md dark:border-gray-700'>
+    <nav className='border-b border-gray-200 bg-gray-50 shadow-md dark:border-gray-700'>
       <div className='modern-container'>
         <div className='flex h-16 items-center justify-between'>
           <div className='flex items-center space-x-8'>