starred/terminal
1
0
Fork 0
mirror of https://github.com/microsoft/terminal.git synced 2026-02-04 05:35:20 +00:00
Code Issues 19.0k Packages Projects Releases 20 Wiki Activity

[Feature request] [Settings UI] Import a color scheme from a json file #11855

New Issue
Open
opened 2026-01-31 02:59:24 +00:00 by claunia · 12 comments
claunia commented 2026-01-31 02:59:24 +00:00
Owner
Copy Link

Originally created by @skyline75489 on GitHub (Dec 23, 2020).

Description of the new feature/enhancement

I was trying the new settings UI and I found that adding a new color scheme is actually harder than using the json editor. When using the json editor I can directly copy the colors. But with settings UI I cannot do that anymore, which frustrates me a bit. I'd like to propose the feature to import a json file as color scheme. This way all those color schemes in https://github.com/mbadolato/iTerm2-Color-Schemes/tree/master/windowsterminal can be used easily.

This is inspired by iTerm2 on macOS.

Proposed technical implementation details (optional)

Ideally it should be just adding a button, parse the json & save.

Originally created by @skyline75489 on GitHub (Dec 23, 2020). <!-- 🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨 I ACKNOWLEDGE THE FOLLOWING BEFORE PROCEEDING: 1. If I delete this entire template and go my own path, the core team may close my issue without further explanation or engagement. 2. If I list multiple bugs/concerns in this one issue, the core team may close my issue without further explanation or engagement. 3. If I write an issue that has many duplicates, the core team may close my issue without further explanation or engagement (and without necessarily spending time to find the exact duplicate ID number). 4. If I leave the title incomplete when filing the issue, the core team may close my issue without further explanation or engagement. 5. If I file something completely blank in the body, the core team may close my issue without further explanation or engagement. All good? Then proceed! --> # Description of the new feature/enhancement I was trying the new settings UI and I found that adding a new color scheme is actually harder than using the json editor. When using the json editor I can directly copy the colors. But with settings UI I cannot do that anymore, which frustrates me a bit. I'd like to propose the feature to import a json file as color scheme. This way all those color schemes in https://github.com/mbadolato/iTerm2-Color-Schemes/tree/master/windowsterminal can be used easily. This is inspired by iTerm2 on macOS. <!-- A clear and concise description of what the problem is that the new feature would solve. Describe why and how a user would use this new functionality (if applicable). --> # Proposed technical implementation details (optional) Ideally it should be just adding a button, parse the json & save. <!-- A clear and concise description of what you want to happen. -->
claunia added the Issue-FeatureHelp WantedProduct-TerminalArea-SettingsUI labels 2026-01-31 02:59:24 +00:00
claunia commented 2026-01-31 02:59:25 +00:00
Author
Owner
Copy Link

@skyline75489 commented on GitHub (Dec 23, 2020):

I love the settings UI, of course. However, I'm personally comfortable modifying most of the settings using plain old json editors, too. But this one is different. Being able to import a color scheme directly from GUI makes huge different to the entire workflow. I feel that this feature, together with the color scheme preview mentioned in #6800, is really going to help the overall experience with color schemes.

@skyline75489 commented on GitHub (Dec 23, 2020): I love the settings UI, of course. However, I'm personally comfortable modifying most of the settings using plain old json editors, too. But this one is different. Being able to import a color scheme directly from GUI makes huge different to the entire workflow. I feel that this feature, together with the color scheme preview mentioned in #6800, is really going to help the overall experience with color schemes.
claunia commented 2026-01-31 02:59:25 +00:00
Author
Owner
Copy Link

@PankajBhojwani commented on GitHub (Dec 23, 2020):

Once #7632 lands, colour schemes will be import-able from json files!

@PankajBhojwani commented on GitHub (Dec 23, 2020): Once #7632 lands, colour schemes will be import-able from json files!
claunia commented 2026-01-31 02:59:25 +00:00
Author
Owner
Copy Link

@zadjii-msft commented on GitHub (Jan 3, 2021):

I'm yanking triage off this and sticking it on the backlog. I like this idea a lot - especially if you can import multiple files all at once. The iterm2-color-schemes repo lists all the schemes as individual files. It'd be handy to be able to just download the directory, then import all the files from that folder.

