diff --git a/extensions/sql-migration/images/background.svg b/extensions/sql-migration/images/background.svg
deleted file mode 100644
index 02c9c49d34..0000000000
--- a/extensions/sql-migration/images/background.svg
+++ /dev/null
@@ -1,24 +0,0 @@
-
diff --git a/extensions/sql-migration/images/dashboardWatermark.svg b/extensions/sql-migration/images/dashboardWatermark.svg
new file mode 100644
index 0000000000..574c110000
--- /dev/null
+++ b/extensions/sql-migration/images/dashboardWatermark.svg
@@ -0,0 +1,32 @@
+
diff --git a/extensions/sql-migration/src/constants/iconPathHelper.ts b/extensions/sql-migration/src/constants/iconPathHelper.ts
index 50d1348c10..b9723f6154 100644
--- a/extensions/sql-migration/src/constants/iconPathHelper.ts
+++ b/extensions/sql-migration/src/constants/iconPathHelper.ts
@@ -62,8 +62,8 @@ export class IconPathHelper {
dark: context.asAbsolutePath('images/sqlVmVideoThumbnail.svg')
};
IconPathHelper.migrationDashboardHeaderBackground = {
- light: context.asAbsolutePath('images/background.svg'),
- dark: context.asAbsolutePath('images/background.svg')
+ light: context.asAbsolutePath('images/dashboardWatermark.svg'),
+ dark: context.asAbsolutePath('images/dashboardWatermark.svg')
};
IconPathHelper.sqlMigrationLogo = {
light: context.asAbsolutePath('images/migration.svg'),
diff --git a/extensions/sql-migration/src/dashboard/sqlServerDashboard.ts b/extensions/sql-migration/src/dashboard/sqlServerDashboard.ts
index 86c8d49971..65f1a96f30 100644
--- a/extensions/sql-migration/src/dashboard/sqlServerDashboard.ts
+++ b/extensions/sql-migration/src/dashboard/sqlServerDashboard.ts
@@ -77,10 +77,12 @@ export class DashboardWidget {
const header = this.createHeader(view);
container.addItem(header, {
CSSStyles: {
- 'background-image': `url(${vscode.Uri.file(IconPathHelper.migrationDashboardHeaderBackground.light)})`,
- 'width': '870px',
- 'height': '260px',
- 'background-size': '100%',
+ 'background-image': `
+ url(${vscode.Uri.file(IconPathHelper.migrationDashboardHeaderBackground.light)}),
+ linear-gradient(0deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%)
+ `,
+ 'background-repeat': 'no-repeat',
+ 'background-position': '91.06% 100%'
}
});