Skip to content

Commit bc456b7

Browse files
committed
[mediaqueries-5] Add initial versions of prefers-contrast and color-scheme
1 parent 0bc2aa9 commit bc456b7

File tree

1 file changed

+79
-1
lines changed

1 file changed

+79
-1
lines changed

mediaqueries-5/Overview.bs

Lines changed: 79 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -561,6 +561,78 @@ Detecting the desire for reduced transparency on the page: the 'prefers-reduced-
561561

562562
</dl>
563563

564+
<h3 id="prefers-contrast">
565+
Detecting the desire for increased or decreased color contrast from elements on the page: the 'prefers-contrast' feature</h3>
566+
567+
<pre class='descdef mq'>
568+
Name: prefers-contrast
569+
Value: no-preference | high | low
570+
For: @media
571+
Type: discrete
572+
</pre>
573+
574+
The 'prefers-contrast' media feature is used to detect if the user
575+
has requested the system increase or decrease the amount of contrast
576+
between adjacent colors. For example, many users have difficulty
577+
reading text that has a small difference in contrast to the text
578+
background and would prefer a larger contrast.
579+
580+
<dl dfn-type=value dfn-for="@media/prefers-contrast">
581+
<dt><dfn>no-preference</dfn>
582+
<dd>
583+
Indicates that the user has made no preference known
584+
to the system. This keyword value evaluates as false
585+
in the <a>boolean context</a>.
586+
587+
<dt><dfn>high</dfn>
588+
<dd>
589+
Indicates that user has notified the system that they
590+
prefer an interface that has a higher level of contrast.
591+
592+
<dt><dfn>low</dfn>
593+
<dd>
594+
Indicates that user has notified the system that they
595+
prefer an interface that has a lower level of contrast.
596+
597+
</dl>
598+
599+
Issue: Should we include 'forced-low' and 'forced-high' values? We don't necessarily want the
600+
page to try to undo what the system might be enforcing.
601+
602+
<h3 id="prefers-color-scheme">
603+
Detecting the desire for increased or decreased color contrast from elements on the page: the 'prefers-color-scheme' feature</h3>
604+
605+
<pre class='descdef mq'>
606+
Name: prefers-color-scheme
607+
Value: no-preference | light | dark
608+
For: @media
609+
Type: discrete
610+
</pre>
611+
612+
The 'prefers-color-scheme' media feature is used to detect if the user
613+
has requested the system use a light or dark color theme.
614+
615+
<dl dfn-type=value dfn-for="@media/prefers-color-scheme">
616+
<dt><dfn>no-preference</dfn>
617+
<dd>
618+
Indicates that the user has made no preference known
619+
to the system. This keyword value evaluates as false
620+
in the <a>boolean context</a>.
621+
622+
<dt><dfn>light</dfn>
623+
<dd>
624+
Indicates that user has notified the system that they
625+
prefer an interface that has a light theme.
626+
627+
<dt><dfn>dark</dfn>
628+
<dd>
629+
Indicates that user has notified the system that they
630+
prefer an interface that has a dark theme.
631+
632+
</dl>
633+
634+
Issue: Should we include 'forced-light' and 'forced-dark' values? We don't necessarily want the
635+
page to try to undo what the system might be enforcing.
564636

565637
<h2 id="changes" class="no-num">
566638
Changes</h2>
@@ -579,7 +651,13 @@ The following changes were made to this specification since the
579651
Add 'prefers-reduced-motion' media feature.
580652

581653
<li>
582-
Add 'prefers-reduced-transparency' media feature.
654+
Add 'prefers-reduced-transparency' media feature.
655+
656+
<li>
657+
Add 'prefers-contrast' media feature.
658+
659+
<li>
660+
Add 'prefers-color-scheme' media feature.
583661

584662
</ul>
585663

0 commit comments

Comments
 (0)