feat: change background color

pseudobun · Oct 12, 2024 · 8c4c2fa · 8c4c2fa
1 parent 5364736
commit 8c4c2fa
Show file tree

Hide file tree

Showing 12 changed files with 18 additions and 17 deletions.
diff --git a/packages/portfolio/src/app/api/og/route.tsx b/packages/portfolio/src/app/api/og/route.tsx
@@ -56,12 +56,12 @@ export async function GET(request: Request) {
           style={{ justifyContent: 'space-between' }}
         >
           <Bunny tw="h-64 w-64" />
-          <div tw="h-[128px] w-[2px] bg-gray-600 mx-8" />
+          <div tw="h-[128px] w-[2px] bg-stone-600 mx-8" />
           <div tw="flex flex-col">
-            <p tw="text-gray-200 text-5xl" style={{ fontFamily: '"Ubuntu"' }}>
+            <p tw="text-stone-200 text-5xl" style={{ fontFamily: '"Ubuntu"' }}>
               {title}
             </p>
-            <p tw="text-gray-200 text-3xl" style={{ fontFamily: '"Sofia"' }}>
+            <p tw="text-stone-200 text-3xl" style={{ fontFamily: '"Sofia"' }}>
               {description}
             </p>
           </div>

diff --git a/packages/portfolio/src/app/gallery/page.tsx b/packages/portfolio/src/app/gallery/page.tsx
@@ -9,7 +9,7 @@ export const revalidate = 604800;
 export default async function Gallery() {
   const urls = await getImageUrls();
   return (
-    <div className="flex flex-1 flex-col h-full gap-y-10 w-full justify-start mb-12 text-gray-200">
+    <div className="flex flex-1 flex-col h-full gap-y-10 w-full justify-start mb-12 text-stone-200">
       <div>
         <p className="sm:text-3xl text-3xl">Gallery</p>
         <p className="sm:text-xl text-xl">Sometimes I 📸 stuff.</p>

diff --git a/packages/portfolio/src/app/layout.tsx b/packages/portfolio/src/app/layout.tsx
@@ -17,7 +17,8 @@ export default function RootLayout({
     <html lang="en" className={portfolioFont.className}>
       <body>
         <Providers>
-          <main className="text-cappuccino no-scrollbar flex h-full min-h-screen w-full flex-col items-center justify-center bg-gradient-to-tr from-black to-gray-800 bg-fixed sm:p-24 p-6">
+          <main className="text-cappuccino no-scrollbar flex h-full min-h-screen w-full flex-col items-center justify-center bg-gradient-to-tr from-black to-stone-800 bg-fixed sm:p-24 p-6">
+            {/* <main className="text-cappuccino no-scrollbar flex h-full min-h-screen w-full flex-col items-center justify-center bg-stone-950 bg-fixed sm:p-24 p-6"> */}
             <Navigation />
             {children}
             {/* <Footer /> */}

diff --git a/packages/portfolio/src/app/not-found.tsx b/packages/portfolio/src/app/not-found.tsx
@@ -9,7 +9,7 @@ export default function NotFound() {
         src="/bunnysden.svg"
         className="h-4/5 w-4/5 flex-1 md:h-1/3 md:w-1/3"
       />
-      <p className="text-md text-center md:text-xl text-gray-200">
+      <p className="text-md text-center md:text-xl text-stone-200">
         404: You ain't gonna find anything here
       </p>
       <ExoticLink aria-label="Go to homepage" noEnlarge href="/">

diff --git a/packages/portfolio/src/app/page.tsx b/packages/portfolio/src/app/page.tsx
@@ -16,7 +16,7 @@ export default function Home() {
         src="bunnysden.svg"
         className="h-4/5 w-4/5 flex-1 md:h-1/3 md:w-1/3"
       />
-      <div className="font-mono text-2xl text-gray-300 max-w-full">
+      <div className="font-mono text-2xl text-stone-300 max-w-full">
         <Typewriter
           options={{ cursor: '█' }}
           onInit={(typewriter) => {

diff --git a/packages/portfolio/src/app/projects/page.tsx b/packages/portfolio/src/app/projects/page.tsx
@@ -6,7 +6,7 @@ export const metadata = {
 
 export default function Projects() {
   return (
-    <div className="flex flex-1 flex-col h-full gap-y-10 w-full justify-start mb-12 text-gray-200">
+    <div className="flex flex-1 flex-col h-full gap-y-10 w-full justify-start mb-12 text-stone-200">
       <div>
         <p className="sm:text-3xl text-3xl">Projects</p>
         <p className="sm:text-xl text-xl">I 🤍 building things.</p>

diff --git a/packages/portfolio/src/components/AboutMe/index.tsx b/packages/portfolio/src/components/AboutMe/index.tsx
@@ -7,7 +7,7 @@ import { PERSONAL } from '@/constants/data.mjs';
 
 export default function AboutMe() {
   return (
-    <div className="flex max-w-5xl flex-1 flex-col content-center items-center justify-center text-gray-200 md:flex-row">
+    <div className="flex max-w-5xl flex-1 flex-col content-center items-center justify-center text-stone-200 md:flex-row">
       <motion.div
         initial={{ scale: 0.3, opacity: 0 }}
         animate={{ scale: 1, opacity: 1 }}

diff --git a/packages/portfolio/src/components/GallerySkeleton/index.tsx b/packages/portfolio/src/components/GallerySkeleton/index.tsx
@@ -9,7 +9,7 @@ export default function GallerySkeleton() {
             key={index}
             className="w-full xl:w-1/3 2xl:w-1/4 flex justify-center"
           >
-            <div className="h-[1024px] w-[512px] bg-gray-200 rounded-lg" />
+            <div className="h-[1024px] w-[512px] bg-stone-200 rounded-lg" />
           </div>
         ))}
     </div>

diff --git a/packages/portfolio/src/components/Menu/index.tsx b/packages/portfolio/src/components/Menu/index.tsx
@@ -22,7 +22,7 @@ export default function Menu({ isOpen }: MenuProps) {
       leave="transition duration-500 ease-out"
       leaveFrom="transform scale-100 opacity-100"
       leaveTo="transform scale-60 opacity-0"
-      className="z-90 fixed inset-0 flex flex-col bg-gradient-to-tr from-black to-gray-800"
+      className="z-90 fixed inset-0 flex flex-col bg-gradient-to-tr from-black to-stone-800"
     >
       <div className="flex flex-1 flex-col items-center justify-center space-y-4 text-2xl">
         {MENUS.map((menu: MenuInput) =>

diff --git a/packages/portfolio/src/components/Navigation/index.tsx b/packages/portfolio/src/components/Navigation/index.tsx
@@ -17,7 +17,7 @@ export default function Navigation() {
   return (
     <>
       <div className="fixed left-1/2 bottom-4 transform -translate-x-1/2 z-50 md:left-6 lg:bottom-auto md:top-6 md:transform-none">
-        <div className="max-sm:bg-gradient-to-bl from-gray-700/40 to-gray-800/50 backdrop-blur-md md:backdrop-blur-none p-1 lg:p-0 rounded-full">
+        <div className="from-stone-700/40 to-stone-800/50 backdrop-blur-md md:backdrop-blur-none p-1 lg:p-0 rounded-full">
           <Hamburger
             aria-label="Open menu"
             size={24}

diff --git a/packages/portfolio/src/components/ProfileCard/index.tsx b/packages/portfolio/src/components/ProfileCard/index.tsx
@@ -61,7 +61,7 @@ export default function ProfileCard() {
     <div className="w-full max-w-lg" style={{ perspective: '1000px' }}>
       <div
         ref={cardRef}
-        className="transition-transform duration-100 transform-gpu shadow-2xl rounded-xl bg-gradient-to-tr from-gray-800/50 p-4 to-gray-900/50"
+        className="transition-transform duration-100 transform-gpu shadow-2xl rounded-xl bg-gradient-to-tr from-stone-800/50 p-4 to-stone-900/50"
         style={{ transformStyle: 'preserve-3d' }}
       >
         <div className="flex flex-col items-center pb-2">

diff --git a/packages/portfolio/src/components/ProjectCard/index.tsx b/packages/portfolio/src/components/ProjectCard/index.tsx
@@ -118,7 +118,7 @@ export default function ProjectCard({
           <Card
             isFooterBlurred
             className={clsx(
-              'dark border-none h-72 w-full max-w-[512px] bg-gradient-to-bl from-gray-700/40 to-gray-800/50',
+              'dark border-none h-72 w-full max-w-[512px] bg-gradient-to-bl from-stone-700/40 to-stone-800/50',
               highlight ? 'animate-glow' : '',
             )}
             isBlurred
@@ -127,13 +127,13 @@ export default function ProjectCard({
           >
             {showClickMe &&
               (hideProjectCardOverlay ? null : (
-                <div className="absolute flex backdrop-blur-md h-full w-full inset-0 z-10 rounded-lg bg-gradient-to-b from-black/50 to-gray-900/50 items-center justify-center">
+                <div className="absolute flex backdrop-blur-md h-full w-full inset-0 z-10 rounded-lg bg-gradient-to-b from-black/50 to-stone-900/50 items-center justify-center">
                   <p className="animate-pulse text-xl">
                     Click me for more info!
                   </p>
                 </div>
               ))}
-            <CardHeader className="justify-between py-1 absolute rounded-xl bg-gradient-to-bl from-gray-700/90 to-gray-800/80 top-1  w-[calc(100%_-_8px)] shadow-lg ml-1 z-10">
+            <CardHeader className="justify-between py-1 absolute rounded-xl bg-gradient-to-bl from-stone-700/90 to-stone-800/80 top-1  w-[calc(100%_-_8px)] shadow-lg ml-1 z-10">
               <div className="flex flex-col">
                 <p className="text-lg items-start sm:text-xl">{title}</p>
               </div>
@@ -166,7 +166,7 @@ export default function ProjectCard({
           {/* Back face */}
           <Card
             className={clsx(
-              'dark border-none h-72 w-full max-w-[512px] bg-gradient-to-bl from-gray-700/40 to-gray-800/50',
+              'dark border-none h-72 w-full max-w-[512px] bg-gradient-to-bl from-stone-700/40 to-stone-800/50',
               highlight ? 'animate-glow' : '',
             )}
             isPressable