-
Notifications
You must be signed in to change notification settings - Fork 3.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Don't adjust SVG text in forced colors mode
As per the following spec resolution, SVG text no longer should be adjusted in forced colors mode by default. w3c/csswg-drafts#3855 Bug: 970285 Change-Id: I11a785f64ca6f7e7840b17d6b59d4ce9b9f8b4e1
- Loading branch information
1 parent
52f9e48
commit c066647
Showing
8 changed files
with
104 additions
and
94 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>Forced colors mode - svg. | ||
Only foreignObject svg elements should have styles | ||
overridden in forced colors mode. | ||
</title> | ||
<style> | ||
svg, text, foreignObject { | ||
forced-color-adjust: none; | ||
} | ||
</style> | ||
<body> | ||
<svg height="600" width="600"> | ||
<text x="0" y="15" fill="red" stroke="blue"> | ||
This text should have a red fill and blue stroke color in | ||
forced colors mode. | ||
</text> | ||
<rect x="0" height="60" y="30" width="180" style="fill: red; stroke: blue;"/> | ||
<foreignObject x="20" y="100" width="160" height="160"> | ||
<div xmlns="http://www.w3.org/1999/xhtml" style="color: orange;"> | ||
This text should be orange in forced colors mode due to inheritance. | ||
</div> | ||
<svg height="20" width="20"> | ||
<rect x="0" height="20" y="0" width="20" style="fill: green; stroke: purple;"/> | ||
</svg> | ||
</foreignObject> | ||
</svg> | ||
|
||
<svg height="600" width="600"> | ||
<foreignObject x="20" y="100" width="160" height="160" style="color: CanvasText;"> | ||
<div xmlns="http://www.w3.org/1999/xhtml"> | ||
This text should be CanvasText in forced colors mode. | ||
</div> | ||
</foreignObject> | ||
</svg> | ||
</body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>Forced colors mode - svg. | ||
Only foreignObject svg elements should have styles | ||
overridden in forced colors mode. | ||
</title> | ||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-colors-properties"> | ||
<link rel=match href="forced-colors-mode-18-ref.html"> | ||
<body> | ||
<svg height="600" width="600" style="color: orange"> | ||
<text x="0" y="15" fill="red" stroke="blue"> | ||
This text should have a red fill and blue stroke color in | ||
forced colors mode. | ||
</text> | ||
<rect x="0" height="60" y="30" width="180" style="fill: red; stroke: blue;"/> | ||
<foreignObject x="20" y="100" width="160" height="160" style="color: blue;"> | ||
<div xmlns="http://www.w3.org/1999/xhtml"> | ||
This text should be orange in forced colors mode due to inheritance. | ||
</div> | ||
<svg height="20" width="20"> | ||
<rect x="0" height="20" y="0" width="20" style="fill: green; stroke: purple;"/> | ||
</svg> | ||
</foreignObject> | ||
</svg> | ||
|
||
<svg height="600" width="600"> | ||
<foreignObject x="20" y="100" width="160" height="160" style="color: blue;"> | ||
<div xmlns="http://www.w3.org/1999/xhtml"> | ||
This text should be CanvasText in forced colors mode. | ||
</div> | ||
</foreignObject> | ||
</svg> | ||
</body> |
28 changes: 0 additions & 28 deletions
28
forced-colors-mode/forced-colors-mode-18.tentative-ref.html
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>Forced colors mode - fill/stroke. | ||
</title> | ||
<style> | ||
body { | ||
forced-color-adjust: none; | ||
} | ||
</style> | ||
<body> | ||
The triangle below should be currentColor when forced colors mode. | ||
<svg height="600" width="600"> | ||
<path fill="currentColor" d="M150 0 L75 200 L225 200 Z" /> | ||
</svg> | ||
</body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
<!DOCTYPE html> | ||
<meta charset="utf-8"> | ||
<title>Forced colors mode - fill/stroke. | ||
</title> | ||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-colors-properties"> | ||
<link rel=match href="forced-colors-mode-26-ref.html"> | ||
<style> | ||
div { | ||
fill: red; | ||
stroke: blue; | ||
} | ||
</style> | ||
<body> | ||
<div> | ||
The triangle below should be currentColor when forced colors mode. | ||
<svg height="600" width="600"> | ||
<path d="M150 0 L75 200 L225 200 Z" /> | ||
</svg> | ||
</div> | ||
</body> |
16 changes: 0 additions & 16 deletions
16
forced-colors-mode/forced-colors-mode-26.tentative-ref.html
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.