grafana/public/app/features/explore/NoData.tsx
Laura Benz d473fa3977
Design System: Set border radius to theme.shape.radius.default (#65511)
* refactor: replace by default token

* refactor: remove helper

* refactor: use pill token
2023-03-30 09:20:11 +02:00

36 lines
931 B
TypeScript

import { css } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2 } from '@grafana/data/src';
import { useStyles2, PanelContainer } from '@grafana/ui';
export const NoData = () => {
const css = useStyles2(getStyles);
return (
<>
<PanelContainer data-testid="explore-no-data" className={css.wrapper}>
<span className={css.message}>{'No data'}</span>
</PanelContainer>
</>
);
};
const getStyles = (theme: GrafanaTheme2) => ({
wrapper: css`
label: no-data-card;
padding: ${theme.spacing(3)};
background: ${theme.colors.background.primary};
border-radius: ${theme.shape.radius.default};
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-grow: 1;
`,
message: css`
font-size: ${theme.typography.h2.fontSize};
padding: ${theme.spacing(4)};
color: ${theme.colors.text.disabled};
`,
});