@zadjii-msft commented on GitHub (Jan 3, 2021): I'm yanking triage off this and sticking it on the backlog. I like this idea a lot - especially if you can import multiple files all at once. The iterm2-color-schemes repo lists all the schemes as individual files. It'd be handy to be able to just download the directory, then import all the files from that folder.
claunia commented 2026-01-31 02:59:25 +00:00
Author
Owner
Copy Link

@carlos-zamora commented on GitHub (Feb 11, 2021):

Adding design-needed on here. The design shouldn't need a full design doc tbh. I just want to think about the following scenarios and get a quick "I like that" signoff:

  • import a json color scheme
    • Implementation: #7632 should be able to handle this pretty easily.
  • import .itermcolors scheme
    • Implementation: ColorTool (blog & code) should be able to handle this pretty easily

Assuming the color schemes page is designed to look something like this (from this comment):
color scheme page redesign

Here's a few ideas:

  1. Split button flyout
    Split button flyout

  2. Split button flyout (minimalist)
    use download button
    use import button

  3. 2 buttons - separate actions
    use download button
    use import button

Let me know which one you like best (or submit your own design).

As for an implementation plan, currently scheduling this work for v1.9. I'm ok with somebody taking this off my hands as long as the design is approved and we have a positive handoff.

@carlos-zamora commented on GitHub (Feb 11, 2021): Adding design-needed on here. The design shouldn't need a full design doc tbh. I just want to think about the following scenarios and get a quick "I like that" signoff: - import a json color scheme - Implementation: #7632 should be able to handle this pretty easily. - import .itermcolors scheme - Implementation: ColorTool ([blog](https://devblogs.microsoft.com/commandline/introducing-the-windows-console-colortool/) & [code](https://github.com/microsoft/terminal/tree/main/src/tools/ColorTool)) should be able to handle this pretty easily Assuming the color schemes page is designed to look something like this (from [this comment](https://github.com/microsoft/terminal/pull/8997#issuecomment-771623842)): ![color scheme page redesign](https://user-images.githubusercontent.com/11050425/107680253-75899100-6c52-11eb-8e77-bbaee05ded71.png) Here's a few ideas: 1. Split button flyout ![Split button flyout](https://user-images.githubusercontent.com/11050425/107681210-a0c0b000-6c53-11eb-83a5-17e7c37abaa4.png) 2. Split button flyout (minimalist) ![use download button](https://user-images.githubusercontent.com/11050425/107681975-9ce15d80-6c54-11eb-9309-b3f331e9dffd.png) ![use import button](https://user-images.githubusercontent.com/11050425/107682052-b4204b00-6c54-11eb-95c8-db19b90b5e30.png) 3. 2 buttons - separate actions ![use download button](https://user-images.githubusercontent.com/11050425/107682522-4b859e00-6c55-11eb-999c-162575cf85f6.png) ![use import button](https://user-images.githubusercontent.com/11050425/107682449-34df4700-6c55-11eb-981a-543c37e43dd2.png) Let me know which one you like best (or submit your own design). As for an implementation plan, currently scheduling this work for v1.9. I'm ok with somebody taking this off my hands as long as the design is approved and we have a positive handoff.
claunia commented 2026-01-31 02:59:25 +00:00
Author
Owner
Copy Link

@skyline75489 commented on GitHub (Feb 18, 2021):

My vote is goes to option 1, which is the most intuitive one to me. Thanks @carlos-zamora for putting up all the designs 😃

@skyline75489 commented on GitHub (Feb 18, 2021): My vote is goes to option 1, which is the most intuitive one to me. Thanks @carlos-zamora for putting up all the designs 😃
claunia commented 2026-01-31 02:59:26 +00:00
Author
Owner
Copy Link

@mdtauk commented on GitHub (Apr 16, 2021):

The Settings UI is a good place to create your colour schemes - so it would be useful to be able to Export a theme, as well as Import

@mdtauk commented on GitHub (Apr 16, 2021): The Settings UI is a good place to create your colour schemes - so it would be useful to be able to Export a theme, as well as Import
claunia commented 2026-01-31 02:59:26 +00:00
Author
Owner
Copy Link

@skyline75489 commented on GitHub (Jun 7, 2021):

See also #2237 .

@skyline75489 commented on GitHub (Jun 7, 2021): See also #2237 .
claunia commented 2026-01-31 02:59:26 +00:00
Author
Owner
Copy Link

@carlos-zamora commented on GitHub (Jul 12, 2021):

  1. Split button flyout
    Split button flyout

I'm busy doing other stuff, so I'm marking this as help-wanted and moving it to the v2.0 milestone. If anybody wants to go ahead and take this on, that'd be great! If not here's some notes:

I agree that the attached split-button design looks best, so let's go ahead and do that.

If anybody wants to go ahead and figure out "Export" too, that'd be neat, but not necessary. 😉

Suggested Implementation Details

@carlos-zamora commented on GitHub (Jul 12, 2021): > 1. Split button flyout > ![Split button flyout](https://user-images.githubusercontent.com/11050425/107681210-a0c0b000-6c53-11eb-83a5-17e7c37abaa4.png) I'm busy doing other stuff, so I'm marking this as help-wanted and moving it to the v2.0 milestone. If anybody wants to go ahead and take this on, that'd be great! If not here's some notes: I agree that the attached split-button design looks best, so let's go ahead and do that. If anybody wants to go ahead and figure out "Export" too, that'd be neat, but not necessary. 😉 ### Suggested Implementation Details - Now that #7632 is merged, we can import color schemes as fragment extensions. - I would expect the flow to be something like... 1. copy the imported json file over to our fragment's directory 2. load the fragment extensions again (probably just call [`CascadiaSettings::LoadAll()`](https://github.com/microsoft/terminal/blob/17e68a09a8d1db4d9b56206fdeefa5b1cb490b2c/src/cascadia/TerminalSettingsModel/CascadiaSettingsSerialization.cpp#L144) to ensure the layering isn't messed up) - XAML should be fairly straightforward too: - [SplitButton](https://docs.microsoft.com/en-us/windows/winui/api/microsoft.ui.xaml.controls.splitbutton?view=winui-3.0) - Primary button --> what we do now - Secondary button --> open the flyout with the "Import JSON file" in there - (BONUS) "Import iTerm2 file": - Good news: ColorTool can already do this, and that's in the same repo! [Look here!](https://github.com/microsoft/terminal/tree/main/src/tools/ColorTool/ColorTool) - Bad news: it's in C#, so a bit of legwork is needed - Check out https://github.com/microsoft/terminal/blob/main/src/tools/ColorTool/ColorTool/SchemeParsers/XmlSchemeParser.cs if interested
claunia commented 2026-01-31 02:59:26 +00:00
Author
Owner
Copy Link

@j4james commented on GitHub (Jul 12, 2021):

  1. Split button flyout
    Split button flyout

Is it really necessary to make users specify the file type up front? Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it.

@j4james commented on GitHub (Jul 12, 2021): > 1. Split button flyout > ![Split button flyout](https://user-images.githubusercontent.com/11050425/107681210-a0c0b000-6c53-11eb-83a5-17e7c37abaa4.png) Is it really necessary to make users specify the file type up front? Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it.
claunia commented 2026-01-31 02:59:26 +00:00
Author
Owner
Copy Link

@carlos-zamora commented on GitHub (Jul 13, 2021):

  1. Split button flyout
    Split button flyout

Is it really necessary to make users specify the file type up front? Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it.

oh derp. Yeah, that's better.

In that case, let's go with design 2:

  1. Split button flyout (minimalist)
    use download button
    use import button

I'm realizing now, we could also progressively add more things to the dropdown menu like "duplicate" and anything else we may think of.

@carlos-zamora commented on GitHub (Jul 13, 2021): > > 1. Split button flyout > > ![Split button flyout](https://user-images.githubusercontent.com/11050425/107681210-a0c0b000-6c53-11eb-83a5-17e7c37abaa4.png) > > Is it really necessary to make users specify the file type up front? Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it. oh derp. Yeah, that's better. In that case, let's go with design 2: > 2. Split button flyout (minimalist) ![use download button](https://user-images.githubusercontent.com/11050425/107681975-9ce15d80-6c54-11eb-9309-b3f331e9dffd.png) ![use import button](https://user-images.githubusercontent.com/11050425/107682052-b4204b00-6c54-11eb-95c8-db19b90b5e30.png) I'm realizing now, we could also progressively add more things to the dropdown menu like "duplicate" and anything else we may think of.
claunia commented 2026-01-31 02:59:27 +00:00
Author
Owner
Copy Link

@Chaphasilor commented on GitHub (Jan 22, 2022):

Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it.

technically that works of course, but in that case it would be good to show supported file types somewhere, otherwise a user could think they might be able to import .ini files or something similar.
in practice, this could be a simple as creating a filtered file picker that only allows certain extensions to be picked.

@Chaphasilor commented on GitHub (Jan 22, 2022): > Couldn't we just let them pick any file and have the code autodetect the format when it tries to import it. technically that works of course, but in that case it would be good to show supported file types somewhere, otherwise a user could think they might be able to import `.ini` files or something similar. in practice, this could be a simple as creating a filtered file picker that only allows certain extensions to be picked.
claunia commented 2026-01-31 02:59:27 +00:00
Author
Owner
Copy Link

@zadjii-msft commented on GitHub (Jun 6, 2024):

As noted in #17329, we probably want to support actions in a similar way. e.g. support importing YAML from https://www.commands.dev/ as well.

@zadjii-msft commented on GitHub (Jun 6, 2024): As noted in #17329, we probably want to support actions in a similar way. e.g. support importing YAML from https://www.commands.dev/ as well.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
⛺ Reserved
A11yCO
A11yMAS
A11ySev1
A11ySev2
A11ySev3
A11yTTValidated
A11yUsable
A11yVoiceAccess
A11yWCAG
Area-Accessibility
Area-AtlasEngine
Area-AzureShell
Area-Build
Area-Build
Area-Chat
Area-CmdPal
Area-CodeHealth
Area-Commandline
Area-CookedRead
Area-DefApp
Area-Extensibility
Area-Fonts
Area-GroupPolicy
Area-i18n
Area-Input
Area-Interaction
Area-Interop
Area-Localization
Area-Output
Area-Performance
Area-Portable
Area-Quality
Area-Remoting
Area-Rendering
Area-Schema
Area-Server
Area-Settings
Area-SettingsUI
Area-ShellExtension
Area-ShellExtension
Area-ShellExtension
Area-Suggestions
Area-Suggestions
Area-TerminalConnection
Area-TerminalControl
Area-Theming
Area-UserInterface
Area-VT
Area-Windowing
Area-WPFControl
AutoMerge
Blocking-Ingestion
Culprit-Centennial
Culprit-WinUI
Disability-All
Disability-Blind
Disability-LowVision
Disability-Mobility
External-Blocked-WinUI3
Fixed
Gathering-Data
good first issue
HCL-E+D
HCL-WindowsTerminal
Help Wanted
Impact-Compatibility
Impact-Compliance
Impact-Correctness
Impact-Visual
In-PR
InclusionBacklog
InclusionBacklog-Windows TerminalWin32
InclusionCommitted-202206
Issue-Bug
Issue-Docs
Issue-Feature
Issue-Feature
Issue-Question
Issue-Samples
Issue-Scenario
Issue-Task
Needs-Attention
Needs-Author-Feedback
Needs-Bisect
Needs-Discussion
Needs-Repro
Needs-Tag-Fix
Needs-Tag-Fix
Needs-Triage
No-Recent-Activity
Priority-0
Priority-1
Priority-2
Priority-3
Product-Cmd.exe
Product-Colortool
Product-Colortool
Product-Colortool
Product-Conhost
Product-Conpty
Product-Meta
Product-Powershell
Product-Terminal
Product-WSL
pull-request
Mirrored from GitHub Pull Request
 Resolution-Answered
Resolution-By-Design
Resolution-Duplicate
Resolution-External
Resolution-Fix-Available
Resolution-Fix-Committed
Resolution-No-Repro
Resolution-Won't-Fix
Severity-Blocking
Severity-Crash
Severity-DataLoss
spam
this-will-be-a-breaking-change
Tracking-External
WindowsTerminal_Win32
Work-Item
zAskModeBug
zInbox-Bug
No Label Area-SettingsUI Help Wanted Issue-Feature Product-Terminal
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
claunia
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/terminal#11855
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?