fix: top endpoints table overflow

This commit is contained in:
Pranshu Chittora 2022-03-23 11:44:37 +05:30
parent 4f3bb95a77
commit f22d5f0fbd
No known key found for this signature in database
GPG Key ID: 3A9E57A016CC0626
2 changed files with 8 additions and 3 deletions

View File

@ -15,7 +15,7 @@ import MetricReducer from 'types/reducer/metrics';
import { Card, Col, GraphContainer, GraphTitle, Row } from '../styles';
import TopEndpointsTable from '../TopEndpointsTable';
import { Button } from './styles';
import { Button, TableContainerCard } from './styles';
function Application({ getWidget }: DashboardProps): JSX.Element {
const { servicename } = useParams<{ servicename?: string }>();
@ -232,9 +232,9 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
</Col>
<Col span={12}>
<Card>
<TableContainerCard>
<TopEndpointsTable data={topEndPoints} />
</Card>
</TableContainerCard>
</Col>
</Row>
</>

View File

@ -1,6 +1,8 @@
import { Button as ButtonComponent } from 'antd';
import styled from 'styled-components';
import { Card } from '../styles';
export const Button = styled(ButtonComponent)`
&&& {
position: absolute;
@ -8,3 +10,6 @@ export const Button = styled(ButtonComponent)`
display: none;
}
`;
export const TableContainerCard = styled(Card)`
overflow-x: scroll;
`;