Grid düzenlemeleri Css

ui/src/index.css

@@ -97,4 +97,18 @@ div.dialog-after-open > div.dialog-content.maximized {
   visibility: hidden !important;
   position: absolute !important;
   left: -9999px !important;
+}
+
+.dx-toolbar .dx-toolbar-after .dx-menu,
+.dx-toolbar .dx-toolbar-after .dx-menu .dx-menu-item,
+.dx-toolbar .dx-toolbar-after .dx-menu .dx-menu-item-content,
+.dx-toolbar .dx-toolbar-after .dx-menu .dx-menu-item-wrapper {
+  display: flex !important;
+  align-items: center !important;
+  padding: 0 0 !important;
+  font-weight: bold !important;
+}
+
+.dx-datagrid-header-panel {
+  padding: 0 0 !important;
 }

ui/src/views/list/Pivot.tsx

@@ -33,7 +33,7 @@ import {
 import { useFilters } from './useFilters'
 import WidgetGroup from '@/components/common/WidgetGroup'
 import { Button, Dropdown, Notification, toast } from '@/components/ui'
-import { FaChevronDown, FaCog, FaEllipsisV, FaSave, FaTimes, FaUndo } from 'react-icons/fa'
+import { FaCaretDown, FaCog, FaSave, FaTimes, FaUndo } from 'react-icons/fa'
 import { usePermission } from '@/utils/hooks/usePermission'
 import { ROUTES_ENUM } from '@/routes/route.constant'
 import { usePWA } from '@/utils/hooks/usePWA'
@@ -421,9 +421,9 @@ const Pivot = (props: PivotProps) => {
         )}
         {gridDto && columnData && (
           <div className="p-1 bg-white dark:bg-neutral-800 dark:border-neutral-700 ">
-            <div className="flex justify-end items-center">
+            <div className="flex justify-end items-center text-black">
               <div className="relative flex gap-1">
-                <label className="flex items-center gap-1 text-xs cursor-pointer">
+                <label className="flex items-center gap-1 text-xs cursor-pointer dark:text-white">
                   <span>{translate('::ListForms.ListFormEdit.ShowChart')}</span>
                   <Checkbox checked={showChart} onChange={(checked) => setShowChart(checked)} />
                 </label>
@@ -433,13 +433,15 @@ const Pivot = (props: PivotProps) => {
                     renderTitle={
                       <Button
                         size="xs"
-                        variant={'default'}
+                        variant={'plain'}
                         className="text-sm flex items-center gap-1 border-0"
                         title="Menu"
                       >
-                        <i className="dx-icon dx-icon-overflow"></i>
+                        <i className="dx-icon dx-icon-overflow" style={{ fontSize: '17px' }}></i>
-                        <span>{translate('::ListForms.ListForm.GridMenu')}</span>
+                        <span className="text-black dark:text-white" style={{ fontSize: '13px' }}>
-                        <FaChevronDown className="w-2 h-2" />
+                          {translate('::ListForms.ListForm.GridMenu')}
+                        </span>
+                        <FaCaretDown className="ml-2 w-2 h-3" />
                       </Button>
                     }
                   >

ui/src/views/list/useFilters.tsx

@@ -21,6 +21,8 @@ import { usePWA } from '@/utils/hooks/usePWA'
 import { ROUTES_ENUM } from '@/routes/route.constant'
 import { GanttRef } from 'devextreme-react/cjs/gantt'
 import { useStoreState } from '@/store'
+import { cssClass } from 'yet-another-react-lightbox/*'
+import classNames from 'classnames'
 
 export interface ISelectBoxData {
   value?: string

ui/src/views/settings/Settings.tsx

@@ -129,7 +129,7 @@ const Settings = () => {
             {mainGroups.map((group) => (
               <Menu.MenuItem
                 key={group}
-                className="break-all whitespace-normal"
+                className="break-all whitespace-normal m-1 p-2"
                 eventKey={group}
                 onSelect={() => setActiveMainGroupKey(group)}
               >