diff --git a/.changeset/wise-paws-itch.md b/.changeset/wise-paws-itch.md new file mode 100644 index 0000000000..866f0ee16a --- /dev/null +++ b/.changeset/wise-paws-itch.md @@ -0,0 +1,5 @@ +--- +"@navikt/ds-css": patch +--- + +Table: Removed border-bottom for HeaderCell used in ExpandableRow. diff --git a/@navikt/core/css/darkside/table.darkside.css b/@navikt/core/css/darkside/table.darkside.css index 47e6466dd8..9ee3f7e799 100644 --- a/@navikt/core/css/darkside/table.darkside.css +++ b/@navikt/core/css/darkside/table.darkside.css @@ -149,7 +149,7 @@ flex-shrink: 0; } -.navds-table__expandable-row:not(.navds-table__expandable-row--open) .navds-table__data-cell { +.navds-table__expandable-row:not(.navds-table__expandable-row--open) :where(.navds-table__data-cell, .navds-table__header-cell) { transition: border-bottom-color 150ms cubic-bezier(0.95, 0.05, 0.8, 0.04); } @@ -157,14 +157,10 @@ cursor: pointer; } -.navds-table__expandable-row--open .navds-table__data-cell { +.navds-table__expandable-row--open :where(.navds-table__data-cell, .navds-table__header-cell) { border-bottom-color: transparent; } -.navds-table__expandable-row--open .navds-table__header-cell { - border-color: var(--ax-border-default); -} - .navds-table__expandable-row--open .navds-table__toggle-expand-cell--open { border-color: transparent; } diff --git a/@navikt/core/css/table.css b/@navikt/core/css/table.css index e579cc91fe..5089904bb9 100644 --- a/@navikt/core/css/table.css +++ b/@navikt/core/css/table.css @@ -156,7 +156,7 @@ flex-shrink: 0; } -.navds-table__expandable-row:not(.navds-table__expandable-row--open) .navds-table__data-cell { +.navds-table__expandable-row:not(.navds-table__expandable-row--open) :where(.navds-table__data-cell, .navds-table__header-cell) { transition: border-bottom-color 190ms cubic-bezier(0.6, 0.04, 0.98, 0.335); } @@ -164,14 +164,10 @@ cursor: pointer; } -.navds-table__expandable-row--open .navds-table__data-cell { +.navds-table__expandable-row--open :where(.navds-table__data-cell, .navds-table__header-cell) { border-bottom-color: transparent; } -.navds-table__expandable-row--open .navds-table__header-cell { - border-color: var(--ac-table-row-border, var(--a-border-default)); -} - .navds-table__expandable-row--open .navds-table__toggle-expand-cell--open { border-color: transparent; } diff --git a/@navikt/core/react/src/table/stories/table-2-expandable.stories.tsx b/@navikt/core/react/src/table/stories/table-2-expandable.stories.tsx index 4dc895fbbf..280e785ea2 100644 --- a/@navikt/core/react/src/table/stories/table-2-expandable.stories.tsx +++ b/@navikt/core/react/src/table/stories/table-2-expandable.stories.tsx @@ -32,9 +32,13 @@ export const Expandable = () => { togglePlacement="right" defaultOpen > - {columns.map(({ key }) => ( - {row[key]} - ))} + {columns.map(({ key }, index) => + index === 0 ? ( + {row[key]} + ) : ( + {row[key]} + ), + )} ))} diff --git a/aksel.nav.no/website/pages/eksempler/table/expandable.tsx b/aksel.nav.no/website/pages/eksempler/table/expandable.tsx index fd701f2f54..cd7a31b287 100644 --- a/aksel.nav.no/website/pages/eksempler/table/expandable.tsx +++ b/aksel.nav.no/website/pages/eksempler/table/expandable.tsx @@ -19,7 +19,7 @@ const Example = () => { key={i + fnr} content="Innhold i ekspanderbar rad" > - {name} + {name} {fnr} {format(new Date(start))}