mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-18 17:22:45 -05:00
fix the icon sizing issue (#13522)
This commit is contained in:
@@ -187,6 +187,14 @@ export default class ButtonComponent extends ComponentWithIconBase<azdata.Button
|
||||
}
|
||||
}
|
||||
|
||||
protected get defaultIconHeight(): number {
|
||||
return 15;
|
||||
}
|
||||
|
||||
protected get defaultIconWidth(): number {
|
||||
return 15;
|
||||
}
|
||||
|
||||
// CSS-bound properties
|
||||
|
||||
private get label(): string {
|
||||
|
||||
@@ -42,12 +42,20 @@ export abstract class ComponentWithIconBase<T extends azdata.ComponentWithIconPr
|
||||
}
|
||||
}
|
||||
|
||||
protected get defaultIconWidth(): number {
|
||||
return 50;
|
||||
}
|
||||
|
||||
protected get defaultIconHeight(): number {
|
||||
return 50;
|
||||
}
|
||||
|
||||
public getIconWidth(): string {
|
||||
return convertSize(this.iconWidth, '40px');
|
||||
return convertSize(this.iconWidth, `${this.defaultIconWidth}px`);
|
||||
}
|
||||
|
||||
public getIconHeight(): string {
|
||||
return convertSize(this.iconHeight, '40px');
|
||||
return convertSize(this.iconHeight, `${this.defaultIconHeight}px`);
|
||||
}
|
||||
|
||||
public get iconPath(): string | URI | { light: string | URI; dark: string | URI } {
|
||||
@@ -55,11 +63,11 @@ export abstract class ComponentWithIconBase<T extends azdata.ComponentWithIconPr
|
||||
}
|
||||
|
||||
public get iconHeight(): number | string {
|
||||
return this.getPropertyOrDefault<number | string>((props) => props.iconHeight, '50px');
|
||||
return this.getPropertyOrDefault<number | string>((props) => props.iconHeight, this.defaultIconHeight);
|
||||
}
|
||||
|
||||
public get iconWidth(): number | string {
|
||||
return this.getPropertyOrDefault<number | string>((props) => props.iconWidth, '50px');
|
||||
return this.getPropertyOrDefault<number | string>((props) => props.iconWidth, this.defaultIconWidth);
|
||||
}
|
||||
|
||||
public get title(): string {
|
||||
|
||||
@@ -51,17 +51,17 @@
|
||||
}
|
||||
|
||||
.modelview-toolbar-container .modelview-toolbar-component modelview-button .monaco-text-button.icon {
|
||||
padding-left: 19px;
|
||||
background-size: 15px;
|
||||
padding-left: 19px !important;
|
||||
background-size: 15px !important;
|
||||
margin-right: 0.3em;
|
||||
}
|
||||
|
||||
/* Vertical button handling */
|
||||
.modelview-toolbar-container.toolbar-vertical .modelview-toolbar-component modelview-button .monaco-text-button.icon {
|
||||
padding: 20px 16px 20px 16px;
|
||||
background-size: 20px;
|
||||
padding: 20px 16px 20px 16px !important;
|
||||
background-size: 20px !important;
|
||||
margin-right: 0.3em;
|
||||
background-position: 50% 50%;
|
||||
background-position: 50% 50% !important;
|
||||
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user