fix error datatable

georgepiter · Apr 11, 2023 · ea8fbc8 · ea8fbc8
1 parent 65e734f
commit ea8fbc8
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 18 deletions.
diff --git a/src/components/DataTableBase.tsx b/src/components/DataTableBase.tsx
@@ -21,7 +21,7 @@ export default function DataTableBase({ columns, data, title = "" }: Props) {
  const tableCustomStyles = {
  table: {
  style: {
- marginBottom: data.length === 1 ? "20px" : "",
+ marginBottom: data.length <= 2 ? "90px" : "",
  color:
  colorMode == "dark"
  ? theme.colors.gray["300"]
@@ -57,7 +57,7 @@ export default function DataTableBase({ columns, data, title = "" }: Props) {
  },
  rows: {
  style: {
- marginBottom: data.length === 1 ? "60px" : "",
+ marginBottom: data.length <= 2 ? "10px" : "",
  color: colorMode == "dark" ? "white" : "black",
  backgroundColor:
  colorMode == "dark" ? theme.colors.gray["800"] : "white",

diff --git a/src/components/tables/DebtsAllTable.tsx b/src/components/tables/DebtsAllTable.tsx
@@ -146,18 +146,17 @@ export default function DebtsAllTable({ userId }: Props) {
  {debts.length === 0 ? (
  <Text>Nenhum registro encontrado.</Text>
  ) : (
- <Tabs position="relative" variant="unstyled">
+ <Tabs isFitted variant="unstyled">
  <TabList>
  {categoriesDebt.map((category) => (
- <Tab key={category.categoryId}>{category.description}</Tab>
+ <Tab
+ key={category.categoryId}
+ _selected={{ color: "white", bg: "secondary.500" }}
+ >
+ <Text as="b">{category.description}</Text>
+ </Tab>
  ))}
  </TabList>
- <TabIndicator
- mt="-1.5px"
- height="2px"
- bg="secondary.500"
- borderRadius="1px"
- />
  <TabPanels>
  {debts.map((category) => (
  <TabPanel key={category.categoryId}>

diff --git a/src/pages/debt/index.tsx b/src/pages/debt/index.tsx
@@ -814,18 +814,17 @@ export default function Debt() {
  </HStack>
  <Divider mt={2} />
 
- <Tabs position="relative" variant="unstyled">
+ <Tabs isFitted variant="unstyled">
  <TabList>
  {categoriesDebt.map((category) => (
- <Tab key={category.categoryId}>{category.description}</Tab>
+ <Tab
+ key={category.categoryId}
+ _selected={{ color: "white", bg: "secondary.500" }}
+ >
+ <Text as="b">{category.description}</Text>
+ </Tab>
  ))}
  </TabList>
- <TabIndicator
- mt="-1.5px"
- height="2px"
- bg="secondary.500"
- borderRadius="1px"
- />
  <TabPanels>
  {debts.map((category) => (
  <TabPanel key={category.categoryId}>