mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Tempo: Use grafana/ui divider (#82141)
* Use Grafana divider * Remove custom divider
This commit is contained in:
parent
55d17c7fcb
commit
4054590526
@ -3612,11 +3612,6 @@ exports[`better eslint`] = {
|
||||
"public/app/features/explore/TraceView/components/common/CopyIcon.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"]
|
||||
],
|
||||
"public/app/features/explore/TraceView/components/common/Divider.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "1"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "2"]
|
||||
],
|
||||
"public/app/features/explore/TraceView/components/common/LabeledList.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "1"],
|
||||
|
@ -21,12 +21,11 @@ import { DataFrame, dateTimeFormat, GrafanaTheme2, IconName, LinkModel } from '@
|
||||
import { TraceToProfilesOptions } from '@grafana/o11y-ds-frontend';
|
||||
import { config, locationService, reportInteraction } from '@grafana/runtime';
|
||||
import { TimeZone } from '@grafana/schema';
|
||||
import { DataLinkButton, Icon, TextArea, useStyles2 } from '@grafana/ui';
|
||||
import { DataLinkButton, Divider, Icon, TextArea, useStyles2 } from '@grafana/ui';
|
||||
import { RelatedProfilesTitle } from '@grafana-plugins/tempo/resultTransformer';
|
||||
|
||||
import { pyroscopeProfileIdTagKey } from '../../../createSpanLink';
|
||||
import { autoColor } from '../../Theme';
|
||||
import { Divider } from '../../common/Divider';
|
||||
import LabeledList from '../../common/LabeledList';
|
||||
import { KIND, LIBRARY_NAME, LIBRARY_VERSION, STATUS, STATUS_MESSAGE, TRACE_STATE } from '../../constants/span';
|
||||
import { SpanLinkFunc, TNil } from '../../types';
|
||||
@ -329,7 +328,7 @@ export default function SpanDetail(props: SpanDetailProps) {
|
||||
</div>
|
||||
<span style={{ marginRight: '10px' }}>{logLinkButton}</span>
|
||||
{profileLinkButton}
|
||||
<Divider type={'horizontal'} />
|
||||
<Divider spacing={1} />
|
||||
<div>
|
||||
<div>
|
||||
<AccordianKeyValues
|
||||
|
@ -1,56 +0,0 @@
|
||||
import { css, cx } from '@emotion/css';
|
||||
import React from 'react';
|
||||
|
||||
import { GrafanaTheme2 } from '@grafana/data';
|
||||
import { useStyles2 } from '@grafana/ui';
|
||||
|
||||
import { autoColor } from '../Theme';
|
||||
|
||||
const getStyles = (theme: GrafanaTheme2) => {
|
||||
return {
|
||||
Divider: css`
|
||||
background: ${autoColor(theme, '#ddd')};
|
||||
`,
|
||||
|
||||
DividerVertical: css`
|
||||
label: DividerVertical;
|
||||
display: inline-block;
|
||||
width: 1px;
|
||||
height: 0.9em;
|
||||
margin: 0 8px;
|
||||
vertical-align: middle;
|
||||
`,
|
||||
|
||||
DividerHorizontal: css`
|
||||
label: DividerHorizontal;
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
margin-top: ${theme.spacing(2)};
|
||||
margin-bottom: ${theme.spacing(0.5)};
|
||||
clear: both;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
top: -0.06em;
|
||||
`,
|
||||
};
|
||||
};
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
style?: React.CSSProperties;
|
||||
type?: 'vertical' | 'horizontal';
|
||||
}
|
||||
export function Divider({ className, style, type }: Props) {
|
||||
const styles = useStyles2(getStyles);
|
||||
return (
|
||||
<div
|
||||
style={style}
|
||||
className={cx(
|
||||
styles.Divider,
|
||||
type === 'horizontal' ? styles.DividerHorizontal : styles.DividerVertical,
|
||||
className
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
Loading…
Reference in New Issue
Block a user