Skip to content

Bug: Mismatch in border colors in responsive stacked table  #2648

Description

@natalia-fitzgerald

Describe the bug
There is a mismatch between the border colors in the table body and table row.

  • The tbody has a border that is set to "inherited"
  • tbody tr uses the var (–table-border).

To Reproduce
Steps to reproduce the behavior:

  1. Go to '(https://cfpb.github.io/design-system/components/tables#responsive-stacked-table)'
  2. Compare the gray border color above the table and between table rows.
  3. See that the gray border colors do not match.

Expected behavior
Color of border above the table and between rows should match and should use var (–table-border).

Screenshots

CFPB Design System (Mobile) tbody tr tbody
Image Image Image

Additional context
We are using the DSR table component in Complaint Explorer so we need to fix the DS component in order to bring the fix into the DSR and then the CE app.

Link to DSR table component: https://cfpb.github.io/design-system-react/?path=/docs/components-verified-tables--overview

@anselmbradford @flacoman91

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Fields

    No fields configured for Bug.

    Projects

    Status
    No status

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions