ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 18:46:40 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge from vscode 52dcb723a39ae75bee1bd56b3312d7fcdc87aeed (#6719)

Browse Source
This commit is contained in:
Anthony Dresser
2019-08-12 21:31:51 -07:00
committed by GitHub
parent 00250839fc
commit 7eba8c4c03
616 changed files with 9472 additions and 7087 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/vs/base/browser/ui/checkbox/check-dark.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15 3.76345L5.80687 11.9351L5.08584 11.8927L1 7.29614L1.76345 6.61752L5.50997 10.8324L14.3214 3L15 3.76345Z" fill="#C5C5C5"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 278 B

3
src/vs/base/browser/ui/checkbox/check-light.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15 3.76345L5.80687 11.9351L5.08584 11.8927L1 7.29614L1.76345 6.61752L5.50997 10.8324L14.3214 3L15 3.76345Z" fill="#424242"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 278 B

22
src/vs/base/browser/ui/checkbox/checkbox.css
View File

@@ -39,4 +39,24 @@
.hc-black .monaco-custom-checkbox:hover {
background: none;
}
}
.monaco-custom-checkbox.monaco-simple-checkbox {
height: 18px;
width: 18px;
border: 1px solid transparent;
border-radius: 3px;
margin-right: 9px;
margin-left: 0px;
padding: 0px;
opacity: 1;
background-size: 16px !important;
}
.monaco-custom-checkbox.monaco-simple-checkbox.checked {
background: url('check-light.svg') center center no-repeat;
}
.monaco-custom-checkbox.monaco-simple-checkbox.checked {
background: url('check-dark.svg') center center no-repeat;
}

53
src/vs/base/browser/ui/checkbox/checkbox.ts
View File

@@ -25,6 +25,12 @@ export interface ICheckboxStyles {
inputActiveOptionBackground?: Color;
}
export interface ISimpleCheckboxStyles {
checkboxBackground?: Color;
checkboxBorder?: Color;
checkboxForeground?: Color;
}
const defaultOpts = {
inputActiveOptionBorder: Color.fromHex('#007ACC00'),
inputActiveOptionBackground: Color.fromHex('#0E639C50')
@@ -32,7 +38,7 @@ const defaultOpts = {
export class CheckboxActionViewItem extends BaseActionViewItem {
private checkbox: Checkbox;
private checkbox!: Checkbox;
private readonly disposables = new DisposableStore();
render(container: HTMLElement): void {
@@ -45,7 +51,7 @@ export class CheckboxActionViewItem extends BaseActionViewItem {
title: this._action.label
});
this.disposables.add(this.checkbox);
this.disposables.add(this.checkbox.onChange(() => this._action.checked = this.checkbox.checked, this));
this.disposables.add(this.checkbox.onChange(() => this._action.checked = this.checkbox!.checked, this));
this.element.appendChild(this.checkbox.domNode);
}
@@ -174,3 +180,46 @@ export class Checkbox extends Widget {
this.domNode.setAttribute('aria-disabled', String(true));
}
}
export class SimpleCheckbox extends Widget {
private checkbox: Checkbox;
private styles: ISimpleCheckboxStyles;
readonly domNode: HTMLElement;
constructor(private title: string, private isChecked: boolean) {
super();
this.checkbox = new Checkbox({ title: this.title, isChecked: this.isChecked, actionClassName: 'monaco-simple-checkbox' });
this.domNode = this.checkbox.domNode;
this.styles = {};
this.checkbox.onChange(() => {
this.applyStyles();
});
}
get checked(): boolean {
return this.checkbox.checked;
}
set checked(newIsChecked: boolean) {
this.checkbox.checked = newIsChecked;
this.applyStyles();
}
style(styles: ISimpleCheckboxStyles): void {
this.styles = styles;
this.applyStyles();
}
protected applyStyles(): void {
this.domNode.style.color = this.styles.checkboxForeground ? this.styles.checkboxForeground.toString() : null;
this.domNode.style.backgroundColor = this.styles.checkboxBackground ? this.styles.checkboxBackground.toString() : null;
this.domNode.style.borderColor = this.styles.checkboxBorder ? this.styles.checkboxBorder.toString() : null;
}
}