mirror of
https://github.com/Microsoft/vscode
synced 2024-09-13 21:55:38 +00:00
Merge pull request #191642 from microsoft/tyriar/dim_editors
Action feedback on dim unfocused view feature
This commit is contained in:
commit
93ac91a8c7
|
@ -21,8 +21,8 @@ export const accessibleViewCurrentProviderId = new RawContextKey<string>('access
|
|||
* were better to live under workbench for discoverability.
|
||||
*/
|
||||
export const enum AccessibilityWorkbenchSettingId {
|
||||
ViewDimUnfocusedEnabled = 'workbench.view.dimUnfocused.enabled',
|
||||
ViewDimUnfocusedOpacity = 'workbench.view.dimUnfocused.opacity'
|
||||
DimUnfocusedEnabled = 'accessibility.dimUnfocused.enabled',
|
||||
DimUnfocusedOpacity = 'accessibility.dimUnfocused.opacity'
|
||||
}
|
||||
|
||||
export const enum ViewDimUnfocusedOpacityProperties {
|
||||
|
@ -120,15 +120,15 @@ export function registerAccessibilityConfiguration() {
|
|||
registry.registerConfiguration({
|
||||
...workbenchConfigurationNodeBase,
|
||||
properties: {
|
||||
[AccessibilityWorkbenchSettingId.ViewDimUnfocusedEnabled]: {
|
||||
description: localize('dimUnfocusedEnabled', 'Whether to dim unfocused editors and terminals, making the focused view more obvious.'),
|
||||
[AccessibilityWorkbenchSettingId.DimUnfocusedEnabled]: {
|
||||
description: localize('dimUnfocusedEnabled', 'Whether to dim unfocused editors and terminals, which makes it more clear where typed input will go to. This works with the majority of editors with the notable exceptions of those that utilize iframes like notebooks and extension webview editors.'),
|
||||
type: 'boolean',
|
||||
default: false,
|
||||
tags: ['accessibility'],
|
||||
scope: ConfigurationScope.APPLICATION,
|
||||
},
|
||||
[AccessibilityWorkbenchSettingId.ViewDimUnfocusedOpacity]: {
|
||||
description: localize('dimUnfocusedOpacity', 'The opacity fraction (0.2 to 1.0) to use for unfocused editors and terminals. This will only take effect when {0} is enabled.', `\`#${AccessibilityWorkbenchSettingId.ViewDimUnfocusedEnabled}#\``),
|
||||
[AccessibilityWorkbenchSettingId.DimUnfocusedOpacity]: {
|
||||
description: localize('dimUnfocusedOpacity', 'The opacity fraction (0.2 to 1.0) to use for unfocused editors and terminals. This will only take effect when {0} is enabled.', `\`#${AccessibilityWorkbenchSettingId.DimUnfocusedEnabled}#\``),
|
||||
type: 'number',
|
||||
minimum: ViewDimUnfocusedOpacityProperties.Minimum,
|
||||
maximum: ViewDimUnfocusedOpacityProperties.Maximum,
|
||||
|
|
|
@ -21,21 +21,23 @@ export class UnfocusedViewDimmingContribution extends Disposable implements IWor
|
|||
this._register(toDisposable(() => this._removeStyleElement()));
|
||||
|
||||
this._register(Event.runAndSubscribe(configurationService.onDidChangeConfiguration, e => {
|
||||
if (e && !e.affectsConfiguration(AccessibilityWorkbenchSettingId.ViewDimUnfocusedEnabled) && !e.affectsConfiguration(AccessibilityWorkbenchSettingId.ViewDimUnfocusedOpacity)) {
|
||||
if (e && !e.affectsConfiguration(AccessibilityWorkbenchSettingId.DimUnfocusedEnabled) && !e.affectsConfiguration(AccessibilityWorkbenchSettingId.DimUnfocusedOpacity)) {
|
||||
return;
|
||||
}
|
||||
|
||||
let cssTextContent = '';
|
||||
|
||||
const enabled = ensureBoolean(configurationService.getValue(AccessibilityWorkbenchSettingId.ViewDimUnfocusedEnabled), false);
|
||||
const enabled = ensureBoolean(configurationService.getValue(AccessibilityWorkbenchSettingId.DimUnfocusedEnabled), false);
|
||||
if (enabled) {
|
||||
const opacity = clamp(
|
||||
ensureNumber(configurationService.getValue(AccessibilityWorkbenchSettingId.ViewDimUnfocusedOpacity), ViewDimUnfocusedOpacityProperties.Default),
|
||||
ensureNumber(configurationService.getValue(AccessibilityWorkbenchSettingId.DimUnfocusedOpacity), ViewDimUnfocusedOpacityProperties.Default),
|
||||
ViewDimUnfocusedOpacityProperties.Minimum,
|
||||
ViewDimUnfocusedOpacityProperties.Maximum
|
||||
);
|
||||
|
||||
if (opacity !== 1) {
|
||||
// These filter rules are more specific than may be expected as the `filter`
|
||||
// rule can cause problems if it's used inside the element like on editor hovers
|
||||
const rules = new Set<string>();
|
||||
const filterRule = `filter: opacity(${opacity});`;
|
||||
// Terminal tabs
|
||||
|
@ -43,9 +45,19 @@ export class UnfocusedViewDimmingContribution extends Disposable implements IWor
|
|||
// Terminals
|
||||
rules.add(`.monaco-workbench .pane-body.integrated-terminal .terminal-wrapper:not(:focus-within) { ${filterRule} }`);
|
||||
// Text editors
|
||||
rules.add(`.monaco-workbench .editor-instance:not(:focus-within) .monaco-editor { ${filterRule} }`);
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .monaco-editor { ${filterRule} }`);
|
||||
// Breadcrumbs
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .tabs-breadcrumbs { ${filterRule} }`);
|
||||
// Terminal editors
|
||||
rules.add(`.monaco-workbench .editor-instance:not(:focus-within) .terminal-wrapper { ${filterRule} }`);
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .terminal-wrapper { ${filterRule} }`);
|
||||
// Settings editor
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .settings-editor { ${filterRule} }`);
|
||||
// Keybindings editor
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .keybindings-editor { ${filterRule} }`);
|
||||
// Editor placeholder (error case)
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .monaco-editor-pane-placeholder { ${filterRule} }`);
|
||||
// Welcome editor
|
||||
rules.add(`.monaco-workbench .editor-group-container:not(.active) .gettingStartedContainer { ${filterRule} }`);
|
||||
cssTextContent = [...rules].join('\n');
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue