alihan/textual
1
0
Fork 0
mirror of https://github.com/Textualize/textual.git synced 2025-10-17 02:38:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

snapshot tests

Browse Source
This commit is contained in:
Will McGugan
2025-03-25 17:02:00 +00:00
parent 068447c1d4
commit 297bc78741
61 changed files with 3500 additions and 3498 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -23,6 +23,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
- Assigned names to Textual-specific threads: `textual-input`, `textual-output`. These should become visible in monitoring tools (ps, top, htop) as of Python 3.14. https://github.com/Textualize/textual/pull/5654
- Tabs now accept Content or content markup https://github.com/Textualize/textual/pull/5657
- Buttons will now use Textual markup rather than console markup
## [2.1.2] - 2025-02-26

4
docs/examples/widgets/radio_button.py
View File

@@ -1,3 +1,5 @@
from rich.text import Text
from textual.app import App, ComposeResult
from textual.widgets import RadioButton, RadioSet
@@ -15,8 +17,10 @@ class RadioChoicesApp(App[None]):
yield RadioButton("Star Wars: A New Hope")
yield RadioButton("The Last Starfighter")
yield RadioButton(
Text.from_markup(
"Total Recall :backhand_index_pointing_right: :red_circle:"
)
)
yield RadioButton("Wing Commander")
def on_mount(self) -> None:

4
docs/examples/widgets/radio_set.py
View File

