From 15dbaea60b57a70cd33b6b4f9fe909e2ffa622ef Mon Sep 17 00:00:00 2001 From: malegre Date: Tue, 6 Feb 2024 00:06:09 -0300 Subject: [PATCH 1/5] feat(table): fixed first column --- src/theme/components/table.js | 43 ++++++++++++++++++++++++++++++----- 1 file changed, 37 insertions(+), 6 deletions(-) diff --git a/src/theme/components/table.js b/src/theme/components/table.js index c1049f8..30ec497 100644 --- a/src/theme/components/table.js +++ b/src/theme/components/table.js @@ -1,12 +1,21 @@ +const baseStyles = { + fontSize: '16px', + height: '35px', + table: { + background: 'brand.white', + borderRadius: '0 0 10px 10px' + } +}; + +const stickyTable = { + position: 'sticky', + left: '0' +}; + const table = { variants: { reg: { - fontSize: '16px', - height: '35px', - table: { - background: 'brand.white', - borderRadius: '0 0 10px 10px' - }, + ...baseStyles, thead: { color: 'brand.primary' }, @@ -29,6 +38,28 @@ const table = { textAlign: 'left', padding: '10px 20px' } + }, + + fixedFirstColumn: { + ...baseStyles, + tr: { + '& th:first-of-type': { + ...stickyTable, + backgroundColor: 'brand.white' + }, + '&:nth-of-type(even) td:first-of-type ': { + backgroundColor: 'brand.neutral50' + }, + '&:nth-of-type(odd) td:first-of-type ': { + backgroundColor: 'brand.white' + } + }, + + td: { + '&:first-of-type': { + ...stickyTable + } + } } } }; From 7d3372c117d9811a462999090d65ce02de7b24e1 Mon Sep 17 00:00:00 2001 From: malegre Date: Tue, 6 Feb 2024 18:06:29 -0300 Subject: [PATCH 2/5] feat(table): fixs from comments --- src/theme/components/table.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/theme/components/table.js b/src/theme/components/table.js index 30ec497..6356c53 100644 --- a/src/theme/components/table.js +++ b/src/theme/components/table.js @@ -7,9 +7,10 @@ const baseStyles = { } }; -const stickyTable = { +const fixedFirstColumn = { position: 'sticky', - left: '0' + left: '0', + backgroundColor: 'brand.white' }; const table = { @@ -44,8 +45,7 @@ const table = { ...baseStyles, tr: { '& th:first-of-type': { - ...stickyTable, - backgroundColor: 'brand.white' + ...fixedFirstColumn }, '&:nth-of-type(even) td:first-of-type ': { backgroundColor: 'brand.neutral50' @@ -57,7 +57,7 @@ const table = { td: { '&:first-of-type': { - ...stickyTable + ...fixedFirstColumn } } } From 93e7532ff39e45fe292bd1f9b9a2839765d5483f Mon Sep 17 00:00:00 2001 From: malegre Date: Tue, 6 Feb 2024 18:09:52 -0300 Subject: [PATCH 3/5] feat(table): fix style name --- src/theme/components/table.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/theme/components/table.js b/src/theme/components/table.js index 6356c53..d44cd48 100644 --- a/src/theme/components/table.js +++ b/src/theme/components/table.js @@ -7,7 +7,7 @@ const baseStyles = { } }; -const fixedFirstColumn = { +const fixedFirstColumnStyles = { position: 'sticky', left: '0', backgroundColor: 'brand.white' @@ -45,7 +45,7 @@ const table = { ...baseStyles, tr: { '& th:first-of-type': { - ...fixedFirstColumn + ...fixedFirstColumnStyles }, '&:nth-of-type(even) td:first-of-type ': { backgroundColor: 'brand.neutral50' @@ -57,7 +57,7 @@ const table = { td: { '&:first-of-type': { - ...fixedFirstColumn + ...fixedFirstColumnStyles } } } From e9d0711bbfb82a0d2ef3a78fc18e8cf2e7b6caea Mon Sep 17 00:00:00 2001 From: malegre Date: Wed, 7 Feb 2024 17:30:00 -0300 Subject: [PATCH 4/5] feat(table): fixs from comments --- src/theme/components/table.js | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/src/theme/components/table.js b/src/theme/components/table.js index d44cd48..7d2b90e 100644 --- a/src/theme/components/table.js +++ b/src/theme/components/table.js @@ -44,21 +44,17 @@ const table = { fixedFirstColumn: { ...baseStyles, tr: { - '& th:first-of-type': { - ...fixedFirstColumnStyles - }, - '&:nth-of-type(even) td:first-of-type ': { + 'th:first-of-type': fixedFirstColumnStyles, + '&:nth-of-type(even) td:first-of-type': { backgroundColor: 'brand.neutral50' }, - '&:nth-of-type(odd) td:first-of-type ': { + '&:nth-of-type(odd) td:first-of-type': { backgroundColor: 'brand.white' } }, td: { - '&:first-of-type': { - ...fixedFirstColumnStyles - } + '&:first-of-type': fixedFirstColumnStyles } } } From fc2b5d3ce2e1207bc3a82e0c3e9676668ed6e618 Mon Sep 17 00:00:00 2001 From: malegre Date: Wed, 7 Feb 2024 17:32:49 -0300 Subject: [PATCH 5/5] feat(table): fixs from comments --- src/theme/components/table.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/theme/components/table.js b/src/theme/components/table.js index 7d2b90e..ba9b05b 100644 --- a/src/theme/components/table.js +++ b/src/theme/components/table.js @@ -40,7 +40,6 @@ const table = { padding: '10px 20px' } }, - fixedFirstColumn: { ...baseStyles, tr: { @@ -52,7 +51,6 @@ const table = { backgroundColor: 'brand.white' } }, - td: { '&:first-of-type': fixedFirstColumnStyles }