From 9f09f7be5d42500d4bdf4d3508078f9fd104b3f1 Mon Sep 17 00:00:00 2001 From: goyal-anjali <66509246+goyal-anjali@users.noreply.github.com> Date: Fri, 3 Sep 2021 22:56:16 +0530 Subject: [PATCH] Update watermark and add styling for SQL Migration Dashboard (#16916) *Update watermark, backgroung css and add gradient *Remove unused images --- .../sql-migration/images/background.svg | 24 -------------- .../images/dashboardWatermark.svg | 32 +++++++++++++++++++ .../src/constants/iconPathHelper.ts | 4 +-- .../src/dashboard/sqlServerDashboard.ts | 10 +++--- 4 files changed, 40 insertions(+), 30 deletions(-) delete mode 100644 extensions/sql-migration/images/background.svg create mode 100644 extensions/sql-migration/images/dashboardWatermark.svg 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%' } });