ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-26 17:23:15 -05:00
Code Issues Packages Projects Releases Wiki Activity

Welcome page reskin (#9491)

Browse Source 
* adds icons for welcome page

* updates markup and styles for welcome page

* updates color registry with welcome page colors

* updates styles for welcome page

* updates markup for welcome page

* updates theming styles for welcome page and adds date since last opened functionality on history items

* adds all icons and images for welcome page

* updates markup for welcome page

* updates styles for welcome page

* updates color registry with welcome page styles

* updates welcome page icons with microsoft flag and dark theme home banner

* updates welcome page markup

* updates dynamically generated extension list

* updates styles for welcome page

* updates markup for welcome page

* adds dynamic lists for extension pack individual extensions

* updates icons for welcome page

* updates styles for welcome page

* updates welcome page styles

* updates theme colors

* updates markup for welcome page

* updates color registry with welcomepage colors

* updates sql.de.xlf with copy for welcome page

* reverts generated file

* updates welcome page styles

* updates extension pack copy casing

* updates color registry with welcome page styles

* updates welcome page markup

* adds welcome page icons

* updates welcome page markup

* updates welcome page icons

* updates welcome page styles

* reverts color registry in vs folder to original state

* moves color registry to sql folder

* removes dead code, localizes dates

* updates welcome page styles

* moves all colors from css to color registry

* updates styles by removing all colors

* removes stat import because of laying issue, adds color registry colors to welcomePage

* updates welcome page font sizes to ems

* updates localized strings

* removes unnecessary comment

* removes double quotes around string key for single quotes

* updates welcome page styles

* updates color registry

* updates welcome page markup

* adds dropdown button functionality

* adds centering classes for installed button text

* updates welcome page styles

* updates markup and styles for welcome page

* removes icon attempt from color registry

* removes theme specific icon svgs for theme specific icon css

* removes unused import

* removes console.log

* adds back mac new file button

* removes unused rules

* updates markup

* updates markup

* updates extension links to link to extensions in ADS

* pulls in changes from welcome-page-reskin-anthonydresser

* adds back code-icon to vs folder

* reverts welcomePage.css

* removes duplicate color registry variables

* fixes icon overlap on text for mac

* removes null import

* updates welcome page styles for mac

* updates welcome page images to use sql folder

* updates welcome page markup

* updates welcome page styles

* updates styles

* updates files paths

* delete images from sql folder

* updates icons

* updates welcome page styles

* updates preview popup

* updates markup for accessibility

* adds hover state to tiles

* updates dropdown

* fixes line-height issue

* updates class names

* updates keyboard accessibility for tooltip

* format document

* updates accessibility for preview tooltip

* removes whitespace

* updates preview modal accessibility

* adds aria labels to popup and tooltip

* removes max-width for zoom

* removes escaped strings, adds keycodes to promises, marks function as async and has the return as the signature of the function

* moves keycoes to class, removes comment

* fixes promise

* testing promise

* testing promise

* promise test

* localizes copy

* uses keycode import

* removes unnecessary arguments

* formating

* refactor constructor into async function called by constructor

* attempts to fix floating promise

* removes floating promise

* moves icons and images to sql folder, removes unused icons

* uses icons already existing in ads

* updates styles

* updates color registry

* updates keycode events

* fixes issues per charles comments

* moves icons to media folder

* updates image file paths

* updates file path

* adds href to extension pack extensions

* fixes links

* fixes issues per alan's comments

* uses exisiting colors from color registry

* updates welcome page to use existing colors from color registry

* updates dark theme

* updates color registry

* updates dark theme

* formats css

* fixes dropdown arrow icon on mac

Co-authored-by: Anthony Dresser <andresse@microsoft.com>
This commit is contained in:
v-bbrady
2020-04-03 09:24:20 -07:00
committed by GitHub
parent 87b892d13f
commit 177a58c81d
30 changed files with 3440 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/sql/platform/theme/common/colorRegistry.ts Normal file
View File

@@ -0,0 +1,44 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import { registerColor } from 'vs/platform/theme/common/colorRegistry';
import { Color, RGBA } from 'vs/base/common/color';
import * as nls from 'vs/nls';
// -- Welcome Page Colors
export const tileBoxShadowColor = new Color(new RGBA(0, 1, 4, 0.13));
export const textShadow = new Color(new RGBA(0, 0, 0, 0.25));
export const dropdownBoxShadow = new Color(new RGBA(0, 0, 0, 0.25));
export const extensionPackGradientOne = new Color(new RGBA(50, 49, 48, 0.55));
export const extensionPackGradientTwo = new Color(new RGBA(50, 49, 48, 0));
export const gradientOneColorOne = new Color(new RGBA(0, 0, 0, .2));
export const gradientTwoColorOne = new Color(new RGBA(156, 48, 48, 0));
export const gradientTwoColorTwo = new Color(new RGBA(255, 255, 255, 0.1));
// -- Tiles
export const tileBorder = registerColor('tileBorder', { light: '#fff', dark: '#8A8886', hc: '#2B56F2' }, nls.localize('tileBorder', "The border color of tiles"));
export const tileBoxShadow = registerColor('tileBoxShadow', { light: tileBoxShadowColor, dark: tileBoxShadowColor, hc: tileBoxShadowColor }, nls.localize('tileBoxShadow', "The tile box shadow color"));
// -- Buttons
export const buttonSecondaryBorder = registerColor('button.secondaryBorder', { light: '#8A8886', dark: '#FFF', hc: '#264BD3' }, nls.localize('button.secondaryBorder', "The border color for secondary button"));
export const buttonSecondaryBackground = registerColor('button.secondaryBackground', { light: null, dark: null, hc: null }, nls.localize('button.secondaryBackground', "The background color for the secondary button"));
export const buttonSecondary = registerColor('button.secondaryForeground', { light: '#323130', dark: '#fff', hc: '#fff' }, nls.localize('button.secondaryForeground', "The font color for secondary button"));
export const buttonSecondaryHoverColor = registerColor('button.secondaryHoverForeground', { light: '#0078D4', dark: '#3794ff', hc: '#3794ff' }, nls.localize('button.secondaryHoverForeground', "The hover color for secondary buttons"));
export const buttonDropdownBackgroundHover = registerColor('buttonDropdownBackgroundHover', { light: '#3062d6', dark: '#3062d6', hc: '#3062d6' }, nls.localize('buttonDropdownBackgroundHover', "The button dropdown background hover color"));
export const disabledButton = registerColor('button.disabledForeground', { light: '#A19F9D', dark: '#797775', hc: '#797775' }, nls.localize('button.disabledForeground', "The color for a secondary disabled button"));
export const disabledButtonBackground = registerColor('button.disabledBackground', { light: '#F3F2F1', dark: '#252423', hc: '#252423' }, nls.localize('button.disabledBackground', "The background color for secondary disabled button"));
// -- Shadows
export const hoverShadow = registerColor('buttonDropdownBoxShadow', { light: dropdownBoxShadow, dark: dropdownBoxShadow, hc: dropdownBoxShadow }, nls.localize('buttonDropdownBoxShadow', "The button dropdown box shadow color"));
export const extensionPackHeaderShadow = registerColor('extensionPackHeaderShadow', { light: textShadow, dark: textShadow, hc: textShadow }, nls.localize('extensionPackHeaderShadow', "The extension pack header text shadowcolor"));
// -- Gradients
export const extensionPackGradientColorOneColor = registerColor('extensionPackGradientColorOne', { light: extensionPackGradientOne, dark: extensionPackGradientOne, hc: extensionPackGradientOne }, nls.localize('extensionPackGradientColorOne', "The top color for the extension pack gradient"));
export const extensionPackGradientColorTwoColor = registerColor('extensionPackGradientColorTwo', { light: extensionPackGradientTwo, dark: extensionPackGradientTwo, hc: extensionPackGradientTwo }, nls.localize('extensionPackGradientColorTwo', "The bottom color for the extension pack gradient"));
export const gradientOne = registerColor('gradientOne', { light: '#f0f0f0', dark: gradientOneColorOne, hc: gradientOneColorOne }, nls.localize('gradientOne', "The top color for the banner image gradient"));
export const gradientTwo = registerColor('gradientTwo', { light: gradientTwoColorOne, dark: gradientTwoColorTwo, hc: gradientTwoColorTwo }, nls.localize('gradientTwo', "The bottom color for the banner image gradient"));
export const gradientBackground = registerColor('gradientBackground', { light: '#fff', dark: 'transparent', hc: 'transparent' }, nls.localize('gradientBackground', "The background color for the banner image gradient"));