diff --git a/packages/redux-devtools-inspector-monitor/src/ActionListRow.tsx b/packages/redux-devtools-inspector-monitor/src/ActionListRow.tsx
index 335b9cb9..53536617 100644
--- a/packages/redux-devtools-inspector-monitor/src/ActionListRow.tsx
+++ b/packages/redux-devtools-inspector-monitor/src/ActionListRow.tsx
@@ -9,6 +9,8 @@ import {
actionListFromFutureCss,
actionListItemButtonsCss,
actionListItemCss,
+ actionListItemNameCss,
+ actionListItemNameSkippedCss,
actionListItemSelectedCss,
actionListItemSelectorCss,
actionListItemSkippedCss,
@@ -91,10 +93,10 @@ export default class ActionListRow<
]}
>
{actionType}
diff --git a/packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts b/packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts
index 12f2b9eb..1c563f22 100644
--- a/packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts
+++ b/packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts
@@ -148,18 +148,18 @@ export const actionListItemTimeCss: Interpolation = (theme) => ({
export const actionListItemSelectorCss = css({ display: 'inline-flex' });
+export const actionListItemNameCss = css({
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ lineHeight: '20px',
+});
+
+export const actionListItemNameSkippedCss = css({
+ textDecoration: 'line-through',
+ opacity: 0.3,
+});
+
const getSheetFromColorMap = (map: ColorMap) => ({
- actionListItemName: {
- overflow: 'hidden',
- 'text-overflow': 'ellipsis',
- 'line-height': '20px',
- },
-
- actionListItemNameSkipped: {
- 'text-decoration': 'line-through',
- opacity: 0.3,
- },
-
actionListHeaderSearch: {
outline: 'none',
border: 'none',