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

accessible radio card (#8514)

Browse Source 
* accessible radio card group

* set radio card group width

* address comments

* address comments 2

* fix the profile card not being focused issue
This commit is contained in:
Alan Ren
2019-12-03 13:26:00 -08:00
committed by GitHub
parent 82c60a23c0
commit b38b53b658
11 changed files with 517 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/sql/workbench/browser/modelComponents/componentWithIconBase.ts
View File

@@ -4,23 +4,17 @@
*--------------------------------------------------------------------------------------------*/
import { ChangeDetectorRef, ElementRef } from '@angular/core';
import { IComponentDescriptor } from 'sql/workbench/browser/modelComponents/interfaces';
import * as azdata from 'azdata';
import { URI } from 'vs/base/common/uri';
import { IdGenerator } from 'vs/base/common/idGenerator';
import { createCSSRule, removeCSSRulesContainingSelector, asCSSUrl } from 'vs/base/browser/dom';
import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase';
export type IUserFriendlyIcon = string | URI | { light: string | URI; dark: string | URI };
import { createIconCssClass, IUserFriendlyIcon } from 'sql/workbench/browser/modelComponents/iconUtils';
import { IComponentDescriptor } from 'sql/workbench/browser/modelComponents/interfaces';
import { removeCSSRulesContainingSelector } from 'vs/base/browser/dom';
import { URI } from 'vs/base/common/uri';
export class ItemDescriptor<T> {
constructor(public descriptor: IComponentDescriptor, public config: T) { }
}
const ids = new IdGenerator('model-view-component-icon-');
export abstract class ComponentWithIconBase extends ComponentBase {
protected _iconClass: string;
@@ -40,42 +34,11 @@ export abstract class ComponentWithIconBase extends ComponentBase {
protected updateIcon() {
if (this.iconPath && this.iconPath !== this._iconPath) {
this._iconPath = this.iconPath;
if (!this._iconClass) {
this._iconClass = ids.nextId();
}
removeCSSRulesContainingSelector(this._iconClass);
const icon = this.getLightIconUri(this.iconPath);
const iconDark = this.getDarkIconUri(this.iconPath) || icon;
createCSSRule(`.icon.${this._iconClass}`, `background-image: ${asCSSUrl(icon)}`);
createCSSRule(`.vs-dark .icon.${this._iconClass}, .hc-black .icon.${this._iconClass}`, `background-image: ${asCSSUrl(iconDark)}`);
this._iconClass = createIconCssClass(this.iconPath, this._iconClass);
this._changeRef.detectChanges();
}
}
private getLightIconUri(iconPath: IUserFriendlyIcon): URI {
if (iconPath && iconPath['light']) {
return this.getIconUri(iconPath['light']);
} else {
return this.getIconUri(<string | URI>iconPath);
}
}
private getDarkIconUri(iconPath: IUserFriendlyIcon): URI {
if (iconPath && iconPath['dark']) {
return this.getIconUri(iconPath['dark']);
}
return null;
}
private getIconUri(iconPath: string | URI): URI {
if (typeof iconPath === 'string') {
return URI.file(iconPath);
} else {
return URI.revive(iconPath);
}
}
public getIconWidth(): string {
return this.convertSize(this.iconWidth, '40px');
}