From c3854d38e3c70cbf2e083bf70a93c9ee070b800d Mon Sep 17 00:00:00 2001 From: Carter McBride <18412686+carterworks@users.noreply.github.com> Date: Fri, 23 Aug 2024 13:59:51 -0600 Subject: [PATCH] Add dark mode --- src/pages/index.astro | 92 ++++++++++++++++++++++++++++--------------- 1 file changed, 61 insertions(+), 31 deletions(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index c3aa4ab..77662f5 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -17,52 +17,52 @@ const categories = Array.from( const accentColors = { slate: { - bg: "bg-slate-200", - bl: "border-l-slate-200", + bg: "bg-slate-200 dark:bg-slate-600", + bl: "border-l-slate-200 dark:border-l-slate-600", }, stone: { - bg: "bg-stone-200", - bl: "border-l-stone-200", + bg: "bg-stone-200 dark:bg-stone-600", + bl: "border-l-stone-200 dark:border-l-stone-600", }, red: { - bg: "bg-red-200", - bl: "border-l-red-200", + bg: "bg-red-200 dark:bg-red-600", + bl: "border-l-red-200 dark:border-l-red-600", }, amber: { - bg: "bg-amber-200", - bl: "border-l-amber-200", + bg: "bg-amber-200 dark:bg-amber-600", + bl: "border-l-amber-200 dark:border-l-amber-600", }, lime: { - bg: "bg-lime-200", - bl: "border-l-lime-200", + bg: "bg-lime-200 dark:bg-lime-600", + bl: "border-l-lime-200 dark:border-l-lime-600", }, emerald: { - bg: "bg-emerald-200", - bl: "border-l-emerald-200", + bg: "bg-emerald-200 dark:bg-emerald-600", + bl: "border-l-emerald-200 dark:border-l-emerald-600", }, cyan: { - bg: "bg-cyan-200", - bl: "border-l-cyan-200", + bg: "bg-cyan-200 dark:bg-cyan-600", + bl: "border-l-cyan-200 dark:border-l-cyan-600", }, sky: { - bg: "bg-sky-200", - bl: "border-l-sky-200", + bg: "bg-sky-200 dark:bg-sky-600", + bl: "border-l-sky-200 dark:border-l-sky-600", }, indigo: { - bg: "bg-indigo-200", - bl: "border-l-indigo-200", + bg: "bg-indigo-200 dark:bg-indigo-600", + bl: "border-l-indigo-200 dark:border-l-indigo-600", }, fuchsia: { - bg: "bg-fuchsia-200", - bl: "border-l-fuchsia-200", + bg: "bg-fuchsia-200 dark:bg-fuchsia-600", + bl: "border-l-fuchsia-200 dark:border-l-fuchsia-600", }, pink: { - bg: "bg-pink-200", - bl: "border-l-pink-200", + bg: "bg-pink-200 dark:bg-pink-600", + bl: "border-l-pink-200 dark:border-l-pink-600", }, rose: { - bg: "bg-rose-200", - bl: "border-l-rose-200", + bg: "bg-rose-200 dark:bg-rose-600", + bl: "border-l-rose-200 dark:border-l-rose-600", }, }; @@ -105,7 +105,7 @@ const categoriesSelectorCss = ["Recent", ...categories]
- +
{[ @@ -181,5 +190,26 @@ const categoriesSelectorCss = ["Recent", ...categories] } +