IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-12-28 18:01:40 -06:00
Code Issues Packages Projects Releases Wiki Activity

TablePanel: Fix FooterRow styling for Safari and Firefox (#55543)

Browse Source 
* Fix FooterRow styling for Safari and Firefox

* Change column header th to div
This commit is contained in:
Victor Marin 2022-09-22 09:33:15 +03:00 committed by GitHub
parent 06b38133a9
commit da78f33939
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/grafana-ui/src/components/Table/FooterRow.tsx
View File

@ -23,7 +23,7 @@ export const FooterRow = (props: FooterRowProps) => {
const tableStyles = useStyles2(getTableStyles);
return (
<table
<div
style={{
position: isPaginationVisible ? 'relative' : 'absolute',
width: totalColumnsWidth ? `${totalColumnsWidth}px` : '100%',
@ -33,22 +33,20 @@ export const FooterRow = (props: FooterRowProps) => {
{footerGroups.map((footerGroup: HeaderGroup) => {
const { key, ...footerGroupProps } = footerGroup.getFooterGroupProps();
return (
<tfoot
<div
className={tableStyles.tfoot}
{...footerGroupProps}
key={key}
data-testid={e2eSelectorsTable.footer}
style={height ? { height: `${height}px` } : undefined}
>
<tr>
{footerGroup.headers.map((column: ColumnInstance, index: number) =>
renderFooterCell(column, tableStyles, height)
)}
</tr>
</tfoot>
{footerGroup.headers.map((column: ColumnInstance, index: number) =>
renderFooterCell(column, tableStyles, height)
)}
</div>
);
})}
</table>
</div>
);
};
@ -67,9 +65,9 @@ function renderFooterCell(column: ColumnInstance, tableStyles: TableStyles, heig
}
return (
<th className={tableStyles.headerCell} {...footerProps}>
<div className={tableStyles.headerCell} {...footerProps}>
{column.render('Footer')}
</th>
</div>
);
}