refactor(gui): icon text color and border color change

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui/components/smartsheet/sidebar/toolbar/ToggleDrawer.vue

@@ -11,7 +11,7 @@ const onClick = () => {
 <template>
   <div :class="{ 'nc-active-btn': isOpen }">
     <a-button size="small" class="nc-toggle-right-navbar" @click="onClick">
-      <div class="flex items-center gap-1 text-xs" :class="{ 'text-gray-500': !isOpen }">
+      <div class="flex items-center gap-1 text-xs text-gray-500" :class="{ 'text-gray-500': !isOpen }">
         <AntDesignMenuUnfoldOutlined v-if="isOpen" />
 
         <AntDesignMenuFoldOutlined v-else />

packages/nc-gui/pages/[projectType]/[projectId]/index.vue

@@ -254,7 +254,7 @@ useEventListener(document, 'keydown', async (e: KeyboardEvent) => {
         <div
           style="height: var(--header-height); border-bottom-width: 1px"
           :class="isOpen ? 'pl-4' : ''"
-          class="flex items-center !bg-white-500 text-primary px-1 gap-1 border-gray-200 nc-sidebar-header"
+          class="flex items-center !bg-white-500 text-primary px-1 gap-1 border-gray-150 nc-sidebar-header"
         >
           <div
             v-if="isOpen && !isSharedBase"

packages/nc-gui/pages/[projectType]/[projectId]/index/index.vue

@@ -31,7 +31,7 @@ function onEdit(targetKey: number, action: 'add' | 'remove' | string) {
 <template>
   <div class="h-full w-full nc-container">
     <div class="h-full w-full flex flex-col">
-      <div class="flex items-end !min-h-[var(--header-height)] !bg-white-500 nc-tab-bar border-gray-200" style="border-bottom-width: 1px">
+      <div class="flex items-end !min-h-[var(--header-height)] !bg-white-500 nc-tab-bar border-gray-150" style="border-bottom-width: 1px">
         <div
           v-if="!isOpen"
           class="nc-sidebar-left-toggle-icon hover:after:(bg-primary bg-opacity-75) group nc-sidebar-add-row py-2 px-3"