LibWeb: Add start and end values to text-align
The `start` and `end` value set the text alignment based on the computed value of `direction`. The default value of `text-align` is now `start` instead of `left`.
This commit is contained in:
BenJilks
Sam Atkins
parent
82989554ab
commit
1537d589ca
Notes:
github-actions[bot]
2024-08-13 14:20:44 +00:00
Author: https://github.com/BenJilks Commit: https://github.com/LadybirdBrowser/ladybird/commit/1537d589ca4 Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/1060 Reviewed-by: https://github.com/AtkinsSJ ✅
8 changed files with 51 additions and 12 deletions
Tests/LibWeb
Layout
expected
input
Text/expected/css
Userland/Libraries/LibWeb
|
|
@ -18,9 +18,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|||
BlockContainer <(anonymous)> at (200,212) content-size 592x0 children: inline
|
||||
TextNode <#text>
|
||||
BlockContainer <div> at (401,213) content-size 100x100 children: inline
|
||||
frag 0 from TextNode start: 0, length: 11, rect: [401,213 79.96875x17] baseline: 13.296875
|
||||
frag 0 from TextNode start: 0, length: 11, rect: [421,213 79.96875x17] baseline: 13.296875
|
||||
"Well, hello"
|
||||
frag 1 from TextNode start: 12, length: 8, rect: [401,230 59.21875x17] baseline: 13.296875
|
||||
frag 1 from TextNode start: 12, length: 8, rect: [442,230 59.21875x17] baseline: 13.296875
|
||||
"friends!"
|
||||
TextNode <#text>
|
||||
BlockContainer <(anonymous)> at (200,314) content-size 592x0 children: inline
|
||||
|
|
@ -50,17 +50,17 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|||
BlockContainer <(anonymous)> at (200,620) content-size 592x0 children: inline
|
||||
TextNode <#text>
|
||||
BlockContainer <div> at (401,621) content-size 100x100 children: inline
|
||||
frag 0 from TextNode start: 0, length: 26, rect: [401,621 86.125x17] baseline: 13.296875
|
||||
frag 0 from TextNode start: 0, length: 26, rect: [415,621 86.125x17] baseline: 13.296875
|
||||
"حسنًا ، مرحباً"
|
||||
frag 1 from TextNode start: 27, length: 25, rect: [401,638 78.125x17] baseline: 13.296875
|
||||
frag 1 from TextNode start: 27, length: 25, rect: [423,638 78.125x17] baseline: 13.296875
|
||||
"أيها الأصدقاء"
|
||||
TextNode <#text>
|
||||
BlockContainer <(anonymous)> at (200,722) content-size 592x0 children: inline
|
||||
TextNode <#text>
|
||||
BlockContainer <div> at (401,723) content-size 100x100 children: inline
|
||||
frag 0 from TextNode start: 0, length: 26, rect: [401,723 86.125x17] baseline: 13.296875
|
||||
frag 0 from TextNode start: 0, length: 26, rect: [415,723 86.125x17] baseline: 13.296875
|
||||
"حسنًا ، مرحباً"
|
||||
frag 1 from TextNode start: 27, length: 25, rect: [401,740 78.125x17] baseline: 13.296875
|
||||
frag 1 from TextNode start: 27, length: 25, rect: [423,740 78.125x17] baseline: 13.296875
|
||||
"أيها الأصدقاء"
|
||||
TextNode <#text>
|
||||
BlockContainer <(anonymous)> at (200,824) content-size 592x0 children: inline
|
||||
|
|
@ -75,7 +75,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,0 800x832]
|
|||
PaintableWithLines (BlockContainer<DIV>) [300,110 102x102]
|
||||
TextPaintable (TextNode<#text>)
|
||||
PaintableWithLines (BlockContainer(anonymous)) [200,212 592x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,212 102x102]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,212 102x102] overflow: [401,213 100.21875x100]
|
||||
TextPaintable (TextNode<#text>)
|
||||
PaintableWithLines (BlockContainer(anonymous)) [200,314 592x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [300,314 102x102]
|
||||
|
|
@ -87,9 +87,9 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,0 800x832]
|
|||
PaintableWithLines (BlockContainer<DIV>) [300,518 102x102]
|
||||
TextPaintable (TextNode<#text>)
|
||||
PaintableWithLines (BlockContainer(anonymous)) [200,620 592x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,620 102x102]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,620 102x102] overflow: [401,621 100.125x100]
|
||||
TextPaintable (TextNode<#text>)
|
||||
PaintableWithLines (BlockContainer(anonymous)) [200,722 592x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,722 102x102]
|
||||
PaintableWithLines (BlockContainer<DIV>) [400,722 102x102] overflow: [401,723 100.125x100]
|
||||
TextPaintable (TextNode<#text>)
|
||||
PaintableWithLines (BlockContainer(anonymous)) [200,824 592x0]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x17 children: inline
|
||||
frag 0 from TextNode start: 0, length: 1, rect: [737,8 8x17] baseline: 13.296875
|
||||
" "
|
||||
InlineNode <span>
|
||||
frag 0 from TextNode start: 0, length: 5, rect: [690,8 46.71875x17] baseline: 13.296875
|
||||
"aaaaa"
|
||||
TextNode <#text>
|
||||
TextNode <#text>
|
||||
InlineNode <span>
|
||||
frag 0 from TextNode start: 0, length: 5, rect: [745,8 47.34375x17] baseline: 13.296875
|
||||
"bbbbb"
|
||||
TextNode <#text>
|
||||
TextNode <#text>
|
||||
|
||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17] overflow: [8,8 784.34375x17]
|
||||
InlinePaintable (InlineNode<SPAN>)
|
||||
TextPaintable (TextNode<#text>)
|
||||
TextPaintable (TextNode<#text>)
|
||||
InlinePaintable (InlineNode<SPAN>)
|
||||
TextPaintable (TextNode<#text>)
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE html>
|
||||
<html dir="rtl">
|
||||
<span>aaaaa</span>
|
||||
<span>bbbbb</span>
|
||||
|
|
@ -192,7 +192,7 @@ stroke: none
|
|||
stroke-opacity: 1
|
||||
stroke-width: 1px
|
||||
table-layout: auto
|
||||
text-align: left
|
||||
text-align: start
|
||||
text-anchor: start
|
||||
text-decoration-color: rgb(0, 0, 0)
|
||||
text-decoration-line: none
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ public:
|
|||
static CSS::ContentVisibility content_visibility() { return CSS::ContentVisibility::Visible; }
|
||||
static CSS::Cursor cursor() { return CSS::Cursor::Auto; }
|
||||
static CSS::WhiteSpace white_space() { return CSS::WhiteSpace::Normal; }
|
||||
static CSS::TextAlign text_align() { return CSS::TextAlign::Left; }
|
||||
static CSS::TextAlign text_align() { return CSS::TextAlign::Start; }
|
||||
static CSS::TextJustify text_justify() { return CSS::TextJustify::Auto; }
|
||||
static CSS::Positioning position() { return CSS::Positioning::Static; }
|
||||
static CSS::TextDecorationLine text_decoration_line() { return CSS::TextDecorationLine::None; }
|
||||
|
|
|
|||
|
|
@ -390,6 +390,8 @@
|
|||
"text-align": [
|
||||
"center",
|
||||
"justify",
|
||||
"start",
|
||||
"end",
|
||||
"left",
|
||||
"right",
|
||||
"-libweb-center",
|
||||
|
|
|
|||
|
|
@ -2470,7 +2470,7 @@
|
|||
"text-align": {
|
||||
"animation-type": "discrete",
|
||||
"inherited": true,
|
||||
"initial": "left",
|
||||
"initial": "start",
|
||||
"valid-types": [
|
||||
"text-align"
|
||||
]
|
||||
|
|
|
|||
|
|
@ -163,6 +163,7 @@ void LineBuilder::update_last_line()
|
|||
auto& line_box = line_boxes.last();
|
||||
|
||||
auto text_align = m_context.containing_block().computed_values().text_align();
|
||||
auto direction = m_context.containing_block().computed_values().direction();
|
||||
|
||||
auto current_line_height = max(m_max_height_on_current_line, m_context.containing_block().computed_values().line_height());
|
||||
CSSPixels x_offset_top = m_context.leftmost_x_offset_at(m_current_y);
|
||||
|
|
@ -179,6 +180,14 @@ void LineBuilder::update_last_line()
|
|||
case CSS::TextAlign::LibwebCenter:
|
||||
x_offset += excess_horizontal_space / 2;
|
||||
break;
|
||||
case CSS::TextAlign::Start:
|
||||
if (direction == CSS::Direction::Rtl)
|
||||
x_offset += excess_horizontal_space;
|
||||
break;
|
||||
case CSS::TextAlign::End:
|
||||
if (direction == CSS::Direction::Ltr)
|
||||
x_offset += excess_horizontal_space;
|
||||
break;
|
||||
case CSS::TextAlign::Right:
|
||||
case CSS::TextAlign::LibwebRight:
|
||||
x_offset += excess_horizontal_space;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue