fix: add !important to shadcn aggrid styling (#4871)

* 📝 (App.css): add style for ag-cell class to remove internal calculated line height for better UI appearance

* 📝 (App.css): update CSS to remove internal calculated line height for specific elements in ag-grid cells

* Fix ag grid shadcn theme

---------

Co-authored-by: cristhianzl <cristhian.lousa@gmail.com>
This commit is contained in:
Lucas Oliveira 2024-11-26 13:59:01 -03:00 • committed by GitHub
commit fc5632af78
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -1,23 +1,23 @@
/* set the background color of many elements across the grid */ /* set the background color of many elements across the grid */
.ag-theme-shadcn { .ag-theme-shadcn {
--ag-foreground-color: hsl(var(--foreground)); --ag-foreground-color: hsl(var(--foreground)) !important;
--ag-background-color: hsl(var(--background)); --ag-background-color: hsl(var(--background)) !important;
--ag-secondary-foreground-color: hsl(var(--secondary-foreground)); --ag-secondary-foreground-color: hsl(var(--secondary-foreground)) !important;
--ag-data-color: hsl(var(--foreground)); --ag-data-color: hsl(var(--foreground)) !important;
--ag-header-foreground-color: hsl(var(--muted-foreground)); --ag-header-foreground-color: hsl(var(--muted-foreground)) !important;
--ag-header-background-color: hsl(var(--background)); --ag-header-background-color: hsl(var(--background)) !important;
--ag-tooltip-background-color: hsl(var(--muted)); --ag-tooltip-background-color: hsl(var(--muted)) !important;
--ag-disabled-foreground-color: hsl(var(--muted-foreground)); --ag-disabled-foreground-color: hsl(var(--muted-foreground)) !important;
--ag-border-color: hsl(var(--border)); --ag-border-color: hsl(var(--border)) !important;
--ag-selected-row-background-color: hsl(var(--accent)); --ag-selected-row-background-color: hsl(var(--accent)) !important;
--ag-menu-background-color: hsl(var(--accent)); --ag-menu-background-color: hsl(var(--accent)) !important;
--ag-panel-background-color: hsl(var(--accent)); --ag-panel-background-color: hsl(var(--accent)) !important;
--ag-row-hover-color: hsl(var(--primary-foreground)); --ag-row-hover-color: hsl(var(--primary-foreground)) !important;
--ag-header-height: 2.5rem; --ag-header-height: 2.5rem !important;
} }
.ag-theme-shadcn .ag-paging-panel { .ag-theme-shadcn .ag-paging-panel {
height: 3rem; height: 3rem !important;
} }
.ag-row .ag-cell { .ag-row .ag-cell {