ui: Adds localStorage to <html class=""> mapping for user controlled theming (#9496)

4 years ago · 1304dc8820
1 changed files with 12 additions and 0 deletions
--- a/ui/packages/consul-ui/app/templates/application.hbs
+++ b/ui/packages/consul-ui/app/templates/application.hbs
@ -1,11 +1,23 @@
 <HeadLayout />
 {{page-title 'Consul' separator=' - '}}
+
 {{#if (env 'CONSUL_ACLS_ENABLED')}}
  {{document-attrs class="has-acls"}}
 {{/if}}
 {{#if (env 'CONSUL_NSPACES_ENABLED')}}
  {{document-attrs class="has-nspaces"}}
 {{/if}}
+
+<DataSource
+  @src="settings://consul:theme"
+as |source|>
+{{#each-in source.data as |key value|}}
+  {{#if (and value (contains key (array "color-scheme" "contrast")))}}
+    {{document-attrs class=(concat 'prefers-' key '-' value)}}
+  {{/if}}
+{{/each-in}}
+</DataSource>
+
 {{#if (not-eq router.currentRouteName 'application')}}
  <HashicorpConsul
    id="wrapper"