diff options
| author | Shawn Rutledge <[email protected]> | 2024-04-12 07:50:30 -0400 |
|---|---|---|
| committer | Shawn Rutledge <[email protected]> | 2024-04-19 04:13:32 -0700 |
| commit | 7f48c79627663f0777df9c10d06202aea5bedac3 (patch) | |
| tree | 41e1364289eeaf7d8eb44feb5ff9344cbcc3f1e0 | |
| parent | a833d5682ac44571e13568336f2bd3ec7deb1d6d (diff) | |
Draw list bullets/numbers with CSS text color, not palette color
When CSS has been used to customize the text color, render the bullet
with the same color. This is consistent with web browsers, and with
Qt Quick rendering.
In QTextDocumentLayoutPrivate::drawListItem(), the pen color is the
text color, so use it instead of brush color.
Add a baseline test for lancelot: the background and general text
are customized, then some list items are customized further, and
some of them have colored text spans. Repeat with different styles
of numbered and bullet lists and checklists.
Fixes: QTBUG-2188
Task-number: QTBUG-213
Task-number: QTBUG-57833
Pick-to: 6.5 6.7
Change-Id: I71e84d00172e4b37aef57c8badd2ec43c10113d9
Reviewed-by: Sami Shalayel <[email protected]>
| -rw-r--r-- | src/gui/text/qtextdocumentlayout.cpp | 8 | ||||
| -rw-r--r-- | tests/baseline/text/data/colored_list.html | 68 |
2 files changed, 71 insertions, 5 deletions
diff --git a/src/gui/text/qtextdocumentlayout.cpp b/src/gui/text/qtextdocumentlayout.cpp index baff79973f2..452f814231c 100644 --- a/src/gui/text/qtextdocumentlayout.cpp +++ b/src/gui/text/qtextdocumentlayout.cpp @@ -2216,17 +2216,15 @@ void QTextDocumentLayoutPrivate::drawListItem(const QPointF &offset, QPainter *p } case QTextListFormat::ListSquare: if (!marker) - painter->fillRect(r, brush); + painter->fillRect(r, painter->pen().brush()); break; case QTextListFormat::ListCircle: - if (!marker) { - painter->setPen(QPen(brush, 0)); + if (!marker) painter->drawEllipse(r.translated(0.5, 0.5)); // pixel align for sharper rendering - } break; case QTextListFormat::ListDisc: if (!marker) { - painter->setBrush(brush); + painter->setBrush(painter->pen().brush()); painter->setPen(Qt::NoPen); painter->drawEllipse(r); } diff --git a/tests/baseline/text/data/colored_list.html b/tests/baseline/text/data/colored_list.html new file mode 100644 index 00000000000..d1cca94460f --- /dev/null +++ b/tests/baseline/text/data/colored_list.html @@ -0,0 +1,68 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> +<html> +<head> +<style type="text/css"> +p, li { white-space: pre-wrap; } +hr { height: 1px; border-width: 0; } +li.unchecked::marker { content: "\2610"; } +li.checked::marker { content: "\2612"; } +body { background-color: #111155; color: #ffffff; } +</style> +</head> +<body> + +<ul> +<li>disc</li> +<li style=" color:#a58d47;">bronze</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red bullet, pink text</span></li> +<li style=" color:#dddddd;" class="checked">checked</li> +<li style=" color:#dddddd;" class="unchecked">unchecked</li> +</ul> + +<ul type="circle"> +<li>circle</li> +<li style=" color:#dddddd;">silver</li> +<li style=" color:lightgrey;"><span style=" color:#ffcdb9;">grey bullet, pink text</span></li> +<li style=" color:#dddddd;" class="checked">checked</li> +<li style=" color:#dddddd;" class="unchecked">unchecked</li> +</ul> + +<ul type="square"> +<li style=" color:#ffffff;">square</li> +<li style=" color:#fceebb;">gold</li> +<li style=" color:yellow;"><span style=" color:#ffcdb9;">yellow bullet, pink text</span></li> +<li style=" color:#dddddd;" class="checked">checked</li> +<li style=" color:#dddddd;" class="unchecked">unchecked</li> +</ul> + +<ol> +<li>decimal</li> +<li style=" color:#a58d47;">bronze decimal</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red number, pink text</span></li> +</ol> + +<ol type="A"> +<li>uppercase</li> +<li style=" color:#a58d47;">bronze uppercase</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red letter, pink text</span></li> +</ol> + +<ol type="a"> +<li>lowercase</li> +<li style=" color:#a58d47;">bronze lowercase</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red letter, pink text</span></li> +</ol> + +<ol type="i"> +<li>lower roman</li> +<li style=" color:#a58d47;">bronze roman</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red number, pink text</span></li> +</ol> + +<ol type="I"> +<li>upper roman</li> +<li style=" color:#a58d47;">bronze roman</li> +<li style=" color:red;"><span style=" color:#ffcdb9;">red number, pink text</span></li> +</ol> +</body> +</html> |