From 1e6d9cd44e5ccc6ed3189028db352e97714328e7 Mon Sep 17 00:00:00 2001 From: Fernando Date: Tue, 9 May 2023 07:17:44 -0700 Subject: [PATCH] style: improve design and spacing - change background color from bg-zinc-800 to bg-slate-900 - update ui component's background color from zinc to slate - improve sorted table styling - add more spacing to buttons on getting started page --- client/index.html | 4 +- .../src/components/base/blocks/CodeBlock.tsx | 4 +- .../components/base/buttons/IconButton.tsx | 4 +- .../src/components/base/loading/Skeleton.tsx | 2 +- client/src/components/base/nav/Navbar.tsx | 2 +- client/src/components/base/nav/Sidebar.tsx | 20 ++--- client/src/components/cards/DashboardCard.tsx | 2 +- client/src/components/tables/SortedTable.tsx | 86 ++++++++++--------- .../pages/dashboard/GettingStartedPage.tsx | 6 +- 9 files changed, 66 insertions(+), 64 deletions(-) diff --git a/client/index.html b/client/index.html index dbcd974..ae22757 100644 --- a/client/index.html +++ b/client/index.html @@ -1,9 +1,9 @@ - + - + RenderMy.Site - Dynamic Rendering for JavaScript Websites diff --git a/client/src/components/base/blocks/CodeBlock.tsx b/client/src/components/base/blocks/CodeBlock.tsx index 591f3ad..eb1cbd2 100644 --- a/client/src/components/base/blocks/CodeBlock.tsx +++ b/client/src/components/base/blocks/CodeBlock.tsx @@ -17,9 +17,9 @@ export function CodeBlock({classes, code, language}: CodeBlockProps) { return (
-
+

{language}

- +
           {code}
diff --git a/client/src/components/base/buttons/IconButton.tsx b/client/src/components/base/buttons/IconButton.tsx
index d6c08d7..df839d2 100644
--- a/client/src/components/base/buttons/IconButton.tsx
+++ b/client/src/components/base/buttons/IconButton.tsx
@@ -20,7 +20,7 @@ const iconStyle = cn`
   text-zinc-500
 
   cursor-pointer
-  hover:bg-zinc-800
+  hover:bg-slate-800
   hover:text-white
-  active:bg-zinc-900
+  active:bg-slate-900
 `;
diff --git a/client/src/components/base/loading/Skeleton.tsx b/client/src/components/base/loading/Skeleton.tsx
index c5dba85..700fdd3 100644
--- a/client/src/components/base/loading/Skeleton.tsx
+++ b/client/src/components/base/loading/Skeleton.tsx
@@ -2,5 +2,5 @@ import {cn} from "@/lib/utils";
 
 /** Provides a simple rectangular skeleton for use when a component is loading. */
 export function Skeleton({className}: { className?: string }) {
-  return 
; + return
; } diff --git a/client/src/components/base/nav/Navbar.tsx b/client/src/components/base/nav/Navbar.tsx index 9a69c40..b6058ea 100644 --- a/client/src/components/base/nav/Navbar.tsx +++ b/client/src/components/base/nav/Navbar.tsx @@ -12,7 +12,7 @@ import {cn} from "@/lib/utils"; export function Navbar({className}: {className?: string}) { return ( -