new look for the year

tkokhing · tkokhing · commit 9d0e1812aca5 · 2026-02-21T12:54:08.000+08:00
diff --git a/src/app/_components/main_frame/alert-bar.tsx b/src/app/_components/main_frame/alert-bar.tsx
@@ -32,7 +32,7 @@ const AlertBar = ({ preview }: Props) => {
 
   return (
     <div
-      className={cn("border-b dark:bg-slate-800", {
+      className={cn("border-b dark:bg-transparent", {
         "bg-neutral-800 border-neutral-800 text-white": preview,
         "bg-neutral-50 border-neutral-200": !preview,
       })}
diff --git a/src/app/_components/main_frame/footer.tsx b/src/app/_components/main_frame/footer.tsx
@@ -2,7 +2,7 @@ import Container from "@/app/_components/preference/container";
 
 export function Footer() {
   return (
-    <footer className="bg-neutral-50 border-t border-neutral-200 dark:bg-slate-800">
+    <footer className="bg-neutral-50 border-t border-neutral-200 dark:bg-transparent">
       <Container>
         <div className="py-8 flex flex-col lg:flex-row items-center">
           <h3 className="text-2xl lg:text-[1.5rem] font-bold tracking-tighter leading-tight text-center lg:text-left mb-4 lg:mb-0 lg:pr-4 lg:w-1/2 dark:text-teal-100">
diff --git a/src/app/_components/main_frame/subpage-header.tsx b/src/app/_components/main_frame/subpage-header.tsx
@@ -43,7 +43,7 @@ const SubpageHeader = () => {
   };
 
   return (
-    <div className="sticky top-0 z-30 bg-slate-50 dark:bg-slate-900">
+    <div className="sticky top-0 z-30 bg-transparent">
       <Container>
         <h2 className="uppercase text-adaptive_fs_sm md:text-adaptive_fs_xs font-light tracking-tight md:tracking-tighter leading-tight py-1 flex items-center">
           <div className="truncate">{generateBreadcrumbs()}</div>
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,8 +1,7 @@
 import "@/styles/globals.css";
 import { Inter } from "next/font/google";
 import cn from "classnames";
-import type { Metadata } from "next";
-import type { Viewport } from 'next'
+import type { Metadata, Viewport } from "next";
 
 import AlertBar from "@/app/_components/main_frame/alert-bar";
 import { LanguageProvider } from "@/app/_components/language_handler/language-provider";
@@ -53,7 +52,7 @@ export default function RootLayout({
   return (
     <html lang="en" suppressHydrationWarning={true}>
       <body
-        className={cn(inter.className, "bg-slate-50 text-sky-700 dark:bg-slate-900 dark:text-slate-300")}
+        className={cn(inter.className, "bg-slate-50 text-sky-700 dark:bg-gradient-radial from-teal-900 from-10% to-zinc-900 to-90% dark:text-slate-300")}
       >
         <LanguageProvider>
         <ToggleFrameProvider>  
