From 143cb05e9748dc8c4b3b235b1f9aaee86179f88c Mon Sep 17 00:00:00 2001 From: squidfunk Date: Mon, 15 Jun 2020 09:17:28 +0200 Subject: [PATCH] Added documentation for preference-based color scheme --- docs/getting-started.md | 10 ++++++++++ material/base.html | 2 +- src/base.html | 2 +- 3 files changed, 12 insertions(+), 2 deletions(-) diff --git a/docs/getting-started.md b/docs/getting-started.md index 2e70d7994..58c0e080c 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -365,6 +365,16 @@ Click on a color name to change the color scheme of the theme: }) +The color scheme can also be set based on _user preference_, which makes use of +the `prefers-color-scheme` media query. This can be done by adding the following +to `mkdocs.yml`: + +``` yaml +theme: + palette: + scheme: preference +``` + ### Color palette The Material Design [color palette][10] comes with 20 hues, all of which are diff --git a/material/base.html b/material/base.html index fe7618af0..d6dd37e68 100644 --- a/material/base.html +++ b/material/base.html @@ -86,7 +86,7 @@ {% else %} {% endif %} - {% if "prefers" == palette.scheme %} + {% if "preference" == palette.scheme %} {% endif %} diff --git a/src/base.html b/src/base.html index 4feb40762..b66576d8a 100644 --- a/src/base.html +++ b/src/base.html @@ -181,7 +181,7 @@ {% endif %} - {% if "prefers" == palette.scheme %} + {% if "preference" == palette.scheme %}