Table footer component has inverted colors for light and dark themes

stefa168 commented 1 month ago

Describe the bug

I have recently encountered an issue where the Table Footer sub-component renders with the background color inverted. This means that if I were to use the light mode, then it would have appeared with the dark background and vice-versa.

I have solved the issue myself by modifying the classes used by the sub-component, and I'm opening this issue to ask for permission to send a PR (as indicated in CONTRIBUTING.md).

Reproduction

To reproduce the issue, just create a simple table, including a footer.

Here's a minimal reproduction: https://stackblitz.com/edit/github-xeufjn?file=src%2Froutes%2F%2Bpage.svelte

Logs

No response

System Info

System:
    OS: Linux 6.8 Linux Mint 22 (Wilma)
    CPU: (16) x64 AMD Ryzen 7 5800X 8-Core Processor
    Memory: 51.19 GB / 62.70 GB
    Container: Yes
    Shell: 3.7.1 - /usr/bin/fish
  Binaries:
    Node: 22.8.0 - ~/.local/share/nvm/v22.8.0/bin/node
    npm: 10.8.3 - ~/.local/share/nvm/v22.8.0/bin/npm
  Browsers:
    Chromium: 129.0.6668.100
  npmPackages:
    @sveltejs/kit: ^2.6.3 => 2.7.0 
    bits-ui: ^0.21.16 => 0.21.16 
    formsnap: ^1.0.1 => 1.0.1 
    lucide-svelte: ^0.439.0 => 0.439.0 
    mode-watcher: ^0.4.1 => 0.4.1 
    svelte: ^5.0.0-next.262 => 5.0.0-next.262 
    svelte-radix: ^1.1.1 => 1.1.1 
    svelte-sonner: ^0.3.28 => 0.3.28 
    sveltekit-superforms: ^2.19.0 => 2.19.1

Severity

annoyance

huntabyte commented 1 month ago

Go for it!

jaysin586 commented 1 month ago

The issue stems from the wrong classes being applied to the tfoot ex: https://github.com/huntabyte/shadcn-svelte/blob/b524be50b4d7cfc97e6ed2206351de5067285518/sites/docs/src/lib/registry/new-york/ui/table/table-footer.svelte#L11

differs from the main: https://github.com/shadcn-ui/ui/blob/d0eece06d443be54f8a55c31a3c0bc3715fc30d4/apps/www/registry/default/ui/table.tsx#L46

huntabyte / shadcn-svelte