Button styling fix

Author: Jamesllllllllll

src/components/CTA.tsx

@@ -13,7 +13,7 @@ export default function CTA() {
           developer community.
         </p>
         <a
-          className="discord-button bg-primary px-8 py-4 rounded-lg border-2 border-primary text-secondary hover:bg-secondary hover:text-primary transition-all"
+          className="discord-button bg-primary px-8 py-4 rounded-lg border-2 border-primary text-secondary hover:bg-secondary hover:text-primary transition-all hover:no-underline"
           href="https://discord.gg/code-cafe"
         >
           Join Code Cafe

src/components/Footer.tsx

@@ -6,7 +6,7 @@ export default function Footer() {
     <footer className="py-16 bg-secondary flex justify-around">
       <div className="footer-container text-primary">
         <h4 className="text-xl font-bold flex items-center gap-2">
-          <Code size={48} className="text-accent" />
+          <Code size={48} className="text-primary" />
           Code Cafe
         </h4>
         <p className="text-sm">Your home for coding and community</p>

src/components/Header.tsx

@@ -1,9 +1,13 @@
 import { NavLink } from "react-router";
+import { Code } from "lucide-react";
 
 export default function Header() {
   return (
     <header className="bg-secondary py-4 flex justify-around items-center">
-      <h1 className="text-primary text-3xl">Code Cafe</h1>
+      <div className="flex gap-2 items-center">
+        <Code size={48} className="text-primary" />
+        <h1 className="text-primary text-3xl">Code Cafe</h1>
+      </div>
       <nav>
         <ul className="flex list-none gap-3">
           <li>

src/components/Hero.tsx

@@ -23,10 +23,10 @@ export default function Hero() {
         />
       </div>
       <div className="flex gap-10 my-6">
-        <button className="px-8 py-4 rounded-lg border-2 border-secondary hover:border-secondary text-secondary hover:bg-secondary hover:text-primary transition-all">
+        <button className="px-8 py-4 text-primary rounded-lg border-2 border-secondary hover:border-secondary bg-secondary hover:text-secondary hover:bg-primary transition-all">
           Join us
         </button>
-        <button className="px-8 py-4 rounded-lg border-2 border-secondary hover:border-secondary text-secondary hover:bg-secondary hover:text-primary transition-all">
+        <button className="px-8 py-4 text-primary rounded-lg border-2 border-secondary hover:border-secondary bg-secondary hover:text-secondary hover:bg-primary transition-all">
           Learn more
         </button>
       </div>

src/index.css

@@ -57,9 +57,11 @@ button {
   cursor: pointer;
   transition: border-color 0.25s;
 }
+
 button:hover {
   border-color: #646cff;
 }
+
 button:focus,
 button:focus-visible {
   outline: 4px auto -webkit-focus-ring-color;