Skip to content

Commit 9df5bb9

Browse files
renamed to PreferredColorScheme
1 parent b17587c commit 9df5bb9

2 files changed

Lines changed: 120 additions & 130 deletions

File tree

specs/PreferredColorScheme.md

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
Preferred Color Scheme API
2+
===
3+
4+
# Background
5+
This API's main use is to set the preferred color scheme for WebView2's which are associated with a profile. The options are similar to Edge: match the system default color scheme, change to light color scheme, or change to dark color scheme. This sets the color scheme for WebView2 UI like dialogs, prompts, and context menus by setting the ['prefers-color-scheme'](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) [media feature](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#media_features). Websites typically query for this setting in order to set CSS themes for light/dark.
6+
7+
Please note this API will only set the overall appearance, but not theme as defined in the Edge browser.
8+
For reference, in the screenshot below, this API is meant to expose the Overall Appearance section as a WebView2 API.
9+
10+
![Edge Settings Appearance Page](https://github.com/MicrosoftEdge/WebView2Feedback/blob/api-appearance/specs/images/EdgeSettingsAppearance.png)
11+
12+
# Description
13+
We propose extending `CoreWebView2Profile` to include a `PreferredColorScheme` property. This property will apply
14+
to any WebView2's which are associated with this profile.
15+
16+
# Examples
17+
18+
## C++
19+
20+
```cpp
21+
wil::com_ptr<ICoreWebView2> m_webView;
22+
23+
void ViewComponent::SetPreferredColorScheme(COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND value)
24+
{
25+
wil::com_ptr<ICoreWebView2_7> webView7;
26+
webView7 = m_webView.try_query<ICoreWebView2_7>();
27+
28+
if (webView7)
29+
{
30+
wil::com_ptr<ICoreWebView2Profile> profile;
31+
CHECK_FAILURE(webView7->get_Profile(&profile));
32+
33+
auto profile3 = profile.try_query<ICoreWebView2Profile3>();
34+
if (profile3)
35+
{
36+
profile3->put_PreferredColorScheme(value);
37+
}
38+
}
39+
}
40+
```
41+
42+
## C#
43+
44+
```c#
45+
46+
private CoreWebView2 m_webView;
47+
48+
void SetPreferredColorScheme(CoreWebView2PreferredColorSchemeKind value)
49+
{
50+
m_webView.Profile.PreferredColorScheme = value;
51+
}
52+
53+
```
54+
55+
# API Details
56+
## C++
57+
```cpp
58+
[uuid(5f817cce-5d36-4cd0-a1d5-aaaf95c8685f), object, pointer_default(unique)]
59+
interface ICoreWebView2Profile3 : ICoreWebView2Profile2 {
60+
/// The PreferredColorScheme property sets the overall color scheme of the WebView2's associated
61+
/// with this profile. This sets the color scheme for WebView2 UI like dialogs,
62+
/// prompts, and context menus by setting the
63+
/// ['prefers-color-scheme'](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme)
64+
/// CSS media feature for websites to respond to.
65+
///
66+
/// The default value for this is COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND_SYSTEM, which will
67+
/// follow whatever color scheme the OS is currently set to.
68+
///
69+
/// \snippet ViewComponent.cpp SetPreferredColorScheme
70+
/// Returns the value of the `PreferredColorScheme` property.
71+
[propget] HRESULT PreferredColorScheme(
72+
[out, retval] COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND* value);
73+
74+
/// Sets the `PreferredColorScheme` property.
75+
[propput] HRESULT PreferredColorScheme(
76+
[in] COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND value);
77+
}
78+
79+
/// An enum to represent the options for WebView2 Color Scheme: system, light, or dark.
80+
[v1_enum]
81+
typedef enum COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND {
82+
/// System color scheme
83+
COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND_SYSTEM,
84+
85+
/// Light color scheme
86+
COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND_LIGHT,
87+
88+
/// Dark color scheme
89+
COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND_DARK
90+
} COREWEBVIEW2_PREFERRED_COLOR_SCHEME_KIND;
91+
```
92+
93+
### C#
94+
```c#
95+
namespace Microsoft.Web.WebView2.Core
96+
{
97+
[doc_string("An enum to represent the options for WebView2 Preferred Color Scheme: system, light, or dark.")]
98+
enum CoreWebView2PreferredColorSchemeKind
99+
{
100+
[doc_string("System color scheme.")]
101+
System = 0,
102+
[doc_string("Light color scheme.")]
103+
Light = 1,
104+
[doc_string("Dark color scheme.")]
105+
Dark = 2,
106+
};
107+
108+
[doc_string("Multiple profiles can be created under a single user data directory but with separated cookies, user preference settings, and various data storage etc..")]
109+
runtimeclass CoreWebView2Profile
110+
{
111+
// ...
112+
113+
[interface_name("Microsoft.Web.WebView2.Core.ICoreWebView2Profile3")]
114+
{
115+
[doc_string("The PreferredColorScheme property sets the overall color scheme of the WebView2's associated with this profile. This sets the color scheme for WebView2 UI like dialogs, prompts, and context menus by setting the ['prefers-color-scheme'](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) CSS media feature for websites to respond to. The default value for this is CoreWebView2PreferredColorSchemeKind.System, which will follow whatever color scheme the OS is currently set to.")]
116+
CoreWebView2PreferredColorSchemeKind PreferredColorScheme { get; set };
117+
}
118+
}
119+
}
120+
```

specs/Theme.md

Lines changed: 0 additions & 130 deletions
This file was deleted.

0 commit comments

Comments
 (0)