From 25b9ed63e3d3b6b631f80e7aa04b23905a433b2b Mon Sep 17 00:00:00 2001 From: Nicholas Chiang Date: Sun, 23 Jul 2023 12:56:28 -0600 Subject: [PATCH] feat: use darker tailwind `dark` theme This patch updates our `` level styles and various colors throughout the app to use the new darker `bg-gray-950` when in dark mode. This change also helps the app better align with the colors that come with `shadcn-ui` components out-of-box. See: https://tailwindcss.com/blog/tailwindcss-v3-3#extended-color-palette-for-darker-darks --- app/components/empty.tsx | 3 ++- app/root.tsx | 4 ++-- app/routes/_layout.products.$productId.tsx | 6 +++--- app/routes/_layout.products.tsx | 4 ++-- app/routes/shows.$showId/critic-reviews.tsx | 2 +- app/routes/shows.$showId/route.tsx | 2 +- app/routes/shows.$showId/scores-header.tsx | 6 +++--- app/routes/shows._index.tsx | 4 ++-- 8 files changed, 16 insertions(+), 15 deletions(-) diff --git a/app/components/empty.tsx b/app/components/empty.tsx index 2e3b628a..ef3a40b8 100644 --- a/app/components/empty.tsx +++ b/app/components/empty.tsx @@ -9,7 +9,8 @@ const emptyVariants = cva( { variants: { variant: { - default: 'border-gray-300 dark:border-gray-600 text-gray-500', + default: + 'border-gray-300 dark:border-gray-700 text-gray-500 dark:text-gray-600', error: 'border-red-700 text-red-800', warning: 'border-amber-600 text-amber-700', }, diff --git a/app/root.tsx b/app/root.tsx index 6aeea6bb..b9309278 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -53,7 +53,7 @@ function Header() { const matches = useMatches() const user = useOptionalUser() return ( -
+
    {matches .filter((match) => match.handle && match.handle.breadcrumb) @@ -198,7 +198,7 @@ function App({ data, children }: { data?: LoaderData; children: ReactNode }) { - +
    {children}