Skip to content

Commit

Permalink
update current color example
Browse files Browse the repository at this point in the history
  • Loading branch information
jongund committed Jan 30, 2025
1 parent 434bfb2 commit ca18ae7
Showing 1 changed file with 1 addition and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -756,7 +756,7 @@ <h3><code>currentcolor</code> Keyword</h3>

<h3 id="currentcolor-example">Current Color Example: Switch</h3>

<p>The <a href="../../patterns/switch/examples/switch-button.html">Button Switch Example</a> uses <code>currentcolor</code> value to style the SVG <code>rect</code> elements used as the switch container and to indicate the on and off states. Current color applied to the <code>stroke</code> and <code>fill</code> properties of the <code>rect</code> elements. The following table shows how the graphical rendering changes for some high contrast options. </p>
<p>The Button Switch Example uses <code>currentcolor</code> value to style the SVG elements used as the switch container and to indicate the on and off states. Current color is derived from the <code>button</code> element (i.e. <code>ButtonText</code> system color) and applied to the <code>stroke</code> and <code>fill</code> properties of the <code>circle</code> elements. The SVG <code>rect</code> element has a transparent <code>fill-opacity</code> to show the background color of the <code>button</code> element (i.e. <code>ButtonFace</code> system color). The following table shows how the graphical rendering changes for some high contrast options. </p>

<div class="example">
<button type="button" role="switch" aria-checked="false" class="current-color">
Expand Down

0 comments on commit ca18ae7

Please sign in to comment.