From d925d166158d86fbc34ef144b252235969056c62 Mon Sep 17 00:00:00 2001
From: Huy Bui <huy03081999@gmail.com>
Date: Mon, 17 Jun 2024 12:20:49 +0700
Subject: [PATCH] feat: add color for table info

---
 .../EditorSidePanel/NotesTab/NoteInfo.jsx           |  2 +-
 .../EditorSidePanel/TablesTab/TablesTab.jsx         | 13 ++++++++++---
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/EditorSidePanel/NotesTab/NoteInfo.jsx b/src/components/EditorSidePanel/NotesTab/NoteInfo.jsx
index 8ceee8ee..ccf18590 100644
--- a/src/components/EditorSidePanel/NotesTab/NoteInfo.jsx
+++ b/src/components/EditorSidePanel/NotesTab/NoteInfo.jsx
@@ -98,7 +98,7 @@ export default function NoteInfo({ data, nid }) {
                     <button
                       key={c}
                       style={{ backgroundColor: c }}
-                      className="p-3 rounded-full mx-1"
+                      className="w-10 h-10 p-3 rounded-full mx-1"
                       onClick={() => {
                         setUndoStack((prev) => [
                           ...prev,
diff --git a/src/components/EditorSidePanel/TablesTab/TablesTab.jsx b/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
index 47e99cdf..b2605296 100644
--- a/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
+++ b/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
@@ -46,10 +46,17 @@ export default function TablesTab() {
           {tables.map((t) => (
             <div id={`scroll_table_${t.id}`} key={t.id}>
               <Collapse.Panel
+                className="relative"
                 header={
-                  <div className="overflow-hidden text-ellipsis whitespace-nowrap">
-                    {t.name}
-                  </div>
+                  <>
+                    <div className="overflow-hidden text-ellipsis whitespace-nowrap">
+                      {t.name}
+                    </div>
+                    <div
+                      className="w-1 h-full absolute top-0 left-0 bottom-0"
+                      style={{ backgroundColor: t.color }}
+                    />
+                  </>
                 }
                 itemKey={`${t.id}`}
               >