Fix icon size for data source picker list item (#67144)

This commit is contained in:
Ivan Ortega Alba 2023-04-25 10:41:31 +02:00 committed by GitHub
parent 7dbcd5ecd0
commit 4d474e8e4f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -17,13 +17,13 @@ export function DataSourceCard({ ds, onClick, selected }: DataSourceCardProps) {
<Card key={ds.uid} onClick={onClick} className={cx(styles.card, selected ? styles.selected : undefined)}>
<Card.Heading className={styles.heading}>
<div className={styles.headingContent}>
<span className={styles.dsName}>{ds.name}</span>
<span className={styles.headingSeparator}>|</span>
<small className={styles.dsType}>{ds.meta.name}</small>
<span className={styles.name}>{ds.name}</span>
<span className={styles.separator}>|</span>
<small className={styles.type}>{ds.meta.name}</small>
</div>
</Card.Heading>
<Card.Figure>
<img src={ds.meta.info.logos.small} alt={`${ds.meta.name} Logo`} height="32" width="32" />
<Card.Figure className={styles.logo}>
<img src={ds.meta.info.logos.small} alt={`${ds.meta.name} Logo`} />
</Card.Figure>
<Card.Tags>{ds.isDefault ? <TagList tags={['default']} /> : null}</Card.Tags>
</Card>
@ -57,15 +57,19 @@ function getStyles(theme: GrafanaTheme2) {
text-overflow: ellipsis;
white-space: nowrap;
`,
dsName: css`
logo: css`
width: 32px;
height: 32px;
`,
name: css`
color: ${theme.colors.text.primary};
`,
dsType: css`
type: css`
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
`,
headingSeparator: css`
separator: css`
margin: 0 ${theme.spacing(1)};
color: ${theme.colors.border.weak};
`,