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

View File

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

View File

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

View File

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

View File

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

View File

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