From d348095890005273faecfdf8325727490715ea90 Mon Sep 17 00:00:00 2001
From: Andre Wanlin <awanlin@rapidrtc.com>
Date: Mon, 28 Mar 2022 12:44:56 -0500
Subject: [PATCH] Changes based on feedback

Signed-off-by: Andre Wanlin <awanlin@rapidrtc.com>
---
 .changeset/serious-houses-watch.md            | 28 ++-----------------
 .../src/layout/ItemCard/ItemCardHeader.tsx    |  2 +-
 packages/theme/src/pageTheme.ts               |  2 ++
 packages/theme/src/themes.ts                  |  8 ++++++
 packages/theme/src/types.ts                   |  7 +++++
 5 files changed, 20 insertions(+), 27 deletions(-)

diff --git a/.changeset/serious-houses-watch.md b/.changeset/serious-houses-watch.md
index 4da1466c1f..07c4e9eaf6 100644
--- a/.changeset/serious-houses-watch.md
+++ b/.changeset/serious-houses-watch.md
@@ -1,29 +1,5 @@
 ---
-'@backstage/theme': minor
+'@backstage/theme': patch
 ---
 
-**BREAKING**: Removed the following unused properties from BackstagePaletteAdditions under the `bursts` property:
-
-```ts
-slackChannelText: string;
-backgroundColor: {
-    default: string;
-};
-```
-
-If these were being used you can add them back to your custom theme, for example like this:
-
-```diff
- bursts: {
-     fontColor: '#FEFEFE',
-+    slackChannelText: '#ddd',
-+    backgroundColor: {
-+       default: '#7C3699',
-+    },
-     gradient: {
-        linear: 'linear-gradient(-137deg, #4BB8A5 0%, #187656 100%)',
-     },
-},
-```
-
-The [Customize the look-and-feel of your App](https://backstage.io/docs/getting-started/app-custom-theme) documentation has more details on creating and using a custom theme.
+**DEPRECIATED**: The `bursts` object from BackstagePaletteAdditions has been depreciated and will be removed in a future release
diff --git a/packages/core-components/src/layout/ItemCard/ItemCardHeader.tsx b/packages/core-components/src/layout/ItemCard/ItemCardHeader.tsx
index a34d773ce3..d9443ffc9a 100644
--- a/packages/core-components/src/layout/ItemCard/ItemCardHeader.tsx
+++ b/packages/core-components/src/layout/ItemCard/ItemCardHeader.tsx
@@ -27,7 +27,7 @@ const styles = (theme: BackstageTheme) =>
     root: {
       color: theme.palette.common.white,
       padding: theme.spacing(2, 2, 3),
-      backgroundImage: theme.palette.bursts.gradient.linear,
+      backgroundImage: theme.getPageTheme({ themeId: 'card' }).backgroundImage,
       backgroundPosition: 0,
       backgroundSize: 'inherit',
     },
diff --git a/packages/theme/src/pageTheme.ts b/packages/theme/src/pageTheme.ts
index ae81dc8534..1a5ea75394 100644
--- a/packages/theme/src/pageTheme.ts
+++ b/packages/theme/src/pageTheme.ts
@@ -52,6 +52,7 @@ export const colorVariants: Record<string, string[]> = {
   eveningSea: ['#00FFF2', '#035355'],
   teal: ['#005B4B'],
   pinkSea: ['#C8077A', '#C2297D'],
+  greens: ['#4BB8A5', '#187656'],
 };
 
 /**
@@ -86,4 +87,5 @@ export const pageTheme: Record<string, PageTheme> = {
   other: genPageTheme(colorVariants.darkGrey, shapes.wave),
   app: genPageTheme(colorVariants.toastyOrange, shapes.wave),
   apis: genPageTheme(colorVariants.teal, shapes.wave2),
+  card: genPageTheme(colorVariants.greens, shapes.wave),
 };
diff --git a/packages/theme/src/themes.ts b/packages/theme/src/themes.ts
index e5551f7796..b048c70fec 100644
--- a/packages/theme/src/themes.ts
+++ b/packages/theme/src/themes.ts
@@ -39,6 +39,10 @@ export const lightTheme = createTheme({
     },
     bursts: {
       fontColor: '#FEFEFE',
+      slackChannelText: '#ddd',
+      backgroundColor: {
+        default: '#7C3699',
+      },
       gradient: {
         linear: 'linear-gradient(-137deg, #4BB8A5 0%, #187656 100%)',
       },
@@ -112,6 +116,10 @@ export const darkTheme = createTheme({
     },
     bursts: {
       fontColor: '#FEFEFE',
+      slackChannelText: '#ddd',
+      backgroundColor: {
+        default: '#7C3699',
+      },
       gradient: {
         linear: 'linear-gradient(-137deg, #4BB8A5 0%, #187656 100%)',
       },
diff --git a/packages/theme/src/types.ts b/packages/theme/src/types.ts
index ec71e6d090..566bffb2e4 100644
--- a/packages/theme/src/types.ts
+++ b/packages/theme/src/types.ts
@@ -63,8 +63,15 @@ export type BackstagePaletteAdditions = {
   tabbar: {
     indicator: string;
   };
+  /**
+   * @deprecated The entire `bursts` section will be removed in a future release
+   */
   bursts: {
     fontColor: string;
+    slackChannelText: string;
+    backgroundColor: {
+      default: string;
+    };
     gradient: {
       linear: string;
     };