diff --git a/src/components/Assets/AssetList/AssetEntry/styles.ts b/src/components/Assets/AssetList/AssetEntry/styles.ts
index 9c3c1b48d..93da7725d 100644
--- a/src/components/Assets/AssetList/AssetEntry/styles.ts
+++ b/src/components/Assets/AssetList/AssetEntry/styles.ts
@@ -20,15 +20,8 @@ export const Container = styled.div`
return "#9b9b9b";
}
}};
- background: ${({ theme }) => {
- switch (theme.mode) {
- case "light":
- return "#f1f5fa";
- case "dark":
- case "dark-jetbrains":
- return "#383838";
- }
- }};
+ background: ${({ theme }) => theme.colors.v3.surface.secondary};
+ border: 1px solid ${({ theme }) => theme.colors.v3.stroke.primary};
`;
export const Header = styled.div`
diff --git a/src/components/Assets/AssetList/AssetList.stories.tsx b/src/components/Assets/AssetList/AssetList.stories.tsx
index 9b1303009..6d5b3e1ea 100644
--- a/src/components/Assets/AssetList/AssetList.stories.tsx
+++ b/src/components/Assets/AssetList/AssetList.stories.tsx
@@ -1,5 +1,6 @@
import { Meta, StoryObj } from "@storybook/react";
+import { fn } from "@storybook/test";
import { AssetList } from ".";
import { ConfigContext, initialState } from "../../common/App/ConfigContext";
import { ConfigContextData, DeploymentType } from "../../common/App/types";
@@ -38,6 +39,7 @@ const mockedConfig: ConfigContextData = {
export const Default: Story = {
args: {
+ onAssetCountChange: fn(),
setRefresher: () => {
return undefined;
},
@@ -63,6 +65,7 @@ export const WithPerformanceImpact: Story = {
)
],
args: {
+ onAssetCountChange: fn(),
setRefresher: () => {
return undefined;
},
diff --git a/src/components/Assets/index.tsx b/src/components/Assets/index.tsx
index d935101f2..73e3a6e9c 100644
--- a/src/components/Assets/index.tsx
+++ b/src/components/Assets/index.tsx
@@ -10,6 +10,7 @@ import { useHistory } from "../Main/useHistory";
import { EmptyState } from "../common/EmptyState";
import { SearchInput } from "../common/SearchInput";
import { RefreshIcon } from "../common/icons/16px/RefreshIcon";
+import { NewIconButton } from "../common/v3/NewIconButton";
import { Tooltip } from "../common/v3/Tooltip";
import { AssetList } from "./AssetList";
import { AssetTypeList } from "./AssetTypeList";
@@ -160,8 +161,8 @@ export const Assets = () => {
/>
-
diff --git a/src/components/Assets/styles.ts b/src/components/Assets/styles.ts
index f3b78a9e0..f07f1241c 100644
--- a/src/components/Assets/styles.ts
+++ b/src/components/Assets/styles.ts
@@ -1,5 +1,4 @@
import styled from "styled-components";
-import { Button } from "../common/v3/Button";
export const Container = styled.div`
height: 100%;
@@ -105,14 +104,3 @@ export const UpgradeMessage = styled.div`
text-align: center;
gap: 8px;
`;
-
-export const RefreshButton = styled(Button)`
- color: ${({ theme }) => theme.colors.v3.icon.tertiary};
- border: 1px solid ${({ theme }) => theme.colors.v3.stroke.dark};
- background: ${({ theme }) => theme.colors.v3.surface.primary};
-
- &:hover:enabled {
- color: ${({ theme }) => theme.colors.v3.icon.white};
- background: none;
- }
-`;
diff --git a/src/components/Highlights/EmptyStateCard/styles.ts b/src/components/Highlights/EmptyStateCard/styles.ts
index 37013c574..56b2b6861 100644
--- a/src/components/Highlights/EmptyStateCard/styles.ts
+++ b/src/components/Highlights/EmptyStateCard/styles.ts
@@ -28,7 +28,7 @@ export const Card = styled(CommonCard)`
$blurredBackground
? css`
background: none;
- backdrop-filter: blur(4px);
+ backdrop-filter: blur(12px);
`
: ""};
`;
@@ -82,7 +82,7 @@ export const TextContainer = styled.div`
align-items: center;
justify-content: center;
gap: 2px;
- color: ${({ theme }) => theme.colors.v3.text.secondary};
+ color: ${({ theme }) => theme.colors.v3.text.tertiary};
`;
export const Title = styled.span`
diff --git a/src/components/Highlights/Impact/index.tsx b/src/components/Highlights/Impact/index.tsx
index 62a49f0cf..0b538c25b 100644
--- a/src/components/Highlights/Impact/index.tsx
+++ b/src/components/Highlights/Impact/index.tsx
@@ -8,8 +8,8 @@ import { SCOPE_CHANGE_EVENTS } from "../../Main/types";
import { InfinityIcon } from "../../common/icons/16px/InfinityIcon";
import { RefreshIcon } from "../../common/icons/16px/RefreshIcon";
import { TargetIcon } from "../../common/icons/16px/TargetIcon";
-import { Button } from "../../common/v3/Button";
import { Card } from "../../common/v3/Card";
+import { NewButton } from "../../common/v3/NewButton";
import { Tag } from "../../common/v3/Tag";
import { EmptyStateCard } from "../EmptyStateCard";
import { EnvironmentName } from "../common/EnvironmentName";
@@ -176,7 +176,7 @@ export const Impact = () => {
text={"Connect a CI environment to measure performance impact"}
blurredContent={renderImpactCard(demoData)}
customContent={
-