@@ -1,3 +1,5 @@
from rich.text import Text
from textual.app import App, ComposeResult
from textual.containers import Horizontal
from textual.widgets import RadioButton, RadioSet
@@ -18,8 +20,10 @@ class RadioChoicesApp(App[None]):
yield RadioButton("Star Wars: A New Hope")
yield RadioButton("The Last Starfighter")
yield RadioButton(
Text.from_markup(
"Total Recall :backhand_index_pointing_right: :red_circle:"
)
)
yield RadioButton("Wing Commander")
# A RadioSet built up from a collection of strings.
yield RadioSet(

4
docs/examples/widgets/radio_set_changed.py
View File

@@ -1,3 +1,5 @@
from rich.text import Text
from textual.app import App, ComposeResult
from textual.containers import Horizontal, VerticalScroll
from textual.widgets import Label, RadioButton, RadioSet
@@ -18,8 +20,10 @@ class RadioSetChangedApp(App[None]):
yield RadioButton("Star Wars: A New Hope")
yield RadioButton("The Last Starfighter")
yield RadioButton(
Text.from_markup(
"Total Recall :backhand_index_pointing_right: :red_circle:"
)
)
yield RadioButton("Wing Commander")
with Horizontal():
yield Label(id="pressed")

2
src/textual/widget.py
View File

@@ -1106,7 +1106,7 @@ class Widget(DOMNode):
else:
text_background = background
if has_rule("color"):
color = styles.color
color = styles.color.multiply_alpha(styles.text_opacity)
style += styles.text_style
if has_rule("auto_color") and styles.auto_color:
color = text_background.get_contrast_text(color.a)

28
src/textual/widgets/_toggle_button.py
View File

@@ -8,7 +8,6 @@ from __future__ import annotations
from typing import TYPE_CHECKING, ClassVar
from rich.console import RenderableType
from rich.text import Text
from textual.binding import Binding, BindingType
from textual.content import Content, ContentText
@@ -184,32 +183,17 @@ class ToggleButton(Static, can_focus=True):
The content to render for the widget.
"""
button = self._button
label = self._label.stylize(self.get_visual_style("toggle--label"))
# label.stylize_before(self.get_component_rich_style("toggle--label"))
label_style = self.get_visual_style("toggle--label")
label = self._label.stylize_before(label_style)
spacer = " " if label else ""
if self._button_first:
return Content.assemble(button, spacer, label)
content = Content.assemble(button, spacer, label)
else:
return Content.assemble(label, spacer, button)
content = Content.assemble(label, spacer, button)
return Content.assemble(
*(
(button, spacer, label)
if self._button_first
else (label, spacer, button)
)
)
return Text.assemble(
*(
(button, spacer, label)
if self._button_first
else (label, spacer, button)
),
no_wrap=True,
overflow="ellipsis",
)
# content = content.stylize_before(self.get_visual_style("toggle--label"))
return content
def get_content_width(self, container: Size, viewport: Size) -> int:
return (

216
tests/snapshot_tests/__snapshots__/test_snapshots/test_arbitrary_selection.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 125 KiB

After

Width:  |  Height:  |  Size: 116 KiB

118
tests/snapshot_tests/__snapshots__/test_snapshots/test_auto_grid.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 33 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_button_with_console_markup.svg
View File

@@ -19,141 +19,141 @@
font-weight: 700;
}
.terminal-3204420437-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-3204420437-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-3204420437-r1 { fill: #2d2d2d }
.terminal-3204420437-r2 { fill: #e0e0e0 }
.terminal-3204420437-r3 { fill: #c5c8c6 }
.terminal-3204420437-r4 { fill: #272727;font-weight: bold }
.terminal-3204420437-r5 { fill: #272727;font-weight: bold;font-style: italic; }
.terminal-3204420437-r6 { fill: #0d0d0d }
.terminal-3204420437-r7 { fill: #e0e0e0;font-weight: bold }
.terminal-3204420437-r8 { fill: #f4005f;font-weight: bold;font-style: italic; }
.terminal-3204420437-r9 { fill: #1e1e1e }
.terminal-3204420437-r10 { fill: #6a6a6a;font-weight: bold }
.terminal-3204420437-r11 { fill: #720c34;font-weight: bold;font-style: italic; }
.terminal-3204420437-r12 { fill: #0f0f0f }
.terminal-r1 { fill: #2d2d2d }
.terminal-r2 { fill: #e0e0e0 }
.terminal-r3 { fill: #c5c8c6 }
.terminal-r4 { fill: #272727;font-weight: bold }
.terminal-r5 { fill: #272727;font-weight: bold;font-style: italic; }
.terminal-r6 { fill: #0d0d0d }
.terminal-r7 { fill: #e0e0e0;font-weight: bold }
.terminal-r8 { fill: #ff0000;font-weight: bold;font-style: italic; }
.terminal-r9 { fill: #1e1e1e }
.terminal-r10 { fill: #6a6a6a;font-weight: bold }
.terminal-r11 { fill: #770c0c;font-weight: bold;font-style: italic; }
.terminal-r12 { fill: #0f0f0f }
</style>
<defs>
<clipPath id="terminal-3204420437-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-3204420437-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3204420437-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-3204420437-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">ButtonsWithMarkupApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">ButtonsWithMarkupApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-3204420437-clip-terminal)">
<rect fill="#272727" x="0" y="1.5" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="1.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#f4005f" x="12.2" y="25.9" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="97.6" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="25.9" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="50.3" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="50.3" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="74.7" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="74.7" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="99.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="99.1" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="97.6" y="99.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="99.1" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="123.5" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="123.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="147.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="147.9" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="172.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="12.2" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="109.8" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="172.3" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="196.7" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="196.7" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-3204420437-matrix">
<text class="terminal-3204420437-r1" x="0" y="20" textLength="195.2" clip-path="url(#terminal-3204420437-line-0)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-3204420437-r3" x="976" y="20" textLength="12.2" clip-path="url(#terminal-3204420437-line-0)">
</text><text class="terminal-3204420437-r5" x="12.2" y="44.4" textLength="85.4" clip-path="url(#terminal-3204420437-line-1)">Focused</text><text class="terminal-3204420437-r4" x="97.6" y="44.4" textLength="97.6" clip-path="url(#terminal-3204420437-line-1)">&#160;Button&#160;</text><text class="terminal-3204420437-r3" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-3204420437-line-1)">
</text><text class="terminal-3204420437-r6" x="0" y="68.8" textLength="195.2" clip-path="url(#terminal-3204420437-line-2)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-3204420437-r3" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-3204420437-line-2)">
</text><text class="terminal-3204420437-r1" x="0" y="93.2" textLength="195.2" clip-path="url(#terminal-3204420437-line-3)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-3204420437-r3" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-3204420437-line-3)">
</text><text class="terminal-3204420437-r8" x="12.2" y="117.6" textLength="85.4" clip-path="url(#terminal-3204420437-line-4)">Blurred</text><text class="terminal-3204420437-r7" x="97.6" y="117.6" textLength="97.6" clip-path="url(#terminal-3204420437-line-4)">&#160;Button&#160;</text><text class="terminal-3204420437-r3" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-3204420437-line-4)">
</text><text class="terminal-3204420437-r6" x="0" y="142" textLength="195.2" clip-path="url(#terminal-3204420437-line-5)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-3204420437-r3" x="976" y="142" textLength="12.2" clip-path="url(#terminal-3204420437-line-5)">
</text><text class="terminal-3204420437-r9" x="0" y="166.4" textLength="207.4" clip-path="url(#terminal-3204420437-line-6)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-3204420437-r3" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-3204420437-line-6)">
</text><text class="terminal-3204420437-r11" x="12.2" y="190.8" textLength="97.6" clip-path="url(#terminal-3204420437-line-7)">Disabled</text><text class="terminal-3204420437-r10" x="109.8" y="190.8" textLength="97.6" clip-path="url(#terminal-3204420437-line-7)">&#160;Button&#160;</text><text class="terminal-3204420437-r3" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-3204420437-line-7)">
</text><text class="terminal-3204420437-r12" x="0" y="215.2" textLength="207.4" clip-path="url(#terminal-3204420437-line-8)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-3204420437-r3" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-3204420437-line-8)">
</text><text class="terminal-3204420437-r3" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-3204420437-line-9)">
</text><text class="terminal-3204420437-r3" x="976" y="264" textLength="12.2" clip-path="url(#terminal-3204420437-line-10)">
</text><text class="terminal-3204420437-r3" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-3204420437-line-11)">
</text><text class="terminal-3204420437-r3" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-3204420437-line-12)">
</text><text class="terminal-3204420437-r3" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-3204420437-line-13)">
</text><text class="terminal-3204420437-r3" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-3204420437-line-14)">
</text><text class="terminal-3204420437-r3" x="976" y="386" textLength="12.2" clip-path="url(#terminal-3204420437-line-15)">
</text><text class="terminal-3204420437-r3" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-3204420437-line-16)">
</text><text class="terminal-3204420437-r3" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-3204420437-line-17)">
</text><text class="terminal-3204420437-r3" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-3204420437-line-18)">
</text><text class="terminal-3204420437-r3" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-3204420437-line-19)">
</text><text class="terminal-3204420437-r3" x="976" y="508" textLength="12.2" clip-path="url(#terminal-3204420437-line-20)">
</text><text class="terminal-3204420437-r3" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-3204420437-line-21)">
</text><text class="terminal-3204420437-r3" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-3204420437-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#272727" x="0" y="1.5" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="1.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ff0000" x="12.2" y="25.9" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="97.6" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="25.9" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="50.3" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="50.3" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="74.7" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="74.7" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="99.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="99.1" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="97.6" y="99.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="99.1" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="0" y="123.5" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="123.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="147.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="147.9" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="172.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="12.2" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="109.8" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="172.3" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#171717" x="0" y="196.7" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="196.7" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="195.2" clip-path="url(#terminal-line-0)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r3" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r5" x="12.2" y="44.4" textLength="85.4" clip-path="url(#terminal-line-1)">Focused</text><text class="terminal-r4" x="97.6" y="44.4" textLength="97.6" clip-path="url(#terminal-line-1)">&#160;Button&#160;</text><text class="terminal-r3" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r6" x="0" y="68.8" textLength="195.2" clip-path="url(#terminal-line-2)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r3" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r1" x="0" y="93.2" textLength="195.2" clip-path="url(#terminal-line-3)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r3" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r8" x="12.2" y="117.6" textLength="85.4" clip-path="url(#terminal-line-4)">Blurred</text><text class="terminal-r7" x="97.6" y="117.6" textLength="97.6" clip-path="url(#terminal-line-4)">&#160;Button&#160;</text><text class="terminal-r3" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r6" x="0" y="142" textLength="195.2" clip-path="url(#terminal-line-5)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r3" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r9" x="0" y="166.4" textLength="207.4" clip-path="url(#terminal-line-6)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r3" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r11" x="12.2" y="190.8" textLength="97.6" clip-path="url(#terminal-line-7)">Disabled</text><text class="terminal-r10" x="109.8" y="190.8" textLength="97.6" clip-path="url(#terminal-line-7)">&#160;Button&#160;</text><text class="terminal-r3" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r12" x="0" y="215.2" textLength="207.4" clip-path="url(#terminal-line-8)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r3" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r3" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r3" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r3" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r3" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r3" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r3" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r3" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r3" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r3" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r3" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r3" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r3" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r3" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r3" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 13 KiB

134
tests/snapshot_tests/__snapshots__/test_snapshots/test_checkbox_example.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 41 KiB

228
tests/snapshot_tests/__snapshots__/test_snapshots/test_content_switcher_example_switch.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 75 KiB

After

Width:  |  Height:  |  Size: 71 KiB

118
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[border.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 20 KiB

114
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[border_all.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 32 KiB

114
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[margin.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 18 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[margin_all.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 64 KiB

118
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[max_width.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

116
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[offset.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 25 KiB

114
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[outline.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 16 KiB

114
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[outline_all.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 31 KiB

120
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[overflow.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 48 KiB

110
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[padding.py].svg
View File

@@ -19,131 +19,131 @@
font-weight: 700;
}
.terminal-1142797465-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-1142797465-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-1142797465-r1 { fill: #c5c8c6 }
.terminal-1142797465-r2 { fill: #0000ff }
.terminal-r1 { fill: #c5c8c6 }
.terminal-r2 { fill: #0000ff }
</style>
<defs>
<clipPath id="terminal-1142797465-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-1142797465-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1142797465-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-1142797465-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">PaddingApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">PaddingApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-1142797465-clip-terminal)">
<rect fill="#ccccff" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="99.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="99.1" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="292.8" y="99.1" width="683.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="123.5" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="123.5" width="292.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="390.4" y="123.5" width="585.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="147.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="147.9" width="683.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="780.8" y="147.9" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="172.3" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="341.6" y="172.3" width="634.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="196.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="196.7" width="585.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="683.2" y="196.7" width="292.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="221.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="221.1" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="878.4" y="221.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="245.5" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="245.5" width="61" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="158.6" y="245.5" width="817.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="269.9" width="719.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="817.4" y="269.9" width="158.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="294.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="294.3" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="183" y="294.3" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-1142797465-matrix">
<text class="terminal-1142797465-r1" x="976" y="20" textLength="12.2" clip-path="url(#terminal-1142797465-line-0)">
</text><text class="terminal-1142797465-r1" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-1142797465-line-1)">
</text><text class="terminal-1142797465-r1" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-1142797465-line-2)">
</text><text class="terminal-1142797465-r1" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-1142797465-line-3)">
</text><text class="terminal-1142797465-r2" x="97.6" y="117.6" textLength="195.2" clip-path="url(#terminal-1142797465-line-4)">I&#160;must&#160;not&#160;fear.</text><text class="terminal-1142797465-r1" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-1142797465-line-4)">
</text><text class="terminal-1142797465-r2" x="97.6" y="142" textLength="292.8" clip-path="url(#terminal-1142797465-line-5)">Fear&#160;is&#160;the&#160;mind-killer.</text><text class="terminal-1142797465-r1" x="976" y="142" textLength="12.2" clip-path="url(#terminal-1142797465-line-5)">
</text><text class="terminal-1142797465-r2" x="97.6" y="166.4" textLength="683.2" clip-path="url(#terminal-1142797465-line-6)">Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings&#160;total&#160;obliteration.</text><text class="terminal-1142797465-r1" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-1142797465-line-6)">
</text><text class="terminal-1142797465-r2" x="97.6" y="190.8" textLength="244" clip-path="url(#terminal-1142797465-line-7)">I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-1142797465-r1" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-1142797465-line-7)">
</text><text class="terminal-1142797465-r2" x="97.6" y="215.2" textLength="585.6" clip-path="url(#terminal-1142797465-line-8)">I&#160;will&#160;permit&#160;it&#160;to&#160;pass&#160;over&#160;me&#160;and&#160;through&#160;me.</text><text class="terminal-1142797465-r1" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-1142797465-line-8)">
</text><text class="terminal-1142797465-r2" x="97.6" y="239.6" textLength="780.8" clip-path="url(#terminal-1142797465-line-9)">And&#160;when&#160;it&#160;has&#160;gone&#160;past,&#160;I&#160;will&#160;turn&#160;the&#160;inner&#160;eye&#160;to&#160;see&#160;its&#160;</text><text class="terminal-1142797465-r1" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-1142797465-line-9)">
</text><text class="terminal-1142797465-r2" x="97.6" y="264" textLength="61" clip-path="url(#terminal-1142797465-line-10)">path.</text><text class="terminal-1142797465-r1" x="976" y="264" textLength="12.2" clip-path="url(#terminal-1142797465-line-10)">
</text><text class="terminal-1142797465-r2" x="97.6" y="288.4" textLength="719.8" clip-path="url(#terminal-1142797465-line-11)">Where&#160;the&#160;fear&#160;has&#160;gone&#160;there&#160;will&#160;be&#160;nothing.&#160;Only&#160;I&#160;will&#160;</text><text class="terminal-1142797465-r1" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-1142797465-line-11)">
</text><text class="terminal-1142797465-r2" x="97.6" y="312.8" textLength="85.4" clip-path="url(#terminal-1142797465-line-12)">remain.</text><text class="terminal-1142797465-r1" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-1142797465-line-12)">
</text><text class="terminal-1142797465-r1" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-1142797465-line-13)">
</text><text class="terminal-1142797465-r1" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-1142797465-line-14)">
</text><text class="terminal-1142797465-r1" x="976" y="386" textLength="12.2" clip-path="url(#terminal-1142797465-line-15)">
</text><text class="terminal-1142797465-r1" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-1142797465-line-16)">
</text><text class="terminal-1142797465-r1" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-1142797465-line-17)">
</text><text class="terminal-1142797465-r1" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-1142797465-line-18)">
</text><text class="terminal-1142797465-r1" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-1142797465-line-19)">
</text><text class="terminal-1142797465-r1" x="976" y="508" textLength="12.2" clip-path="url(#terminal-1142797465-line-20)">
</text><text class="terminal-1142797465-r1" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-1142797465-line-21)">
</text><text class="terminal-1142797465-r1" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-1142797465-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#ccccff" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="99.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="99.1" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="292.8" y="99.1" width="683.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="123.5" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="123.5" width="292.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="390.4" y="123.5" width="585.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="147.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="147.9" width="683.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="780.8" y="147.9" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="172.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="172.3" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="341.6" y="172.3" width="634.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="196.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="196.7" width="585.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="683.2" y="196.7" width="292.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="221.1" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="221.1" width="768.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="866.2" y="221.1" width="109.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="245.5" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="245.5" width="61" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="158.6" y="245.5" width="817.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="269.9" width="707.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="805.2" y="269.9" width="170.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="294.3" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="97.6" y="294.3" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="183" y="294.3" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ccccff" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#ffffff" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r1" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r1" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r1" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="97.6" y="117.6" textLength="195.2" clip-path="url(#terminal-line-4)">I&#160;must&#160;not&#160;fear.</text><text class="terminal-r1" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="97.6" y="142" textLength="292.8" clip-path="url(#terminal-line-5)">Fear&#160;is&#160;the&#160;mind-killer.</text><text class="terminal-r1" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="97.6" y="166.4" textLength="683.2" clip-path="url(#terminal-line-6)">Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings&#160;total&#160;obliteration.</text><text class="terminal-r1" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="97.6" y="190.8" textLength="244" clip-path="url(#terminal-line-7)">I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-r1" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="97.6" y="215.2" textLength="585.6" clip-path="url(#terminal-line-8)">I&#160;will&#160;permit&#160;it&#160;to&#160;pass&#160;over&#160;me&#160;and&#160;through&#160;me.</text><text class="terminal-r1" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="97.6" y="239.6" textLength="768.6" clip-path="url(#terminal-line-9)">And&#160;when&#160;it&#160;has&#160;gone&#160;past,&#160;I&#160;will&#160;turn&#160;the&#160;inner&#160;eye&#160;to&#160;see&#160;its</text><text class="terminal-r1" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="97.6" y="264" textLength="61" clip-path="url(#terminal-line-10)">path.</text><text class="terminal-r1" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r2" x="97.6" y="288.4" textLength="707.6" clip-path="url(#terminal-line-11)">Where&#160;the&#160;fear&#160;has&#160;gone&#160;there&#160;will&#160;be&#160;nothing.&#160;Only&#160;I&#160;will</text><text class="terminal-r1" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="97.6" y="312.8" textLength="85.4" clip-path="url(#terminal-line-12)">remain.</text><text class="terminal-r1" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r1" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r1" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r1" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r1" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r1" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r1" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r1" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r1" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r1" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r1" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

116
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[text_align.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 30 KiB

115
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[text_style.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 22 KiB

122
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[text_style_all.py].svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 44 KiB

110
tests/snapshot_tests/__snapshots__/test_snapshots/test_css_property[text_wrap.py].svg
View File

@@ -19,131 +19,131 @@
font-weight: 700;
}
.terminal-22760394-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-22760394-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-22760394-r1 { fill: #e0e0e0 }
.terminal-22760394-r2 { fill: #c5c8c6 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
</style>
<defs>
<clipPath id="terminal-22760394-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-22760394-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-22760394-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-22760394-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">WrapApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">WrapApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-22760394-clip-terminal)">
<rect fill="#0e0e41" x="0" y="1.5" width="963.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="963.8" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="25.9" width="488" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="488" y="25.9" width="488" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="318.7" width="475.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="475.8" y="318.7" width="500.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-22760394-matrix">
<text class="terminal-22760394-r1" x="0" y="20" textLength="963.8" clip-path="url(#terminal-22760394-line-0)">I&#160;must&#160;not&#160;fear.&#160;Fear&#160;is&#160;the&#160;mind-killer.&#160;Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings&#160;</text><text class="terminal-22760394-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-22760394-line-0)">
</text><text class="terminal-22760394-r1" x="0" y="44.4" textLength="488" clip-path="url(#terminal-22760394-line-1)">total&#160;obliteration.&#160;I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-22760394-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-22760394-line-1)">
</text><text class="terminal-22760394-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-22760394-line-2)">
</text><text class="terminal-22760394-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-22760394-line-3)">
</text><text class="terminal-22760394-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-22760394-line-4)">
</text><text class="terminal-22760394-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-22760394-line-5)">
</text><text class="terminal-22760394-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-22760394-line-6)">
</text><text class="terminal-22760394-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-22760394-line-7)">
</text><text class="terminal-22760394-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-22760394-line-8)">
</text><text class="terminal-22760394-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-22760394-line-9)">
</text><text class="terminal-22760394-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-22760394-line-10)">
</text><text class="terminal-22760394-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-22760394-line-11)">
</text><text class="terminal-22760394-r1" x="0" y="312.8" textLength="976" clip-path="url(#terminal-22760394-line-12)">I&#160;must&#160;not&#160;fear.&#160;Fear&#160;is&#160;the&#160;mind-killer.&#160;Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings&#160;t</text><text class="terminal-22760394-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-22760394-line-12)">
</text><text class="terminal-22760394-r1" x="0" y="337.2" textLength="475.8" clip-path="url(#terminal-22760394-line-13)">otal&#160;obliteration.&#160;I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-22760394-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-22760394-line-13)">
</text><text class="terminal-22760394-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-22760394-line-14)">
</text><text class="terminal-22760394-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-22760394-line-15)">
</text><text class="terminal-22760394-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-22760394-line-16)">
</text><text class="terminal-22760394-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-22760394-line-17)">
</text><text class="terminal-22760394-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-22760394-line-18)">
</text><text class="terminal-22760394-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-22760394-line-19)">
</text><text class="terminal-22760394-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-22760394-line-20)">
</text><text class="terminal-22760394-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-22760394-line-21)">
</text><text class="terminal-22760394-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-22760394-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#0e0e41" x="0" y="1.5" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="951.6" y="1.5" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="25.9" width="488" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="488" y="25.9" width="488" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="318.7" width="475.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="475.8" y="318.7" width="500.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="951.6" clip-path="url(#terminal-line-0)">I&#160;must&#160;not&#160;fear.&#160;Fear&#160;is&#160;the&#160;mind-killer.&#160;Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings</text><text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r1" x="0" y="44.4" textLength="488" clip-path="url(#terminal-line-1)">total&#160;obliteration.&#160;I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r1" x="0" y="312.8" textLength="976" clip-path="url(#terminal-line-12)">I&#160;must&#160;not&#160;fear.&#160;Fear&#160;is&#160;the&#160;mind-killer.&#160;Fear&#160;is&#160;the&#160;little-death&#160;that&#160;brings&#160;t</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r1" x="0" y="337.2" textLength="475.8" clip-path="url(#terminal-line-13)">otal&#160;obliteration.&#160;I&#160;will&#160;face&#160;my&#160;fear.</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 10 KiB

128
tests/snapshot_tests/__snapshots__/test_snapshots/test_disabled.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 18 KiB

116
tests/snapshot_tests/__snapshots__/test_snapshots/test_dock_layout_sidebar.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 22 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_dock_scroll_off_by_one.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 35 KiB

126
tests/snapshot_tests/__snapshots__/test_snapshots/test_example_five_by_five.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 47 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_example_markdown.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 28 KiB

120
tests/snapshot_tests/__snapshots__/test_snapshots/test_focus_within_transparent.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 33 KiB

120
tests/snapshot_tests/__snapshots__/test_snapshots/test_fr_unit_with_min.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 34 KiB

110
tests/snapshot_tests/__snapshots__/test_snapshots/test_horizontal_layout_width_auto_dock.svg
View File

@@ -19,131 +19,131 @@
font-weight: 700;
}
.terminal-1466751161-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-1466751161-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-1466751161-r1 { fill: #e0e0e0 }
.terminal-1466751161-r2 { fill: #c5c8c6 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
</style>
<defs>
<clipPath id="terminal-1466751161-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-1466751161-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-1466751161-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-1466751161-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">HorizontalAutoWidth</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">HorizontalAutoWidth</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-1466751161-clip-terminal)">
<rect fill="#1e90ff" x="0" y="1.5" width="61" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="1.5" width="536.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="1.5" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="25.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="24.4" y="25.9" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="25.9" width="268.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="329.4" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="427" y="25.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="451.4" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="463.6" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="561.2" y="25.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="585.6" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="25.9" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="50.3" width="61" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="50.3" width="536.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="50.3" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="12.2" y="74.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#c71585" x="36.6" y="74.7" width="158.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#c71585" x="195.2" y="74.7" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="280.6" y="74.7" width="317.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="74.7" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-1466751161-matrix">
<text class="terminal-1466751161-r1" x="0" y="20" textLength="61" clip-path="url(#terminal-1466751161-line-0)">Docke</text><text class="terminal-1466751161-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-1466751161-line-0)">
</text><text class="terminal-1466751161-r1" x="0" y="44.4" textLength="24.4" clip-path="url(#terminal-1466751161-line-1)">d&#160;</text><text class="terminal-1466751161-r1" x="329.4" y="44.4" textLength="97.6" clip-path="url(#terminal-1466751161-line-1)">Widget&#160;1</text><text class="terminal-1466751161-r1" x="463.6" y="44.4" textLength="97.6" clip-path="url(#terminal-1466751161-line-1)">Widget&#160;2</text><text class="terminal-1466751161-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-1466751161-line-1)">
</text><text class="terminal-1466751161-r1" x="0" y="68.8" textLength="61" clip-path="url(#terminal-1466751161-line-2)">left&#160;</text><text class="terminal-1466751161-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-1466751161-line-2)">
</text><text class="terminal-1466751161-r1" x="0" y="93.2" textLength="12.2" clip-path="url(#terminal-1466751161-line-3)">1</text><text class="terminal-1466751161-r1" x="36.6" y="93.2" textLength="158.6" clip-path="url(#terminal-1466751161-line-3)">Docked&#160;left&#160;2</text><text class="terminal-1466751161-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-1466751161-line-3)">
</text><text class="terminal-1466751161-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-1466751161-line-4)">
</text><text class="terminal-1466751161-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-1466751161-line-5)">
</text><text class="terminal-1466751161-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-1466751161-line-6)">
</text><text class="terminal-1466751161-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-1466751161-line-7)">
</text><text class="terminal-1466751161-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-1466751161-line-8)">
</text><text class="terminal-1466751161-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-1466751161-line-9)">
</text><text class="terminal-1466751161-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-1466751161-line-10)">
</text><text class="terminal-1466751161-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-1466751161-line-11)">
</text><text class="terminal-1466751161-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-1466751161-line-12)">
</text><text class="terminal-1466751161-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-1466751161-line-13)">
</text><text class="terminal-1466751161-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-1466751161-line-14)">
</text><text class="terminal-1466751161-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-1466751161-line-15)">
</text><text class="terminal-1466751161-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-1466751161-line-16)">
</text><text class="terminal-1466751161-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-1466751161-line-17)">
</text><text class="terminal-1466751161-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-1466751161-line-18)">
</text><text class="terminal-1466751161-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-1466751161-line-19)">
</text><text class="terminal-1466751161-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-1466751161-line-20)">
</text><text class="terminal-1466751161-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-1466751161-line-21)">
</text><text class="terminal-1466751161-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-1466751161-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#1e90ff" x="0" y="1.5" width="61" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="1.5" width="536.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="1.5" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="12.2" y="25.9" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="25.9" width="268.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="329.4" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="427" y="25.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="451.4" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="463.6" y="25.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#6b8e23" x="561.2" y="25.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="585.6" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="25.9" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="50.3" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="48.8" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="61" y="50.3" width="536.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="50.3" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="0" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e90ff" x="12.2" y="74.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#c71585" x="36.6" y="74.7" width="158.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#c71585" x="195.2" y="74.7" width="85.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#483d8b" x="280.6" y="74.7" width="317.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="74.7" width="378.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="61" clip-path="url(#terminal-line-0)">Docke</text><text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r1" x="0" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">d</text><text class="terminal-r1" x="329.4" y="44.4" textLength="97.6" clip-path="url(#terminal-line-1)">Widget&#160;1</text><text class="terminal-r1" x="463.6" y="44.4" textLength="97.6" clip-path="url(#terminal-line-1)">Widget&#160;2</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r1" x="0" y="68.8" textLength="48.8" clip-path="url(#terminal-line-2)">left</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r1" x="0" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">1</text><text class="terminal-r1" x="36.6" y="93.2" textLength="158.6" clip-path="url(#terminal-line-3)">Docked&#160;left&#160;2</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

112
tests/snapshot_tests/__snapshots__/test_snapshots/test_label_widths.svg
View File

@@ -19,132 +19,132 @@
font-weight: 700;
}
.terminal-2706293106-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-2706293106-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-2706293106-r1 { fill: #1f1f1f }
.terminal-2706293106-r2 { fill: #c5c8c6 }
.terminal-2706293106-r3 { fill: #00ff00 }
.terminal-r1 { fill: #1f1f1f }
.terminal-r2 { fill: #c5c8c6 }
.terminal-r3 { fill: #00ff00 }
</style>
<defs>
<clipPath id="terminal-2706293106-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-2706293106-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2706293106-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-2706293106-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">LabelWrap</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">LabelWrap</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-2706293106-clip-terminal)">
<rect fill="#e0e0e0" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="147.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="147.9" width="963.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="221.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="12.2" y="221.1" width="939.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="951.6" y="221.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="963.8" y="221.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="245.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="12.2" y="245.5" width="170.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="183" y="245.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="963.8" y="245.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="318.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="318.7" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="318.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="343.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="343.1" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="343.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="367.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="367.5" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="367.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="391.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="391.9" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="391.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-2706293106-matrix">
<text class="terminal-2706293106-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-2706293106-line-0)">
</text><text class="terminal-2706293106-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-2706293106-line-1)">
</text><text class="terminal-2706293106-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-2706293106-line-2)">
</text><text class="terminal-2706293106-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-2706293106-line-3)">
</text><text class="terminal-2706293106-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-2706293106-line-4)">
</text><text class="terminal-2706293106-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-2706293106-line-5)">
</text><text class="terminal-2706293106-r1" x="12.2" y="166.4" textLength="963.8" clip-path="url(#terminal-2706293106-line-6)">Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;Phoenix&#160;Ch</text><text class="terminal-2706293106-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-2706293106-line-6)">
</text><text class="terminal-2706293106-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-2706293106-line-7)">
</text><text class="terminal-2706293106-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-2706293106-line-8)">
</text><text class="terminal-2706293106-r1" x="12.2" y="239.6" textLength="939.4" clip-path="url(#terminal-2706293106-line-9)">Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;Phoenix&#160;</text><text class="terminal-2706293106-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-2706293106-line-9)">
</text><text class="terminal-2706293106-r1" x="12.2" y="264" textLength="170.8" clip-path="url(#terminal-2706293106-line-10)">Chimera&#160;Castle</text><text class="terminal-2706293106-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-2706293106-line-10)">
</text><text class="terminal-2706293106-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-2706293106-line-11)">
</text><text class="terminal-2706293106-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-2706293106-line-12)">
</text><text class="terminal-2706293106-r1" x="12.2" y="337.2" textLength="951.6" clip-path="url(#terminal-2706293106-line-13)">╭────────────────────────────────────────────────────────────────────────────╮</text><text class="terminal-2706293106-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-2706293106-line-13)">
</text><text class="terminal-2706293106-r1" x="12.2" y="361.6" textLength="951.6" clip-path="url(#terminal-2706293106-line-14)">│&#160;Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;&#160;&#160;&#160;&#160;&#160;&#160;│</text><text class="terminal-2706293106-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-2706293106-line-14)">
</text><text class="terminal-2706293106-r1" x="12.2" y="386" textLength="951.6" clip-path="url(#terminal-2706293106-line-15)">│&#160;Phoenix&#160;Chimera&#160;Castle&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;│</text><text class="terminal-2706293106-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-2706293106-line-15)">
</text><text class="terminal-2706293106-r1" x="12.2" y="410.4" textLength="951.6" clip-path="url(#terminal-2706293106-line-16)">╰────────────────────────────────────────────────────────────────────────────╯</text><text class="terminal-2706293106-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-2706293106-line-16)">
</text><text class="terminal-2706293106-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-2706293106-line-17)">
</text><text class="terminal-2706293106-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-2706293106-line-18)">
</text><text class="terminal-2706293106-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-2706293106-line-19)">
</text><text class="terminal-2706293106-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-2706293106-line-20)">
</text><text class="terminal-2706293106-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-2706293106-line-21)">
</text><text class="terminal-2706293106-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-2706293106-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#e0e0e0" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="147.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="147.9" width="963.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="221.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="12.2" y="221.1" width="927.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="939.4" y="221.1" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="963.8" y="221.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="245.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="12.2" y="245.5" width="170.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="183" y="245.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="963.8" y="245.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#90ee90" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="318.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="318.7" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="318.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="343.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="343.1" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="343.1" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="367.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="367.5" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="367.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="391.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="12.2" y="391.9" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="963.8" y="391.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#d3d3d3" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r1" x="12.2" y="166.4" textLength="963.8" clip-path="url(#terminal-line-6)">Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;Phoenix&#160;Ch</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r1" x="12.2" y="239.6" textLength="927.2" clip-path="url(#terminal-line-9)">Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;Phoenix</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r1" x="12.2" y="264" textLength="170.8" clip-path="url(#terminal-line-10)">Chimera&#160;Castle</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r1" x="12.2" y="337.2" textLength="951.6" clip-path="url(#terminal-line-13)">╭────────────────────────────────────────────────────────────────────────────╮</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r1" x="12.2" y="361.6" textLength="951.6" clip-path="url(#terminal-line-14)">│&#160;Apple&#160;Banana&#160;Cherry&#160;Mango&#160;Fig&#160;Guava&#160;Pineapple:Dragon&#160;Unicorn&#160;Centaur&#160;&#160;&#160;&#160;&#160;&#160;&#160;│</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r1" x="12.2" y="386" textLength="951.6" clip-path="url(#terminal-line-15)">│&#160;Phoenix&#160;Chimera&#160;Castle&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;│</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r1" x="12.2" y="410.4" textLength="951.6" clip-path="url(#terminal-line-16)">╰────────────────────────────────────────────────────────────────────────────╯</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 12 KiB

124
tests/snapshot_tests/__snapshots__/test_snapshots/test_loading_indicator.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 48 KiB

124
tests/snapshot_tests/__snapshots__/test_snapshots/test_loading_indicator_disables_widget.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 55 KiB

128
tests/snapshot_tests/__snapshots__/test_snapshots/test_markdown_component_classes_reloading.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 18 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_markdown_viewer_example.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 30 KiB

128
tests/snapshot_tests/__snapshots__/test_snapshots/test_modal_dialog_bindings_input.svg
View File

@@ -19,140 +19,140 @@
font-weight: 700;
}
.terminal-3964039014-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-3964039014-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-3964039014-r1 { fill: #e0e0e0 }
.terminal-3964039014-r2 { fill: #646464 }
.terminal-3964039014-r3 { fill: #c5c8c6 }
.terminal-3964039014-r4 { fill: #121212 }
.terminal-3964039014-r5 { fill: #191919 }
.terminal-3964039014-r6 { fill: #2d2d2d }
.terminal-3964039014-r7 { fill: #272727;font-weight: bold }
.terminal-3964039014-r8 { fill: #0d0d0d }
.terminal-3964039014-r9 { fill: #704d1c;font-weight: bold }
.terminal-3964039014-r10 { fill: #282b2e }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #646464 }
.terminal-r3 { fill: #c5c8c6 }
.terminal-r4 { fill: #121212 }
.terminal-r5 { fill: #191919 }
.terminal-r6 { fill: #2d2d2d }
.terminal-r7 { fill: #272727;font-weight: bold }
.terminal-r8 { fill: #0d0d0d }
.terminal-r9 { fill: #704d1c;font-weight: bold }
.terminal-r10 { fill: #282b2e }
</style>
<defs>
<clipPath id="terminal-3964039014-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-3964039014-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3964039014-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-3964039014-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">ModalApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">ModalApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-3964039014-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="73.2" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="85.4" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="97.6" y="1.5" width="756.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="854" y="1.5" width="122" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="25.9" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="50.3" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="36.6" y="50.3" width="902.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="939.4" y="50.3" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="74.7" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="99.1" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="99.1" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="123.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="73.2" y="123.5" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="122" y="123.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="123.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="147.9" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="147.9" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-3964039014-matrix">
<text class="terminal-3964039014-r1" x="0" y="20" textLength="73.2" clip-path="url(#terminal-3964039014-line-0)">Dialog</text><text class="terminal-3964039014-r2" x="97.6" y="20" textLength="756.4" clip-path="url(#terminal-3964039014-line-0)">&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ModalApp&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-3964039014-r3" x="976" y="20" textLength="12.2" clip-path="url(#terminal-3964039014-line-0)">
</text><text class="terminal-3964039014-r4" x="0" y="44.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-1)">▊</text><text class="terminal-3964039014-r5" x="12.2" y="44.4" textLength="951.6" clip-path="url(#terminal-3964039014-line-1)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-3964039014-r5" x="963.8" y="44.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-1)">▎</text><text class="terminal-3964039014-r3" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-1)">
</text><text class="terminal-3964039014-r4" x="0" y="68.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-2)">▊</text><text class="terminal-3964039014-r1" x="36.6" y="68.8" textLength="902.8" clip-path="url(#terminal-3964039014-line-2)">hi!&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-3964039014-r5" x="963.8" y="68.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-2)">▎</text><text class="terminal-3964039014-r3" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-2)">
</text><text class="terminal-3964039014-r4" x="0" y="93.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-3)">▊</text><text class="terminal-3964039014-r5" x="12.2" y="93.2" textLength="951.6" clip-path="url(#terminal-3964039014-line-3)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-3964039014-r5" x="963.8" y="93.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-3)">▎</text><text class="terminal-3964039014-r3" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-3)">
</text><text class="terminal-3964039014-r6" x="0" y="117.6" textLength="195.2" clip-path="url(#terminal-3964039014-line-4)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-3964039014-r3" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-3964039014-line-4)">
</text><text class="terminal-3964039014-r7" x="73.2" y="142" textLength="48.8" clip-path="url(#terminal-3964039014-line-5)">&#160;OK&#160;</text><text class="terminal-3964039014-r3" x="976" y="142" textLength="12.2" clip-path="url(#terminal-3964039014-line-5)">
</text><text class="terminal-3964039014-r8" x="0" y="166.4" textLength="195.2" clip-path="url(#terminal-3964039014-line-6)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-3964039014-r3" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-6)">
</text><text class="terminal-3964039014-r3" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-7)">
</text><text class="terminal-3964039014-r3" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-8)">
</text><text class="terminal-3964039014-r3" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-3964039014-line-9)">
</text><text class="terminal-3964039014-r3" x="976" y="264" textLength="12.2" clip-path="url(#terminal-3964039014-line-10)">
</text><text class="terminal-3964039014-r3" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-11)">
</text><text class="terminal-3964039014-r3" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-12)">
</text><text class="terminal-3964039014-r3" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-13)">
</text><text class="terminal-3964039014-r3" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-3964039014-line-14)">
</text><text class="terminal-3964039014-r3" x="976" y="386" textLength="12.2" clip-path="url(#terminal-3964039014-line-15)">
</text><text class="terminal-3964039014-r3" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-16)">
</text><text class="terminal-3964039014-r3" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-17)">
</text><text class="terminal-3964039014-r3" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-18)">
</text><text class="terminal-3964039014-r3" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-3964039014-line-19)">
</text><text class="terminal-3964039014-r3" x="976" y="508" textLength="12.2" clip-path="url(#terminal-3964039014-line-20)">
</text><text class="terminal-3964039014-r3" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-3964039014-line-21)">
</text><text class="terminal-3964039014-r3" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-3964039014-line-22)">
</text><text class="terminal-3964039014-r9" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-3964039014-line-23)">&#160;⏎&#160;</text><text class="terminal-3964039014-r2" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-3964039014-line-23)">Open&#160;Dialog&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-3964039014-r10" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-3964039014-line-23)">▏</text><text class="terminal-3964039014-r9" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-3964039014-line-23)">^p</text><text class="terminal-3964039014-r2" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-3964039014-line-23)">&#160;palette</text>
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="73.2" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="85.4" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="97.6" y="1.5" width="329.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="427" y="1.5" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="524.6" y="1.5" width="329.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="854" y="1.5" width="122" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="25.9" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="50.3" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="36.6" y="50.3" width="902.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="939.4" y="50.3" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191919" x="0" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#1e1e1e" x="12.2" y="74.7" width="951.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="963.8" y="74.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="99.1" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="99.1" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="123.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#e0e0e0" x="73.2" y="123.5" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="122" y="123.5" width="73.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="123.5" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="0" y="147.9" width="195.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="195.2" y="147.9" width="780.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#191d21" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="73.2" clip-path="url(#terminal-line-0)">Dialog</text><text class="terminal-r2" x="427" y="20" textLength="97.6" clip-path="url(#terminal-line-0)">ModalApp</text><text class="terminal-r3" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r4" x="0" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▊</text><text class="terminal-r5" x="12.2" y="44.4" textLength="951.6" clip-path="url(#terminal-line-1)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r5" x="963.8" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▎</text><text class="terminal-r3" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r4" x="0" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">▊</text><text class="terminal-r1" x="36.6" y="68.8" textLength="902.8" clip-path="url(#terminal-line-2)">hi!&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-r5" x="963.8" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">▎</text><text class="terminal-r3" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r4" x="0" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">▊</text><text class="terminal-r5" x="12.2" y="93.2" textLength="951.6" clip-path="url(#terminal-line-3)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r5" x="963.8" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">▎</text><text class="terminal-r3" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r6" x="0" y="117.6" textLength="195.2" clip-path="url(#terminal-line-4)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r3" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r7" x="73.2" y="142" textLength="48.8" clip-path="url(#terminal-line-5)">&#160;OK&#160;</text><text class="terminal-r3" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r8" x="0" y="166.4" textLength="195.2" clip-path="url(#terminal-line-6)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r3" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r3" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r3" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r3" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r3" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r3" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r3" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r3" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r3" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r3" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r3" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r3" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r3" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r3" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r3" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r3" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r3" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text><text class="terminal-r9" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-line-23)">&#160;⏎&#160;</text><text class="terminal-r2" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-line-23)">Open&#160;Dialog&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-r10" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-line-23)">▏</text><text class="terminal-r9" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-line-23)">^p</text><text class="terminal-r2" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-line-23)">&#160;palette</text>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 15 KiB

122
tests/snapshot_tests/__snapshots__/test_snapshots/test_notifications_example.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 20 KiB

110
tests/snapshot_tests/__snapshots__/test_snapshots/test_overflow.svg
View File

@@ -19,131 +19,131 @@
font-weight: 700;
}
.terminal-2934696095-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-2934696095-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-2934696095-r1 { fill: #e0e0e0 }
.terminal-2934696095-r2 { fill: #c5c8c6 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
</style>
<defs>
<clipPath id="terminal-2934696095-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-2934696095-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2934696095-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-2934696095-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">OverflowApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">OverflowApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-2934696095-clip-terminal)">
<rect fill="#0e0e41" x="0" y="1.5" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="48.8" y="1.5" width="927.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="50.3" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="48.8" y="50.3" width="927.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="99.1" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="48.8" y="99.1" width="927.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="391.9" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="244" y="391.9" width="732" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-2934696095-matrix">
<text class="terminal-2934696095-r1" x="0" y="20" textLength="48.8" clip-path="url(#terminal-2934696095-line-0)">FOO&#160;</text><text class="terminal-2934696095-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-2934696095-line-0)">
</text><text class="terminal-2934696095-r1" x="0" y="44.4" textLength="976" clip-path="url(#terminal-2934696095-line-1)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-2934696095-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-2934696095-line-1)">
</text><text class="terminal-2934696095-r1" x="0" y="68.8" textLength="48.8" clip-path="url(#terminal-2934696095-line-2)">FOO&#160;</text><text class="terminal-2934696095-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-2934696095-line-2)">
</text><text class="terminal-2934696095-r1" x="0" y="93.2" textLength="976" clip-path="url(#terminal-2934696095-line-3)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB…</text><text class="terminal-2934696095-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-2934696095-line-3)">
</text><text class="terminal-2934696095-r1" x="0" y="117.6" textLength="48.8" clip-path="url(#terminal-2934696095-line-4)">FOO&#160;</text><text class="terminal-2934696095-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-2934696095-line-4)">
</text><text class="terminal-2934696095-r1" x="0" y="142" textLength="976" clip-path="url(#terminal-2934696095-line-5)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-2934696095-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-2934696095-line-5)">
</text><text class="terminal-2934696095-r1" x="0" y="166.4" textLength="976" clip-path="url(#terminal-2934696095-line-6)">ZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB</text><text class="terminal-2934696095-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-2934696095-line-6)">
</text><text class="terminal-2934696095-r1" x="0" y="190.8" textLength="976" clip-path="url(#terminal-2934696095-line-7)">AZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBAR</text><text class="terminal-2934696095-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-2934696095-line-7)">
</text><text class="terminal-2934696095-r1" x="0" y="215.2" textLength="976" clip-path="url(#terminal-2934696095-line-8)">BAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBA</text><text class="terminal-2934696095-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-2934696095-line-8)">
</text><text class="terminal-2934696095-r1" x="0" y="239.6" textLength="976" clip-path="url(#terminal-2934696095-line-9)">RBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOB</text><text class="terminal-2934696095-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-2934696095-line-9)">
</text><text class="terminal-2934696095-r1" x="0" y="264" textLength="976" clip-path="url(#terminal-2934696095-line-10)">ARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOO</text><text class="terminal-2934696095-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-2934696095-line-10)">
</text><text class="terminal-2934696095-r1" x="0" y="288.4" textLength="976" clip-path="url(#terminal-2934696095-line-11)">BARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFO</text><text class="terminal-2934696095-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-2934696095-line-11)">
</text><text class="terminal-2934696095-r1" x="0" y="312.8" textLength="976" clip-path="url(#terminal-2934696095-line-12)">OBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZF</text><text class="terminal-2934696095-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-2934696095-line-12)">
</text><text class="terminal-2934696095-r1" x="0" y="337.2" textLength="976" clip-path="url(#terminal-2934696095-line-13)">OOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZ</text><text class="terminal-2934696095-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-2934696095-line-13)">
</text><text class="terminal-2934696095-r1" x="0" y="361.6" textLength="976" clip-path="url(#terminal-2934696095-line-14)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-2934696095-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-2934696095-line-14)">
</text><text class="terminal-2934696095-r1" x="0" y="386" textLength="976" clip-path="url(#terminal-2934696095-line-15)">ZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB</text><text class="terminal-2934696095-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-2934696095-line-15)">
</text><text class="terminal-2934696095-r1" x="0" y="410.4" textLength="244" clip-path="url(#terminal-2934696095-line-16)">AZFOOBARBAZFOOBARBAZ</text><text class="terminal-2934696095-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-2934696095-line-16)">
</text><text class="terminal-2934696095-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-2934696095-line-17)">
</text><text class="terminal-2934696095-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-2934696095-line-18)">
</text><text class="terminal-2934696095-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-2934696095-line-19)">
</text><text class="terminal-2934696095-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-2934696095-line-20)">
</text><text class="terminal-2934696095-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-2934696095-line-21)">
</text><text class="terminal-2934696095-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-2934696095-line-22)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#0e0e41" x="0" y="1.5" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="36.6" y="1.5" width="939.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e0e41" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="50.3" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="36.6" y="50.3" width="939.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#0e280e" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="99.1" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="36.6" y="99.1" width="939.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="0" y="391.9" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#410e0e" x="244" y="391.9" width="732" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="36.6" clip-path="url(#terminal-line-0)">FOO</text><text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r1" x="0" y="44.4" textLength="976" clip-path="url(#terminal-line-1)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r1" x="0" y="68.8" textLength="36.6" clip-path="url(#terminal-line-2)">FOO</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r1" x="0" y="93.2" textLength="976" clip-path="url(#terminal-line-3)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB…</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r1" x="0" y="117.6" textLength="36.6" clip-path="url(#terminal-line-4)">FOO</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r1" x="0" y="142" textLength="976" clip-path="url(#terminal-line-5)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r1" x="0" y="166.4" textLength="976" clip-path="url(#terminal-line-6)">ZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r1" x="0" y="190.8" textLength="976" clip-path="url(#terminal-line-7)">AZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBAR</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r1" x="0" y="215.2" textLength="976" clip-path="url(#terminal-line-8)">BAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBA</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r1" x="0" y="239.6" textLength="976" clip-path="url(#terminal-line-9)">RBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOB</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r1" x="0" y="264" textLength="976" clip-path="url(#terminal-line-10)">ARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOO</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r1" x="0" y="288.4" textLength="976" clip-path="url(#terminal-line-11)">BARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFO</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r1" x="0" y="312.8" textLength="976" clip-path="url(#terminal-line-12)">OBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZF</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r1" x="0" y="337.2" textLength="976" clip-path="url(#terminal-line-13)">OOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZ</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r1" x="0" y="361.6" textLength="976" clip-path="url(#terminal-line-14)">FOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBA</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r1" x="0" y="386" textLength="976" clip-path="url(#terminal-line-15)">ZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARBAZFOOBARB</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r1" x="0" y="410.4" textLength="244" clip-path="url(#terminal-line-16)">AZFOOBARBAZFOOBARBAZ</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

138
tests/snapshot_tests/__snapshots__/test_snapshots/test_placeholder_render.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 24 KiB

123
tests/snapshot_tests/__snapshots__/test_snapshots/test_progress_bar_completed_styled.svg
View File

@@ -19,137 +19,138 @@
font-weight: 700;
}
.terminal-487307658-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-487307658-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-487307658-r1 { fill: #e0e0e0 }
.terminal-487307658-r2 { fill: #c5c8c6 }
.terminal-487307658-r3 { fill: #b93c5b }
.terminal-487307658-r4 { fill: #004578 }
.terminal-487307658-r5 { fill: #e0e0e0;text-decoration: underline; }
.terminal-487307658-r6 { fill: #ffa62b;font-weight: bold }
.terminal-487307658-r7 { fill: #495259 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
.terminal-r3 { fill: #b93c5b }
.terminal-r4 { fill: #004578 }
.terminal-r5 { fill: #121212 }
.terminal-r6 { fill: #e0e0e0;text-decoration: underline; }
.terminal-r7 { fill: #ffa62b;font-weight: bold }
.terminal-r8 { fill: #495259 }
</style>
<defs>
<clipPath id="terminal-487307658-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-487307658-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-487307658-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-487307658-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-487307658-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="390.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="610" y="269.9" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-487307658-matrix">
<text class="terminal-487307658-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-487307658-line-0)">
</text><text class="terminal-487307658-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-487307658-line-1)">
</text><text class="terminal-487307658-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-487307658-line-2)">
</text><text class="terminal-487307658-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-487307658-line-3)">
</text><text class="terminal-487307658-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-487307658-line-4)">
</text><text class="terminal-487307658-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-487307658-line-5)">
</text><text class="terminal-487307658-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-487307658-line-6)">
</text><text class="terminal-487307658-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-487307658-line-7)">
</text><text class="terminal-487307658-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-487307658-line-8)">
</text><text class="terminal-487307658-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-487307658-line-9)">
</text><text class="terminal-487307658-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-487307658-line-10)">
</text><text class="terminal-487307658-r3" x="207.4" y="288.4" textLength="390.4" clip-path="url(#terminal-487307658-line-11)">━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━</text><text class="terminal-487307658-r4" x="610" y="288.4" textLength="48.8" clip-path="url(#terminal-487307658-line-11)">100%</text><text class="terminal-487307658-r5" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-487307658-line-11)">--:--:--</text><text class="terminal-487307658-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-487307658-line-11)">
</text><text class="terminal-487307658-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-487307658-line-12)">
</text><text class="terminal-487307658-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-487307658-line-13)">
</text><text class="terminal-487307658-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-487307658-line-14)">
</text><text class="terminal-487307658-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-487307658-line-15)">
</text><text class="terminal-487307658-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-487307658-line-16)">
</text><text class="terminal-487307658-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-487307658-line-17)">
</text><text class="terminal-487307658-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-487307658-line-18)">
</text><text class="terminal-487307658-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-487307658-line-19)">
</text><text class="terminal-487307658-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-487307658-line-20)">
</text><text class="terminal-487307658-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-487307658-line-21)">
</text><text class="terminal-487307658-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-487307658-line-22)">
</text><text class="terminal-487307658-r6" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-487307658-line-23)">&#160;s&#160;</text><text class="terminal-487307658-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-487307658-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-487307658-r7" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-487307658-line-23)">▏</text><text class="terminal-487307658-r6" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-487307658-line-23)">^p</text><text class="terminal-487307658-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-487307658-line-23)">&#160;palette</text>
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="390.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#004578" x="610" y="269.9" width="48.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r3" x="207.4" y="288.4" textLength="390.4" clip-path="url(#terminal-line-11)">━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━</text><text class="terminal-r5" x="610" y="288.4" textLength="48.8" clip-path="url(#terminal-line-11)">100%</text><text class="terminal-r6" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-line-11)">--:--:--</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text><text class="terminal-r7" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-line-23)">&#160;s&#160;</text><text class="terminal-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-r8" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-line-23)">▏</text><text class="terminal-r7" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-line-23)">^p</text><text class="terminal-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-line-23)">&#160;palette</text>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

125
tests/snapshot_tests/__snapshots__/test_snapshots/test_progress_bar_halfway_styled.svg
View File

@@ -19,138 +19,139 @@
font-weight: 700;
}
.terminal-3776117691-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-3776117691-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-3776117691-r1 { fill: #e0e0e0 }
.terminal-3776117691-r2 { fill: #c5c8c6 }
.terminal-3776117691-r3 { fill: #0178d4 }
.terminal-3776117691-r4 { fill: #0c304c }
.terminal-3776117691-r5 { fill: #004578 }
.terminal-3776117691-r6 { fill: #e0e0e0;text-decoration: underline; }
.terminal-3776117691-r7 { fill: #ffa62b;font-weight: bold }
.terminal-3776117691-r8 { fill: #495259 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
.terminal-r3 { fill: #0178d4 }
.terminal-r4 { fill: #0c304c }
.terminal-r5 { fill: #004578 }
.terminal-r6 { fill: #121212 }
.terminal-r7 { fill: #e0e0e0;text-decoration: underline; }
.terminal-r8 { fill: #ffa62b;font-weight: bold }
.terminal-r9 { fill: #495259 }
</style>
<defs>
<clipPath id="terminal-3776117691-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-3776117691-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-3776117691-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-3776117691-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-3776117691-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="146.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="353.8" y="269.9" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="269.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="622.2" y="269.9" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-3776117691-matrix">
<text class="terminal-3776117691-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-3776117691-line-0)">
</text><text class="terminal-3776117691-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-3776117691-line-1)">
</text><text class="terminal-3776117691-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-3776117691-line-2)">
</text><text class="terminal-3776117691-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-3776117691-line-3)">
</text><text class="terminal-3776117691-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-3776117691-line-4)">
</text><text class="terminal-3776117691-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-3776117691-line-5)">
</text><text class="terminal-3776117691-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-3776117691-line-6)">
</text><text class="terminal-3776117691-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-3776117691-line-7)">
</text><text class="terminal-3776117691-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-3776117691-line-8)">
</text><text class="terminal-3776117691-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-3776117691-line-9)">
</text><text class="terminal-3776117691-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-3776117691-line-10)">
</text><text class="terminal-3776117691-r3" x="207.4" y="288.4" textLength="146.4" clip-path="url(#terminal-3776117691-line-11)">━━━━━━━━━━━━</text><text class="terminal-3776117691-r4" x="353.8" y="288.4" textLength="244" clip-path="url(#terminal-3776117691-line-11)">╺━━━━━━━━━━━━━━━━━━━</text><text class="terminal-3776117691-r5" x="622.2" y="288.4" textLength="36.6" clip-path="url(#terminal-3776117691-line-11)">39%</text><text class="terminal-3776117691-r6" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-3776117691-line-11)">00:00:07</text><text class="terminal-3776117691-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-3776117691-line-11)">
</text><text class="terminal-3776117691-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-3776117691-line-12)">
</text><text class="terminal-3776117691-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-3776117691-line-13)">
</text><text class="terminal-3776117691-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-3776117691-line-14)">
</text><text class="terminal-3776117691-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-3776117691-line-15)">
</text><text class="terminal-3776117691-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-3776117691-line-16)">
</text><text class="terminal-3776117691-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-3776117691-line-17)">
</text><text class="terminal-3776117691-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-3776117691-line-18)">
</text><text class="terminal-3776117691-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-3776117691-line-19)">
</text><text class="terminal-3776117691-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-3776117691-line-20)">
</text><text class="terminal-3776117691-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-3776117691-line-21)">
</text><text class="terminal-3776117691-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-3776117691-line-22)">
</text><text class="terminal-3776117691-r7" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-3776117691-line-23)">&#160;s&#160;</text><text class="terminal-3776117691-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-3776117691-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-3776117691-r8" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-3776117691-line-23)">▏</text><text class="terminal-3776117691-r7" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-3776117691-line-23)">^p</text><text class="terminal-3776117691-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-3776117691-line-23)">&#160;palette</text>
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="146.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="353.8" y="269.9" width="244" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="269.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#004578" x="622.2" y="269.9" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r3" x="207.4" y="288.4" textLength="146.4" clip-path="url(#terminal-line-11)">━━━━━━━━━━━━</text><text class="terminal-r4" x="353.8" y="288.4" textLength="244" clip-path="url(#terminal-line-11)">╺━━━━━━━━━━━━━━━━━━━</text><text class="terminal-r6" x="622.2" y="288.4" textLength="36.6" clip-path="url(#terminal-line-11)">39%</text><text class="terminal-r7" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-line-11)">00:00:07</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text><text class="terminal-r8" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-line-23)">&#160;s&#160;</text><text class="terminal-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-r9" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-line-23)">▏</text><text class="terminal-r8" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-line-23)">^p</text><text class="terminal-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-line-23)">&#160;palette</text>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

123
tests/snapshot_tests/__snapshots__/test_snapshots/test_progress_bar_indeterminate_styled.svg
View File

@@ -19,137 +19,138 @@
font-weight: 700;
}
.terminal-2698181481-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-2698181481-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-2698181481-r1 { fill: #e0e0e0 }
.terminal-2698181481-r2 { fill: #c5c8c6 }
.terminal-2698181481-r3 { fill: #004578 }
.terminal-2698181481-r4 { fill: #0178d4 }
.terminal-2698181481-r5 { fill: #e0e0e0;text-decoration: underline; }
.terminal-2698181481-r6 { fill: #ffa62b;font-weight: bold }
.terminal-2698181481-r7 { fill: #495259 }
.terminal-r1 { fill: #e0e0e0 }
.terminal-r2 { fill: #c5c8c6 }
.terminal-r3 { fill: #004578 }
.terminal-r4 { fill: #0178d4 }
.terminal-r5 { fill: #121212 }
.terminal-r6 { fill: #e0e0e0;text-decoration: underline; }
.terminal-r7 { fill: #ffa62b;font-weight: bold }
.terminal-r8 { fill: #495259 }
</style>
<defs>
<clipPath id="terminal-2698181481-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-2698181481-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2698181481-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-2698181481-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">StyledProgressBar</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-2698181481-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="231.8" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="329.4" y="269.9" width="292.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="622.2" y="269.9" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-2698181481-matrix">
<text class="terminal-2698181481-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-2698181481-line-0)">
</text><text class="terminal-2698181481-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-2698181481-line-1)">
</text><text class="terminal-2698181481-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-2698181481-line-2)">
</text><text class="terminal-2698181481-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-2698181481-line-3)">
</text><text class="terminal-2698181481-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-2698181481-line-4)">
</text><text class="terminal-2698181481-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-2698181481-line-5)">
</text><text class="terminal-2698181481-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-2698181481-line-6)">
</text><text class="terminal-2698181481-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-2698181481-line-7)">
</text><text class="terminal-2698181481-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-2698181481-line-8)">
</text><text class="terminal-2698181481-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-2698181481-line-9)">
</text><text class="terminal-2698181481-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-2698181481-line-10)">
</text><text class="terminal-2698181481-r3" x="207.4" y="288.4" textLength="24.4" clip-path="url(#terminal-2698181481-line-11)">━╸</text><text class="terminal-2698181481-r4" x="231.8" y="288.4" textLength="97.6" clip-path="url(#terminal-2698181481-line-11)">━━━━━━━━</text><text class="terminal-2698181481-r3" x="329.4" y="288.4" textLength="292.8" clip-path="url(#terminal-2698181481-line-11)">╺━━━━━━━━━━━━━━━━━━━━━&#160;&#160;</text><text class="terminal-2698181481-r3" x="622.2" y="288.4" textLength="36.6" clip-path="url(#terminal-2698181481-line-11)">--%</text><text class="terminal-2698181481-r5" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-2698181481-line-11)">--:--:--</text><text class="terminal-2698181481-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-2698181481-line-11)">
</text><text class="terminal-2698181481-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-2698181481-line-12)">
</text><text class="terminal-2698181481-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-2698181481-line-13)">
</text><text class="terminal-2698181481-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-2698181481-line-14)">
</text><text class="terminal-2698181481-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-2698181481-line-15)">
</text><text class="terminal-2698181481-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-2698181481-line-16)">
</text><text class="terminal-2698181481-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-2698181481-line-17)">
</text><text class="terminal-2698181481-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-2698181481-line-18)">
</text><text class="terminal-2698181481-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-2698181481-line-19)">
</text><text class="terminal-2698181481-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-2698181481-line-20)">
</text><text class="terminal-2698181481-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-2698181481-line-21)">
</text><text class="terminal-2698181481-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-2698181481-line-22)">
</text><text class="terminal-2698181481-r6" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-2698181481-line-23)">&#160;s&#160;</text><text class="terminal-2698181481-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-2698181481-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-2698181481-r7" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-2698181481-line-23)">▏</text><text class="terminal-2698181481-r6" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-2698181481-line-23)">^p</text><text class="terminal-2698181481-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-2698181481-line-23)">&#160;palette</text>
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#121212" x="0" y="1.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="25.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="50.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="207.4" y="269.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="231.8" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="329.4" y="269.9" width="268.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="597.8" y="269.9" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#004578" x="622.2" y="269.9" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="658.8" y="269.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="671" y="269.9" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="768.6" y="269.9" width="207.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="0" y="562.7" width="36.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="562.7" width="793" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="829.6" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="841.8" y="562.7" width="24.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="866.2" y="562.7" width="97.6" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="963.8" y="562.7" width="12.2" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-matrix">
<text class="terminal-r2" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r2" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r2" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r2" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r2" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r2" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r2" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r2" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r2" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r2" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r2" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r3" x="207.4" y="288.4" textLength="24.4" clip-path="url(#terminal-line-11)">━╸</text><text class="terminal-r4" x="231.8" y="288.4" textLength="97.6" clip-path="url(#terminal-line-11)">━━━━━━━━</text><text class="terminal-r3" x="329.4" y="288.4" textLength="268.4" clip-path="url(#terminal-line-11)">╺━━━━━━━━━━━━━━━━━━━━━</text><text class="terminal-r5" x="622.2" y="288.4" textLength="36.6" clip-path="url(#terminal-line-11)">--%</text><text class="terminal-r6" x="671" y="288.4" textLength="97.6" clip-path="url(#terminal-line-11)">--:--:--</text><text class="terminal-r2" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r2" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r2" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r2" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r2" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r2" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r2" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r2" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r2" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r2" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r2" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r2" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text><text class="terminal-r7" x="0" y="581.2" textLength="36.6" clip-path="url(#terminal-line-23)">&#160;s&#160;</text><text class="terminal-r1" x="36.6" y="581.2" textLength="793" clip-path="url(#terminal-line-23)">Start&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</text><text class="terminal-r8" x="829.6" y="581.2" textLength="12.2" clip-path="url(#terminal-line-23)">▏</text><text class="terminal-r7" x="841.8" y="581.2" textLength="24.4" clip-path="url(#terminal-line-23)">^p</text><text class="terminal-r1" x="866.2" y="581.2" textLength="97.6" clip-path="url(#terminal-line-23)">&#160;palette</text>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 12 KiB

126
tests/snapshot_tests/__snapshots__/test_snapshots/test_radio_button_example.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 26 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_radio_set_example.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 42 KiB

126
tests/snapshot_tests/__snapshots__/test_snapshots/test_radio_set_is_scrollable.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 16 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_recompose_in_mount.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 16 KiB

132
tests/snapshot_tests/__snapshots__/test_snapshots/test_scroll_to.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 35 KiB

122
tests/snapshot_tests/__snapshots__/test_snapshots/test_select_expanded.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 23 KiB

122
tests/snapshot_tests/__snapshots__/test_snapshots/test_select_from_values_expanded.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 23 KiB

130
tests/snapshot_tests/__snapshots__/test_snapshots/test_selection_list_selected.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 32 KiB

126
tests/snapshot_tests/__snapshots__/test_snapshots/test_selection_list_selections.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 30 KiB

126
tests/snapshot_tests/__snapshots__/test_snapshots/test_selection_list_tuples.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 30 KiB

124
tests/snapshot_tests/__snapshots__/test_snapshots/test_switches.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 21 KiB

120
tests/snapshot_tests/__snapshots__/test_snapshots/test_textual_dev_border_preview.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 45 KiB

After

Width:  |  Height:  |  Size: 42 KiB

140
tests/snapshot_tests/__snapshots__/test_snapshots/test_textual_dev_easing_preview.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 42 KiB

124
tests/snapshot_tests/__snapshots__/test_snapshots/test_toggle_style_order.svg
View File

@@ -19,139 +19,139 @@
font-weight: 700;
}
.terminal-2591470392-matrix {
.terminal-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
.terminal-2591470392-title {
.terminal-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
.terminal-2591470392-r1 { fill: #121212 }
.terminal-2591470392-r2 { fill: #0178d4 }
.terminal-2591470392-r3 { fill: #e0e0e0 }
.terminal-2591470392-r4 { fill: #c5c8c6 }
.terminal-2591470392-r5 { fill: #242f38 }
.terminal-2591470392-r6 { fill: #000f18 }
.terminal-2591470392-r7 { fill: #f4005f;font-weight: bold }
.terminal-2591470392-r8 { fill: #80bbe9;font-weight: bold }
.terminal-2591470392-r9 { fill: #880909;font-weight: bold }
.terminal-2591470392-r10 { fill: #888888 }
.terminal-r1 { fill: #121212 }
.terminal-r2 { fill: #0178d4 }
.terminal-r3 { fill: #e0e0e0 }
.terminal-r4 { fill: #c5c8c6 }
.terminal-r5 { fill: #242f38 }
.terminal-r6 { fill: #000f18 }
.terminal-r7 { fill: #ff0000;font-weight: bold }
.terminal-r8 { fill: #80bbe9;font-weight: bold }
.terminal-r9 { fill: #880909;font-weight: bold }
.terminal-r10 { fill: #888888 }
</style>
<defs>
<clipPath id="terminal-2591470392-clip-terminal">
<clipPath id="terminal-clip-terminal">
<rect x="0" y="0" width="975.0" height="584.5999999999999" />
</clipPath>
<clipPath id="terminal-2591470392-line-0">
<clipPath id="terminal-line-0">
<rect x="0" y="1.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-1">
<clipPath id="terminal-line-1">
<rect x="0" y="25.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-2">
<clipPath id="terminal-line-2">
<rect x="0" y="50.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-3">
<clipPath id="terminal-line-3">
<rect x="0" y="74.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-4">
<clipPath id="terminal-line-4">
<rect x="0" y="99.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-5">
<clipPath id="terminal-line-5">
<rect x="0" y="123.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-6">
<clipPath id="terminal-line-6">
<rect x="0" y="147.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-7">
<clipPath id="terminal-line-7">
<rect x="0" y="172.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-8">
<clipPath id="terminal-line-8">
<rect x="0" y="196.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-9">
<clipPath id="terminal-line-9">
<rect x="0" y="221.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-10">
<clipPath id="terminal-line-10">
<rect x="0" y="245.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-11">
<clipPath id="terminal-line-11">
<rect x="0" y="269.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-12">
<clipPath id="terminal-line-12">
<rect x="0" y="294.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-13">
<clipPath id="terminal-line-13">
<rect x="0" y="318.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-14">
<clipPath id="terminal-line-14">
<rect x="0" y="343.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-15">
<clipPath id="terminal-line-15">
<rect x="0" y="367.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-16">
<clipPath id="terminal-line-16">
<rect x="0" y="391.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-17">
<clipPath id="terminal-line-17">
<rect x="0" y="416.3" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-18">
<clipPath id="terminal-line-18">
<rect x="0" y="440.7" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-19">
<clipPath id="terminal-line-19">
<rect x="0" y="465.1" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-20">
<clipPath id="terminal-line-20">
<rect x="0" y="489.5" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-21">
<clipPath id="terminal-line-21">
<rect x="0" y="513.9" width="976" height="24.65"/>
</clipPath>
<clipPath id="terminal-2591470392-line-22">
<clipPath id="terminal-line-22">
<rect x="0" y="538.3" width="976" height="24.65"/>
</clipPath>
</defs>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-2591470392-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">CheckboxApp</text>
<rect fill="#292929" stroke="rgba(255,255,255,0.35)" stroke-width="1" x="1" y="1" width="992" height="633.6" rx="8"/><text class="terminal-title" fill="#c5c8c6" text-anchor="middle" x="496" y="27">CheckboxApp</text>
<g transform="translate(26,22)">
<circle cx="0" cy="0" r="7" fill="#ff5f57"/>
<circle cx="22" cy="0" r="7" fill="#febc2e"/>
<circle cx="44" cy="0" r="7" fill="#28c840"/>
</g>
<g transform="translate(9, 41)" clip-path="url(#terminal-2591470392-clip-terminal)">
<g transform="translate(9, 41)" clip-path="url(#terminal-clip-terminal)">
<rect fill="#0178d4" x="0" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="12.2" y="1.5" width="353.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="366" y="1.5" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="378.2" y="1.5" width="597.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0178d4" x="0" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="12.2" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="24.4" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#242f38" x="36.6" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="48.8" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="61" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#0178d4" x="73.2" y="25.9" width="146.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#0178d4" x="219.6" y="25.9" width="134.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="353.8" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="366" y="25.9" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="378.2" y="25.9" width="597.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#0178d4" x="0" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#272727" x="12.2" y="50.3" width="353.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="366" y="50.3" width="12.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="378.2" y="50.3" width="597.8" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="74.7" width="146.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="146.4" y="74.7" width="134.2" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="280.6" y="74.7" width="695.4" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="99.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="123.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="147.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="172.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="196.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="221.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="245.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="269.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="294.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="318.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="343.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="367.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="391.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="416.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="440.7" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="465.1" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="489.5" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="513.9" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="538.3" width="976" height="24.65" shape-rendering="crispEdges"/><rect fill="#121212" x="0" y="562.7" width="976" height="24.65" shape-rendering="crispEdges"/>
<g class="terminal-2591470392-matrix">
<text class="terminal-2591470392-r1" x="0" y="20" textLength="12.2" clip-path="url(#terminal-2591470392-line-0)">▊</text><text class="terminal-2591470392-r2" x="12.2" y="20" textLength="353.8" clip-path="url(#terminal-2591470392-line-0)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-2591470392-r2" x="366" y="20" textLength="12.2" clip-path="url(#terminal-2591470392-line-0)">▎</text><text class="terminal-2591470392-r4" x="976" y="20" textLength="12.2" clip-path="url(#terminal-2591470392-line-0)">
</text><text class="terminal-2591470392-r1" x="0" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">▊</text><text class="terminal-2591470392-r5" x="24.4" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">▐</text><text class="terminal-2591470392-r6" x="36.6" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">X</text><text class="terminal-2591470392-r5" x="48.8" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">▌</text><text class="terminal-2591470392-r7" x="73.2" y="44.4" textLength="146.4" clip-path="url(#terminal-2591470392-line-1)">This&#160;is&#160;just</text><text class="terminal-2591470392-r8" x="219.6" y="44.4" textLength="134.2" clip-path="url(#terminal-2591470392-line-1)">&#160;some&#160;text.</text><text class="terminal-2591470392-r2" x="366" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">▎</text><text class="terminal-2591470392-r4" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-1)">
</text><text class="terminal-2591470392-r1" x="0" y="68.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-2)">▊</text><text class="terminal-2591470392-r2" x="12.2" y="68.8" textLength="353.8" clip-path="url(#terminal-2591470392-line-2)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-2591470392-r2" x="366" y="68.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-2)">▎</text><text class="terminal-2591470392-r4" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-2)">
</text><text class="terminal-2591470392-r9" x="0" y="93.2" textLength="146.4" clip-path="url(#terminal-2591470392-line-3)">This&#160;is&#160;just</text><text class="terminal-2591470392-r10" x="146.4" y="93.2" textLength="134.2" clip-path="url(#terminal-2591470392-line-3)">&#160;some&#160;text.</text><text class="terminal-2591470392-r4" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-2591470392-line-3)">
</text><text class="terminal-2591470392-r4" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-2591470392-line-4)">
</text><text class="terminal-2591470392-r4" x="976" y="142" textLength="12.2" clip-path="url(#terminal-2591470392-line-5)">
</text><text class="terminal-2591470392-r4" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-6)">
</text><text class="terminal-2591470392-r4" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-7)">
</text><text class="terminal-2591470392-r4" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-2591470392-line-8)">
</text><text class="terminal-2591470392-r4" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-2591470392-line-9)">
</text><text class="terminal-2591470392-r4" x="976" y="264" textLength="12.2" clip-path="url(#terminal-2591470392-line-10)">
</text><text class="terminal-2591470392-r4" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-11)">
</text><text class="terminal-2591470392-r4" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-12)">
</text><text class="terminal-2591470392-r4" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-2591470392-line-13)">
</text><text class="terminal-2591470392-r4" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-2591470392-line-14)">
</text><text class="terminal-2591470392-r4" x="976" y="386" textLength="12.2" clip-path="url(#terminal-2591470392-line-15)">
</text><text class="terminal-2591470392-r4" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-16)">
</text><text class="terminal-2591470392-r4" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-17)">
</text><text class="terminal-2591470392-r4" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-2591470392-line-18)">
</text><text class="terminal-2591470392-r4" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-2591470392-line-19)">
</text><text class="terminal-2591470392-r4" x="976" y="508" textLength="12.2" clip-path="url(#terminal-2591470392-line-20)">
</text><text class="terminal-2591470392-r4" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-2591470392-line-21)">
</text><text class="terminal-2591470392-r4" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-2591470392-line-22)">
<g class="terminal-matrix">
<text class="terminal-r1" x="0" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">▊</text><text class="terminal-r2" x="12.2" y="20" textLength="353.8" clip-path="url(#terminal-line-0)">▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔</text><text class="terminal-r2" x="366" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">▎</text><text class="terminal-r4" x="976" y="20" textLength="12.2" clip-path="url(#terminal-line-0)">
</text><text class="terminal-r1" x="0" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▊</text><text class="terminal-r5" x="24.4" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▐</text><text class="terminal-r6" x="36.6" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">X</text><text class="terminal-r5" x="48.8" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▌</text><text class="terminal-r7" x="73.2" y="44.4" textLength="146.4" clip-path="url(#terminal-line-1)">This&#160;is&#160;just</text><text class="terminal-r8" x="219.6" y="44.4" textLength="134.2" clip-path="url(#terminal-line-1)">&#160;some&#160;text.</text><text class="terminal-r2" x="366" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">▎</text><text class="terminal-r4" x="976" y="44.4" textLength="12.2" clip-path="url(#terminal-line-1)">
</text><text class="terminal-r1" x="0" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">▊</text><text class="terminal-r2" x="12.2" y="68.8" textLength="353.8" clip-path="url(#terminal-line-2)">▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁</text><text class="terminal-r2" x="366" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">▎</text><text class="terminal-r4" x="976" y="68.8" textLength="12.2" clip-path="url(#terminal-line-2)">
</text><text class="terminal-r9" x="0" y="93.2" textLength="146.4" clip-path="url(#terminal-line-3)">This&#160;is&#160;just</text><text class="terminal-r10" x="146.4" y="93.2" textLength="134.2" clip-path="url(#terminal-line-3)">&#160;some&#160;text.</text><text class="terminal-r4" x="976" y="93.2" textLength="12.2" clip-path="url(#terminal-line-3)">
</text><text class="terminal-r4" x="976" y="117.6" textLength="12.2" clip-path="url(#terminal-line-4)">
</text><text class="terminal-r4" x="976" y="142" textLength="12.2" clip-path="url(#terminal-line-5)">
</text><text class="terminal-r4" x="976" y="166.4" textLength="12.2" clip-path="url(#terminal-line-6)">
</text><text class="terminal-r4" x="976" y="190.8" textLength="12.2" clip-path="url(#terminal-line-7)">
</text><text class="terminal-r4" x="976" y="215.2" textLength="12.2" clip-path="url(#terminal-line-8)">
</text><text class="terminal-r4" x="976" y="239.6" textLength="12.2" clip-path="url(#terminal-line-9)">
</text><text class="terminal-r4" x="976" y="264" textLength="12.2" clip-path="url(#terminal-line-10)">
</text><text class="terminal-r4" x="976" y="288.4" textLength="12.2" clip-path="url(#terminal-line-11)">
</text><text class="terminal-r4" x="976" y="312.8" textLength="12.2" clip-path="url(#terminal-line-12)">
</text><text class="terminal-r4" x="976" y="337.2" textLength="12.2" clip-path="url(#terminal-line-13)">
</text><text class="terminal-r4" x="976" y="361.6" textLength="12.2" clip-path="url(#terminal-line-14)">
</text><text class="terminal-r4" x="976" y="386" textLength="12.2" clip-path="url(#terminal-line-15)">
</text><text class="terminal-r4" x="976" y="410.4" textLength="12.2" clip-path="url(#terminal-line-16)">
</text><text class="terminal-r4" x="976" y="434.8" textLength="12.2" clip-path="url(#terminal-line-17)">
</text><text class="terminal-r4" x="976" y="459.2" textLength="12.2" clip-path="url(#terminal-line-18)">
</text><text class="terminal-r4" x="976" y="483.6" textLength="12.2" clip-path="url(#terminal-line-19)">
</text><text class="terminal-r4" x="976" y="508" textLength="12.2" clip-path="url(#terminal-line-20)">
</text><text class="terminal-r4" x="976" y="532.4" textLength="12.2" clip-path="url(#terminal-line-21)">
</text><text class="terminal-r4" x="976" y="556.8" textLength="12.2" clip-path="url(#terminal-line-22)">
</text>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 13 KiB

216
tests/snapshot_tests/__snapshots__/test_snapshots/test_widgets_in_grid.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 93 KiB

After

Width:  |  Height:  |  Size: 86 KiB

31
tests/toggles/test_labels.py
View File

@@ -1,8 +1,7 @@
"""Test that setting a toggle button's label has the desired effect."""
from rich.text import Text
from textual.app import App, ComposeResult
from textual.content import Content
from textual.widgets import Checkbox, RadioButton, RadioSet
@@ -16,21 +15,21 @@ class LabelChangeApp(App[None]):
async def test_change_labels() -> None:
"""It should be possible to change the labels of toggle buttons."""
async with LabelChangeApp().run_test() as pilot:
assert pilot.app.query_one(Checkbox).label == Text("Before")
assert pilot.app.query_one("Screen > RadioButton", RadioButton).label == Text(
"Before"
)
assert pilot.app.query_one("RadioSet > RadioButton", RadioButton).label == Text(
"Before"
)
assert pilot.app.query_one(Checkbox).label == Content("Before")
assert pilot.app.query_one(
"Screen > RadioButton", RadioButton
).label == Content("Before")
assert pilot.app.query_one(
"RadioSet > RadioButton", RadioButton
).label == Content("Before")
pilot.app.query_one(Checkbox).label = "After"
pilot.app.query_one("Screen > RadioButton", RadioButton).label = "After"
pilot.app.query_one("RadioSet > RadioButton", RadioButton).label = "After"
await pilot.pause()
assert pilot.app.query_one(Checkbox).label == Text("After")
assert pilot.app.query_one("Screen > RadioButton", RadioButton).label == Text(
"After"
)
assert pilot.app.query_one("RadioSet > RadioButton", RadioButton).label == Text(
"After"
)
assert pilot.app.query_one(Checkbox).label == Content("After")
assert pilot.app.query_one(
"Screen > RadioButton", RadioButton
).label == Content("After")
assert pilot.app.query_one(
"RadioSet > RadioButton", RadioButton
).label == Content("After")