root
/
grafana
mirror of https://github.com/grafana/grafana.git
1
0
Fork 0
Code Issues Actions 194 Packages Projects Releases Wiki Activity

ToolbarSwitch: Fixes internal border radius and other issues (#111432)

This commit is contained in:
Torkel Ödegaard 2025-09-23 14:05:12 +02:00 committed by GitHub
parent 969eeb1d02
commit dafedf84ce
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
public/app/features/dashboard-scene/scene/new-toolbar/actions/ToolbarSwitch.tsx
View File

@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
import { MouseEvent } from 'react';
import { GrafanaTheme2, IconName } from '@grafana/data';
import { Icon, Tooltip, useStyles2 } from '@grafana/ui';
import { Icon, styleMixins, Tooltip, useStyles2 } from '@grafana/ui';
interface Props {
icon: IconName;
@ -91,28 +91,18 @@ const getStyles = (theme: GrafanaTheme2) => ({
alignItems: 'center',
justifyContent: 'center',
width: theme.spacing(2.5),
height: theme.spacing(2.5),
borderRadius: theme.shape.radius.default,
height: '100%',
transform: 'translateX(0)',
position: 'relative',
borderRadius: styleMixins.getInternalRadius(theme, 2),
border: `1px solid ${theme.colors.secondary.border}`,
[theme.transitions.handleMotion('no-preference', 'reduce')]: {
transition: 'all 0.2s ease-in-out',
},
'&:after': css({
content: "''",
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
borderRadius: theme.shape.radius.default,
background: theme.colors.secondary.main,
border: `1px solid ${theme.colors.secondary.border}`,
}),
}),
boxChecked: css({
transform: `translateX(calc(100% - ${theme.spacing(0.25)}))`,
borderColor: 'transparent',
}),
});