diff --git a/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap b/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap index a662a9db228..eb61c639d81 100644 --- a/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap +++ b/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap @@ -74,7 +74,6 @@ exports[`Render should render with base threshold 1`] = ` Object { "background": Object { "dropdown": "#1f1f20", - "logsFresh": "#5794F240", "scrollbar": "#343436", "scrollbar2": "#343436", }, @@ -236,7 +235,6 @@ exports[`Render should render with base threshold 1`] = ` Object { "background": Object { "dropdown": "#1f1f20", - "logsFresh": "#5794F240", "scrollbar": "#343436", "scrollbar2": "#343436", }, diff --git a/packages/grafana-ui/src/themes/dark.ts b/packages/grafana-ui/src/themes/dark.ts index 5e83e2dd29a..9bbe3aef04e 100644 --- a/packages/grafana-ui/src/themes/dark.ts +++ b/packages/grafana-ui/src/themes/dark.ts @@ -75,7 +75,6 @@ const darkTheme: GrafanaTheme = { dropdown: basicColors.dark3, scrollbar: basicColors.dark9, scrollbar2: basicColors.dark9, - logsFresh: '#5794F240', }, }; diff --git a/packages/grafana-ui/src/themes/light.ts b/packages/grafana-ui/src/themes/light.ts index 634462613d3..e87bf744f95 100644 --- a/packages/grafana-ui/src/themes/light.ts +++ b/packages/grafana-ui/src/themes/light.ts @@ -76,7 +76,6 @@ const lightTheme: GrafanaTheme = { dropdown: basicColors.white, scrollbar: basicColors.gray5, scrollbar2: basicColors.gray5, - logsFresh: '#d8e7ff', }, }; diff --git a/packages/grafana-ui/src/types/theme.ts b/packages/grafana-ui/src/types/theme.ts index fd08aaa0a90..23857cc9c34 100644 --- a/packages/grafana-ui/src/types/theme.ts +++ b/packages/grafana-ui/src/types/theme.ts @@ -96,7 +96,6 @@ export interface GrafanaTheme extends GrafanaThemeCommons { dropdown: string; scrollbar: string; scrollbar2: string; - logsFresh: string; }; colors: { black: string; diff --git a/public/app/features/explore/LiveLogs.tsx b/public/app/features/explore/LiveLogs.tsx index 5565f9dc4d3..c80e813fabb 100644 --- a/public/app/features/explore/LiveLogs.tsx +++ b/public/app/features/explore/LiveLogs.tsx @@ -1,8 +1,9 @@ import React, { PureComponent } from 'react'; import { css, cx } from 'emotion'; +import tinycolor from 'tinycolor2'; import { last } from 'lodash'; -import { Themeable, withTheme, GrafanaTheme, selectThemeVariant, getLogRowStyles } from '@grafana/ui'; +import { Themeable, withTheme, GrafanaTheme, getLogRowStyles } from '@grafana/ui'; import { LogsModel, LogRowModel, TimeZone } from '@grafana/data'; import ElapsedTime from './ElapsedTime'; @@ -23,17 +24,15 @@ const getStyles = (theme: GrafanaTheme) => ({ logsRowFresh: css` label: logs-row-fresh; color: ${theme.colors.text}; - background-color: ${selectThemeVariant( - { light: theme.background.logsFresh, dark: theme.background.logsFresh }, - theme.type - )}; + background-color: ${tinycolor(theme.colors.blueLight) + .setAlpha(0.25) + .toString()}; animation: fade 1s ease-out 1s 1 normal forwards; @keyframes fade { from { - background-color: ${selectThemeVariant( - { light: theme.background.logsFresh, dark: theme.background.logsFresh }, - theme.type - )}; + background-color: ${tinycolor(theme.colors.blueLight) + .setAlpha(0.25) + .toString()}; } to { background-color: transparent;