Add new white background color

Author: Cykotech

src/components/Features.tsx

@@ -2,7 +2,7 @@ import { Users, CircleHelp, BookOpen } from "lucide-react";
 
 export default function Features() {
   return (
-    <section className="bg-secondary py-20">
+    <section className="bg-background py-20">
       <div className="outer">
         <div className="inner">
           <div className="flex-1 flex flex-col items-center text-center py-6">

src/components/Footer.tsx

@@ -3,7 +3,7 @@ import { Code } from "lucide-react";
 
 export default function Footer() {
   return (
-    <footer className="py-16 bg-secondary flex justify-around">
+    <footer className="py-16 bg-background 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-primary" />

src/components/Showcase.tsx

@@ -2,8 +2,8 @@ import { Smile } from "lucide-react";
 
 export default function Showcase() {
   return (
-    <section className="flex flex-col items-center bg-secondary py-20">
-      <h2 className="text-xl md:text-xl lg:text-4xl mb-6">
+    <section className="flex flex-col items-center bg-background py-20">
+      <h2 className="text-xl md:text-xl lg:text-4xl mb-6 text-primary">
         Community Showcase
       </h2>
       <div className="flex flex-1">

tailwind.config.js

@@ -3,6 +3,8 @@ export default {
   content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
   theme: {
     colors: {
+      background: "hsl(0,0%,70%)",
+      // background: "hsl(0, 0%, 30%)",
       primary: "#240e1f",
       secondary: "#c08021",
       accent: "#e96932",