From 7fe0150e52937e8f6bc40fd2b3f2f2e0f61f76db Mon Sep 17 00:00:00 2001
From: cibietici <carloalberto.burato@gmail.com>
Date: Tue, 23 Apr 2024 13:06:21 +0200
Subject: [PATCH 1/2] Improve layout of content for responsive when content
 overflow

---
 packages/spor-react/src/table/Table.tsx           | 2 +-
 packages/spor-react/src/theme/components/table.ts | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/spor-react/src/table/Table.tsx b/packages/spor-react/src/table/Table.tsx
index 2b6609c6e..40c28e3b9 100644
--- a/packages/spor-react/src/table/Table.tsx
+++ b/packages/spor-react/src/table/Table.tsx
@@ -32,7 +32,7 @@ export const Table = forwardRef<TableProps, "table">((props, ref) => {
   const { variant, size, colorScheme, children, ...rest } = props;
   return (
     <Box {...rest} {...getStyleProps(props)}>
-      <Box overflowX="auto">
+      <Box overflowX="auto" role="region">
         <ChakraTable
           variant={variant}
           size={size}
diff --git a/packages/spor-react/src/theme/components/table.ts b/packages/spor-react/src/theme/components/table.ts
index cdeb0588d..83777160e 100644
--- a/packages/spor-react/src/theme/components/table.ts
+++ b/packages/spor-react/src/theme/components/table.ts
@@ -17,13 +17,17 @@ const config = helpers.defineMultiStyleConfig({
       borderCollapse: "collapse",
       ...baseText("default", props),
       width: "100%",
+      minWidth: "600px",
     },
     th: {
       fontWeight: "bold",
       textAlign: "start",
+      verticalAlign: "top",
+      minWidth: "68px",
     },
     td: {
       textAlign: "start",
+      verticalAlign: "top",
     },
     tfoot: {
       tr: {

From d998cb8f2117c32e6b8b84068efc999425d218a3 Mon Sep 17 00:00:00 2001
From: cibietici <carloalberto.burato@gmail.com>
Date: Tue, 23 Apr 2024 13:22:36 +0200
Subject: [PATCH 2/2] Add changeset

---
 .changeset/large-bobcats-kick.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/large-bobcats-kick.md

diff --git a/.changeset/large-bobcats-kick.md b/.changeset/large-bobcats-kick.md
new file mode 100644
index 000000000..79b49f9f3
--- /dev/null
+++ b/.changeset/large-bobcats-kick.md
@@ -0,0 +1,5 @@
+---
+"@vygruppen/spor-react": patch
+---
+
+Improve layout of tables when content overflow and in responsive views