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

Tooltip: Make tooltip use secondary background color for legible links (#48748)

This commit is contained in:
Josh Hunt 2022-05-05 14:28:45 +01:00 committed by GitHub
parent 08bee1e682
commit af57804513
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 10 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/grafana-data/src/themes/createComponents.ts
View File

@ -75,8 +75,8 @@ export function createComponents(colors: ThemeColors, shadows: ThemeShadows): Th
background: input.background, background: input.background,
}, },
tooltip: { tooltip: {
background: colors.mode === 'light' ? '#555' : '#35383e', background: colors.background.secondary,
text: colors.mode === 'light' ? '#FFF' : colors.text.primary, text: colors.text.primary,
}, },
dashboard: { dashboard: {
background: colors.background.canvas, background: colors.background.canvas,

3
packages/grafana-ui/src/components/Tooltip/Tooltip.tsx
View File

@ -188,6 +188,9 @@ function getStyles(theme: GrafanaTheme2) {
a { a {
color: ${theme.colors.text.link}; color: ${theme.colors.text.link};
}
a:hover {
text-decoration: underline; text-decoration: underline;
} }
`; `;

4
public/sass/_variables.dark.generated.scss
View File

@ -291,9 +291,9 @@ $tooltipLinkColor: $link-color;
$tooltipExternalLinkColor: $external-link-color; $tooltipExternalLinkColor: $external-link-color;
$graph-tooltip-bg: $dark-1; $graph-tooltip-bg: $dark-1;
$tooltipBackground: #35383e; $tooltipBackground: #22252b;
$tooltipColor: rgb(204, 204, 220); $tooltipColor: rgb(204, 204, 220);
$tooltipArrowColor: #35383e; $tooltipArrowColor: #22252b;
$tooltipBackgroundError: #D10E5C; $tooltipBackgroundError: #D10E5C;
$tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.75); $tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.75);

6
public/sass/_variables.light.generated.scss
View File

@ -282,9 +282,9 @@ $alert-warning-bg: #FAD34A;
$alert-info-bg: #FAD34A; $alert-info-bg: #FAD34A;
// Tooltips and popovers // Tooltips and popovers
$tooltipBackground: #555; $tooltipBackground: #F4F5F5;
$tooltipColor: #FFF; $tooltipColor: rgba(36, 41, 46, 1);
$tooltipArrowColor: #555; $tooltipArrowColor: #F4F5F5;
$tooltipBackgroundError: #E0226E; $tooltipBackgroundError: #E0226E;
$tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.2); $tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.2);

8
public/sass/components/_panel_header.scss
View File

@ -161,14 +161,6 @@ $panel-header-no-title-zindex: 1;
} }
.panel-info-content { .panel-info-content {
a {
color: $gray-6;
&:hover {
color: darken($white, 10%);
}
}
code { code {
white-space: normal; white-space: normal;
word-wrap: break-word; word-wrap: break-word;