Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-05-02 06:21:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

[theme] style find/replace widget

Browse Source
This commit is contained in:
Martin Aeschlimann
2017-03-23 22:44:36 +01:00
parent f9f849155b
commit 4eebba084d
8 changed files with 126 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/vs/base/browser/ui/findinput/findInput.ts
View File

@@ -15,8 +15,9 @@ import Event, { Emitter } from 'vs/base/common/event';
import { IKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode } from 'vs/base/common/keyCodes';
import { CaseSensitiveCheckbox, WholeWordsCheckbox, RegexCheckbox } from 'vs/base/browser/ui/findinput/findInputCheckboxes';
import { Color } from "vs/base/common/color";
export interface IFindInputOptions {
export interface IFindInputOptions extends IFindInputStyles {
placeholder?: string;
width?: number;
validation?: IInputValidator;
@@ -27,6 +28,10 @@ export interface IFindInputOptions {
appendRegexLabel?: string;
}
export interface IFindInputStyles {
checkedBorderColor?: Color;
}
const NLS_DEFAULT_LABEL = nls.localize('defaultLabel', "input");
export class FindInput extends Widget {
@@ -38,6 +43,7 @@ export class FindInput extends Widget {
private placeholder: string;
private validation: IInputValidator;
private label: string;
private checkedBorderColor: Color;
private regex: RegexCheckbox;
private wholeWords: WholeWordsCheckbox;
@@ -67,6 +73,7 @@ export class FindInput extends Widget {
this.placeholder = options.placeholder || '';
this.validation = options.validation;
this.label = options.label || NLS_DEFAULT_LABEL;
this.checkedBorderColor = options.checkedBorderColor;
this.regex = null;
this.wholeWords = null;
@@ -132,6 +139,20 @@ export class FindInput extends Widget {
}
}
public style(styles: IFindInputStyles) {
this.checkedBorderColor = styles.checkedBorderColor;
this._applyStyles();
}
protected _applyStyles() {
if (this.domNode) {
const styles = { checkedBorderColor: this.checkedBorderColor };
this.regex.style(styles);
this.wholeWords.style(styles);
this.caseSensitive.style(styles);
}
}
public select(): void {
this.inputBox.select();
}
@@ -207,7 +228,8 @@ export class FindInput extends Widget {
}
this.setInputWidth();
this.validate();
}
},
checkedBorderColor: this.checkedBorderColor
}));
this.wholeWords = this._register(new WholeWordsCheckbox({
appendTitle: appendWholeWordsLabel,
@@ -219,7 +241,8 @@ export class FindInput extends Widget {
}
this.setInputWidth();
this.validate();
}
},
checkedBorderColor: this.checkedBorderColor
}));
this.caseSensitive = this._register(new CaseSensitiveCheckbox({
appendTitle: appendCaseSensitiveLabel,
@@ -234,7 +257,8 @@ export class FindInput extends Widget {
},
onKeyDown: (e) => {
this._onCaseSensitiveKeyDown.fire(e);
}
},
checkedBorderColor: this.checkedBorderColor
}));
// Arrow-Key support to navigate between options

11
src/vs/base/browser/ui/findinput/findInputCheckboxes.ts
View File

@@ -9,12 +9,14 @@ import 'vs/css!./findInputCheckboxes';
import * as nls from 'vs/nls';
import { Checkbox } from 'vs/base/browser/ui/checkbox/checkbox';
import { IKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { Color } from "vs/base/common/color";
export interface IFindInputCheckboxOpts {
appendTitle: string;
isChecked: boolean;
onChange: (viaKeyboard: boolean) => void;
onKeyDown?: (e: IKeyboardEvent) => void;
checkedBorderColor?: Color;
}
const NLS_CASE_SENSITIVE_CHECKBOX_LABEL = nls.localize('caseDescription', "Match Case");
@@ -28,7 +30,8 @@ export class CaseSensitiveCheckbox extends Checkbox {
title: NLS_CASE_SENSITIVE_CHECKBOX_LABEL + opts.appendTitle,
isChecked: opts.isChecked,
onChange: opts.onChange,
onKeyDown: opts.onKeyDown
onKeyDown: opts.onKeyDown,
checkedBorderColor: opts.checkedBorderColor
});
}
}
@@ -40,7 +43,8 @@ export class WholeWordsCheckbox extends Checkbox {
title: NLS_WHOLE_WORD_CHECKBOX_LABEL + opts.appendTitle,
isChecked: opts.isChecked,
onChange: opts.onChange,
onKeyDown: opts.onKeyDown
onKeyDown: opts.onKeyDown,
checkedBorderColor: opts.checkedBorderColor
});
}
}
@@ -52,7 +56,8 @@ export class RegexCheckbox extends Checkbox {
title: NLS_REGEX_CHECKBOX_LABEL + opts.appendTitle,
isChecked: opts.isChecked,
onChange: opts.onChange,
onKeyDown: opts.onKeyDown
onKeyDown: opts.onKeyDown,
checkedBorderColor: opts.checkedBorderColor
});
}
}