-
Notifications
You must be signed in to change notification settings - Fork 8.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'origin/master' into dev/migrie/f/996-zo…
…om-zoom
- Loading branch information
Showing
62 changed files
with
775 additions
and
233 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
146 changes: 146 additions & 0 deletions
146
doc/specs/#1337 - Per-Profile Tab Colors/#1337 - Per-Profile Tab Colors.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,146 @@ | ||
--- | ||
author: Mike Griese @zadjii-msft | ||
created on: 2020-07-31 | ||
last updated: 2020-08-03 | ||
issue id: #1337 | ||
--- | ||
# Per-Profile Tab Colors | ||
|
||
## Abstract | ||
|
||
This spec describes a way to specify tab colors in a profile in a way that will | ||
be forward compatible with theming the Terminal. This spec will be largely | ||
dedicated to the design of a single setting, but within the context of theming. | ||
|
||
## Inspiration | ||
|
||
Following the addition of the Tab Color Picker in [#3789], we've had numerous | ||
requests for the ability to set the color of a tab directly within a profile. | ||
While largely we're tracking theming in [#3327], including the specification of | ||
a tab color, the theming spec ([#5772] )is very large and will take a while to | ||
revise and approve. This spec is intended to pull a single point out from that | ||
spec to make it more easily reviewable, and implement it in a way that will | ||
continue working when we add support for themes in the future. | ||
|
||
## Solution Design | ||
|
||
To enable per-profile tab colors, we'll add a single setting: `tabColor`. For | ||
now<sup>[[1](#user-content-footnote-1)]</sup>, this setting will accept any | ||
`#rrggbb` color string. | ||
|
||
Since each profile creates a `Pane` with a `TermControl`, we'll need to store | ||
this color not in the `Tab`, but somewhere below `Pane`, so that when you switch | ||
between Panes in a tab with different `tabColor`s, the color will update | ||
automatically. When a new `TermControl` is created, we'll store this color in the | ||
`TermControl`'s `Terminal` core. This is to support the future possibility of | ||
setting the tab color via VT sequences. | ||
|
||
A Tab's color will be the result of layering a variety of sources, from the bottom up: | ||
|
||
Color | | Set by | ||
-- | -- | -- | ||
Runtime Color | _optional_ |Color Picker / `setTabColor` action | ||
Control Tab Color | _optional_ | Profile's `tabColor`, or a color set by VT | ||
Theme Tab Background | _optional_ | `tab.backgroundColor` in the theme | ||
Tab Default Color | **default** | TabView in XAML | ||
|
||
Some examples: | ||
* **Scenario 1**: The user has set `"tabColor": "#ff0000"` in their profile. | ||
When they create tabs with that profile, instead of appearing in the default | ||
color for the TabView, they'll be `#ff0000`. | ||
* **Scenario 2**: The user has set `"tabColor": "#ff0000"` in their profile. | ||
When they try to set the color for that tab (with the color picker) to | ||
`#0000ff`, the tab's color is updated to reflect this new blue color. When | ||
they clear the runtime color (with the color picker), the tab will return to | ||
`#ff0000`. | ||
* **Scenario 3**: The user has two profiles with colors set, one to `"tabColor": | ||
"#ff0000"`, and the other with `"tabColor": "#00ff00"`. If they open these | ||
profiles in two panes side-by side, the tab's color will update to reflect the | ||
color from the currently-focused control. | ||
* **Scenario 4**: The user has two profiles with colors set, one to `"tabColor": | ||
"#ff0000"`, and the other with `"tabColor": "#00ff00"`. If they open these | ||
profiles in two panes side-by side, and try to set the color for that tab | ||
(with the color picker) to `#0000ff`, the tab's color is updated to reflect | ||
this new blue color. Regardless of which pane is focused, the tab will be | ||
blue. | ||
* **Scenario 5**: The user has set `"tabColor": "#ff0000"` in their profile | ||
("Profile A"), and `"tab.backgroundColor": "#00ff00"`in their theme. When they | ||
create tabs with "Profile A", the tabs will appear red. Other tabs (for | ||
profiles without `tabColor` set) will appear green, using the color from the | ||
theme. | ||
|
||
|
||
## UI/UX Design | ||
|
||
In general, this is going to look exactly like the colored tabs look now. | ||
|
||
![preview](profile-tabColor-000.gif) | ||
|
||
## Capabilities | ||
|
||
<table> | ||
<tr> | ||
<td><strong>Accessibility</strong></td> | ||
<td> | ||
N/A | ||
</td> | ||
</tr> | ||
<tr> | ||
<td><strong>Security</strong></td> | ||
<td> | ||
N/A | ||
</td> | ||
</tr> | ||
<tr> | ||
<td><strong>Reliability</strong></td> | ||
<td> | ||
No expected change | ||
</td> | ||
</tr> | ||
<tr> | ||
<td><strong>Compatibility</strong></td> | ||
<td> | ||
This entire spec outlines how this feature is designed with a emphasis on future | ||
compatibility. As such, there are no expected regressions in the future when we | ||
do add support for themes. | ||
</td> | ||
</tr> | ||
<tr> | ||
<td><strong>Performance, Power, and Efficiency</strong></td> | ||
<td> | ||
No expected change | ||
</td> | ||
</tr> | ||
</table> | ||
|
||
## Potential Issues | ||
|
||
None expected. | ||
|
||
## Footnotes | ||
|
||
<a id="footnote-1"><a>[1]: When full theming support is added, themes will | ||
provide support for setting colors as one of a variety of values: | ||
|
||
* An `#rrggbb` string | ||
* The system accent color | ||
* The current background color of the Terminal | ||
* A value from a given resource key from XAML | ||
|
||
When support for these other types of "smart" colors is added, then the profile | ||
`tabColor` setting will also gracefully accept these values. | ||
|
||
## Future considerations | ||
|
||
* It's not out of the realm of possibility that someone might want to color each | ||
_pane_'s color at runtime. In that case, the runtime color would be stored in | ||
the `Pane`, not the `Tab`. | ||
|
||
|
||
|
||
<!-- Footnotes --> | ||
|
||
[#1337]: https://github.com/microsoft/terminal/issues/1337 | ||
[#3789]: https://github.com/microsoft/terminal/issues/3789 | ||
[#3327]: https://github.com/microsoft/terminal/issues/3327 | ||
[#5772]: https://github.com/microsoft/terminal/pull/5772 |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
This comment was marked as resolved.
Sorry, something went wrong.