luciano/d2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactored exp(.svg & .pdf) files

Browse source
This commit is contained in:
melsonic 2025-03-18 23:03:35 +05:30
parent 32d69642b1
commit d141cf2079
No known key found for this signature in database
GPG key ID: DFA426742F621CD7
46 changed files with 61 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
d2renderers/d2sketch/testdata/twitter/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 222 KiB

After

Width:  |  Height:  |  Size: 222 KiB

2
d2renderers/d2sketch/testdata/twitter_dark/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 222 KiB

After

Width:  |  Height:  |  Size: 222 KiB

26
d2renderers/d2svg/d2svg.go
View file

@ -1366,14 +1366,24 @@ func drawShape(writer, appendixWriter io.Writer, diagramHash string, targetShape
tl := iconPosition.GetPointOnBox(box, label.PADDING, float64(iconSize), float64(iconSize))
fmt.Fprintf(writer, `<image href="%s" x="%f" y="%f" width="%d" height="%d" clip-path="inset(0 round %dpx)" />`,
html.EscapeString(targetShape.Icon.String()),
tl.X,
tl.Y,
iconSize,
iconSize,
targetShape.IconBorderRadius,
)
if targetShape.IconBorderRadius != 0 {
fmt.Fprintf(writer, `<image href="%s" x="%f" y="%f" width="%d" height="%d" clip-path="inset(0 round %dpx)" />`,
html.EscapeString(targetShape.Icon.String()),
tl.X,
tl.Y,
iconSize,
iconSize,
targetShape.IconBorderRadius,
)
} else {
fmt.Fprintf(writer, `<image href="%s" x="%f" y="%f" width="%d" height="%d" />`,
html.EscapeString(targetShape.Icon.String()),
tl.X,
tl.Y,
iconSize,
iconSize,
)
}
}
if targetShape.Label != "" && targetShape.Opacity != 0 {

2
d2renderers/d2svg/dark_theme/testdata/twitter/dark_theme.exp.svg vendored
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: 125 KiB

2
e2etests-cli/testdata/TestCLI_E2E/chain_icon_import.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-574527389 .color-AA4{color:#EDF0FD;}
.d2-574527389 .color-AA5{color:#F7F8FE;}
.d2-574527389 .color-AB4{color:#EDF0FD;}
.d2-574527389 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-574527389);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-574527389);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-574527389);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-574527389);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aGVsbG8= Ecs"><g class="shape" ><ellipse rx="67.000000" ry="67.000000" cx="67.000000" cy="67.000000" stroke="#0D32B2" fill="#F7F8FE" class="shape stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNzUgNzUiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDp1cmwoI09yYW5nZUdyYWRpZW50KTt9LmNscy0ye2ZpbGw6I2ZmZjt9PC9zdHlsZT48bGluZWFyR3JhZGllbnQgaWQ9Ik9yYW5nZUdyYWRpZW50IiB4MT0iMTU4LjA1IiB5MT0iLTExMy40MyIgeDI9IjE1OC4wNSIgeTI9IjM2LjU3IiBncmFkaWVudFRyYW5zZm9ybT0idHJhbnNsYXRlKDE3Ni40MyAxMjIuMDgpIHJvdGF0ZSgtMTM1KSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2M4NTExYiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2Y5MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjx0aXRsZT5BbWF6b24tRWxhc3RpYy1Db250YWluZXItU2VydmljZTwvdGl0bGU+PGcgaWQ9IlJlZmVyZW5jZSI+PHJlY3QgaWQ9Ik9yYW5nZV9HcmFkaWVudCIgZGF0YS1uYW1lPSJPcmFuZ2UgR3JhZGllbnQiIGNsYXNzPSJjbHMtMSIgd2lkdGg9Ijc1IiBoZWlnaHQ9Ijc1Ii8+PGcgaWQ9Ikljb25fVGVzdCIgZGF0YS1uYW1lPSJJY29uIFRlc3QiPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTM3LjI5LDY0LjQ0YTEsMSwwLDAsMS0uNTMtLjE0TDE0LDUxLjE4YTEuMDYsMS4wNiwwLDAsMS0uNTMtLjkyVjIzLjY4YTEuMDYsMS4wNiwwLDAsMSwuNTMtLjkyTDM0LjkzLDEwLjdhMSwxLDAsMCwxLDEuNTcuOVYyMy4xMUExLjA1LDEuMDUsMCwwLDEsMzYsMjRsLTEwLjQ3LDZWNDMuOTRsMTEuNzksNi44MSwxMC4zMS02YTEsMSwwLDAsMSwxLDBsOS45Miw1LjdhMS4wNiwxLjA2LDAsMCwxLC41My45MiwxLDEsMCwwLDEtLjUzLjkxbC0yMC43NSwxMkExLDEsMCwwLDEsMzcuMjksNjQuNDRaTTE1LjUsNDkuNTQsMzcuODMsNjIuNDMsNTcsNTEuMzVsLTgtNC42MUwzOC4zNyw1Mi44OGExLjExLDEuMTEsMCwwLDEtMS4wOSwwTDI0LDQ1LjIyYTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjI5LjQ2YTEsMSwwLDAsMSwuNTMtLjkxbDEwLjQ3LTZWMTMuMzdsLTE5LDExWiIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTYwLjQ0LDQ5YTEuMTMsMS4xMywwLDAsMS0uNTMtLjE0TDUwLDQzLjEzYTEsMSwwLDAsMS0uNTMtLjkxVjMwLjExTDM5LDI0LjA3YTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjExLjY1YTEsMSwwLDAsMSwuNTItLjksMSwxLDAsMCwxLDEsMEw2MSwyMi44MmExLjA1LDEuMDUsMCwwLDEsLjUzLjkxVjQ3LjlhMS4wNiwxLjA2LDAsMCwxLS41My45MkExLjEsMS4xLDAsMCwxLDYwLjQ0LDQ5Wk01MS41LDQxLjU1bDgsNC42VjI0LjRsLTE5LTExdjkuMTNMNTEsMjguNjFhMSwxLDAsMCwxLC41My45MVoiLz48L2c+PC9nPjwvc3ZnPg==" x="43.500000" y="43.500000" width="47" height="47" clip-path="inset(0 round 0px)" /><text x="67.000000" y="41.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-574527389" maskUnits="userSpaceOnUse" x="-101" y="-101" width="336" height="336">
.d2-574527389 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-574527389);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-574527389);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-574527389);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-574527389);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-574527389);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-574527389);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aGVsbG8= Ecs"><g class="shape" ><ellipse rx="67.000000" ry="67.000000" cx="67.000000" cy="67.000000" stroke="#0D32B2" fill="#F7F8FE" class="shape stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNzUgNzUiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDp1cmwoI09yYW5nZUdyYWRpZW50KTt9LmNscy0ye2ZpbGw6I2ZmZjt9PC9zdHlsZT48bGluZWFyR3JhZGllbnQgaWQ9Ik9yYW5nZUdyYWRpZW50IiB4MT0iMTU4LjA1IiB5MT0iLTExMy40MyIgeDI9IjE1OC4wNSIgeTI9IjM2LjU3IiBncmFkaWVudFRyYW5zZm9ybT0idHJhbnNsYXRlKDE3Ni40MyAxMjIuMDgpIHJvdGF0ZSgtMTM1KSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2M4NTExYiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2Y5MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjx0aXRsZT5BbWF6b24tRWxhc3RpYy1Db250YWluZXItU2VydmljZTwvdGl0bGU+PGcgaWQ9IlJlZmVyZW5jZSI+PHJlY3QgaWQ9Ik9yYW5nZV9HcmFkaWVudCIgZGF0YS1uYW1lPSJPcmFuZ2UgR3JhZGllbnQiIGNsYXNzPSJjbHMtMSIgd2lkdGg9Ijc1IiBoZWlnaHQ9Ijc1Ii8+PGcgaWQ9Ikljb25fVGVzdCIgZGF0YS1uYW1lPSJJY29uIFRlc3QiPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTM3LjI5LDY0LjQ0YTEsMSwwLDAsMS0uNTMtLjE0TDE0LDUxLjE4YTEuMDYsMS4wNiwwLDAsMS0uNTMtLjkyVjIzLjY4YTEuMDYsMS4wNiwwLDAsMSwuNTMtLjkyTDM0LjkzLDEwLjdhMSwxLDAsMCwxLDEuNTcuOVYyMy4xMUExLjA1LDEuMDUsMCwwLDEsMzYsMjRsLTEwLjQ3LDZWNDMuOTRsMTEuNzksNi44MSwxMC4zMS02YTEsMSwwLDAsMSwxLDBsOS45Miw1LjdhMS4wNiwxLjA2LDAsMCwxLC41My45MiwxLDEsMCwwLDEtLjUzLjkxbC0yMC43NSwxMkExLDEsMCwwLDEsMzcuMjksNjQuNDRaTTE1LjUsNDkuNTQsMzcuODMsNjIuNDMsNTcsNTEuMzVsLTgtNC42MUwzOC4zNyw1Mi44OGExLjExLDEuMTEsMCwwLDEtMS4wOSwwTDI0LDQ1LjIyYTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjI5LjQ2YTEsMSwwLDAsMSwuNTMtLjkxbDEwLjQ3LTZWMTMuMzdsLTE5LDExWiIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTYwLjQ0LDQ5YTEuMTMsMS4xMywwLDAsMS0uNTMtLjE0TDUwLDQzLjEzYTEsMSwwLDAsMS0uNTMtLjkxVjMwLjExTDM5LDI0LjA3YTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjExLjY1YTEsMSwwLDAsMSwuNTItLjksMSwxLDAsMCwxLDEsMEw2MSwyMi44MmExLjA1LDEuMDUsMCwwLDEsLjUzLjkxVjQ3LjlhMS4wNiwxLjA2LDAsMCwxLS41My45MkExLjEsMS4xLDAsMCwxLDYwLjQ0LDQ5Wk01MS41LDQxLjU1bDgsNC42VjI0LjRsLTE5LTExdjkuMTNMNTEsMjguNjFhMSwxLDAsMCwxLC41My45MVoiLz48L2c+PC9nPjwvc3ZnPg==" x="43.500000" y="43.500000" width="47" height="47" /><text x="67.000000" y="41.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-574527389" maskUnits="userSpaceOnUse" x="-101" y="-101" width="336" height="336">
<rect x="-101" y="-101" width="336" height="336" fill="white"></rect>
<rect x="49.500000" y="25.000000" width="35" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

2
e2etests-cli/testdata/TestCLI_E2E/import_icon_relative.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-3626184764 .color-AA4{color:#EDF0FD;}
.d2-3626184764 .color-AA5{color:#F7F8FE;}
.d2-3626184764 .color-AB4{color:#EDF0FD;}
.d2-3626184764 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3626184764);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3626184764);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3626184764);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3626184764);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eQ=="><g class="shape" ><rect x="0.000000" y="0.000000" width="80.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64," x="20.000000" y="26.000000" width="40" height="40" clip-path="inset(0 round 0px)" /><text x="40.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">y</text></g><g class="eg=="><g class="shape" ><rect x="140.000000" y="0.000000" width="78.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64," x="159.500000" y="26.500000" width="39" height="39" clip-path="inset(0 round 0px)" /><text x="179.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">z</text></g><mask id="d2-3626184764" maskUnits="userSpaceOnUse" x="-101" y="-101" width="420" height="294">
.d2-3626184764 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3626184764);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3626184764);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3626184764);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3626184764);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3626184764);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3626184764);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eQ=="><g class="shape" ><rect x="0.000000" y="0.000000" width="80.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64," x="20.000000" y="26.000000" width="40" height="40" /><text x="40.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">y</text></g><g class="eg=="><g class="shape" ><rect x="140.000000" y="0.000000" width="78.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64," x="159.500000" y="26.500000" width="39" height="39" /><text x="179.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">z</text></g><mask id="d2-3626184764" maskUnits="userSpaceOnUse" x="-101" y="-101" width="420" height="294">
<rect x="-101" y="-101" width="420" height="294" fill="white"></rect>
<rect x="35.500000" y="5.000000" width="9" height="21" fill="rgba(0,0,0,0.75)"></rect>
<rect x="175.500000" y="5.000000" width="7" height="21" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.5 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

BIN
e2etests-cli/testdata/TestCLI_E2E/internal_linked_pdf.exp.pdf vendored
View file

Binary file not shown.

BIN
e2etests-cli/testdata/TestCLI_E2E/no-nav-pdf.exp.pdf vendored
View file

Binary file not shown.

BIN
e2etests-cli/testdata/TestCLI_E2E/renamed-board.exp.pdf vendored
View file

Binary file not shown.

BIN
e2etests-cli/testdata/TestCLI_E2E/theme-pdf.exp.pdf vendored
View file

Binary file not shown.

2
e2etests/testdata/regression/dagre_disconnected_edge/dagre/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-3801862795 .color-AA4{color:#EDF0FD;}
.d2-3801862795 .color-AA5{color:#F7F8FE;}
.d2-3801862795 .color-AB4{color:#EDF0FD;}
.d2-3801862795 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3801862795);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3801862795);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3801862795);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3801862795);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="74.000000" y="0.000000" width="131.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="154.000000" y="-51.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><text x="139.500000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">program</text></g><g class="eQ=="><g class="shape" ><rect x="81.000000" y="192.000000" width="118.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="30.000000" y="215.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><text x="170.500000" y="274.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-3801862795-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 139.500000 94.000000 C 139.500000 132.000000 139.500000 152.000000 139.500000 188.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3801862795-3488378134)" mask="url(#d2-3801862795)" /></g><mask id="d2-3801862795" maskUnits="userSpaceOnUse" x="30" y="-51" width="176" height="336">
.d2-3801862795 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3801862795);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3801862795);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3801862795);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3801862795);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3801862795);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3801862795);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="74.000000" y="0.000000" width="131.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="154.000000" y="-51.000000" width="46" height="46" /><text x="139.500000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">program</text></g><g class="eQ=="><g class="shape" ><rect x="81.000000" y="192.000000" width="118.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="30.000000" y="215.000000" width="46" height="46" /><text x="170.500000" y="274.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-3801862795-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 139.500000 94.000000 C 139.500000 132.000000 139.500000 152.000000 139.500000 188.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3801862795-3488378134)" mask="url(#d2-3801862795)" /></g><mask id="d2-3801862795" maskUnits="userSpaceOnUse" x="30" y="-51" width="176" height="336">
<rect x="30" y="-51" width="176" height="336" fill="white"></rect>
<rect x="109.500000" y="5.000000" width="60" height="21" fill="rgba(0,0,0,0.75)"></rect>
<rect x="147.000000" y="258.000000" width="47" height="21" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

2
e2etests/testdata/regression/dagre_disconnected_edge/elk/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-3134052653 .color-AA4{color:#EDF0FD;}
.d2-3134052653 .color-AA5{color:#F7F8FE;}
.d2-3134052653 .color-AB4{color:#EDF0FD;}
.d2-3134052653 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3134052653);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3134052653);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3134052653);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3134052653);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="37.000000" y="76.000000" width="131.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="104.000000" y="12.000000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="102.500000" y="97.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">program</text></g><g class="eQ=="><g class="shape" ><rect x="76.000000" y="264.000000" width="118.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="12.000000" y="293.500000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="165.500000" y="372.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-3134052653-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 103.000000 196.000000 L 103.000000 260.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3134052653-3488378134)" mask="url(#d2-3134052653)" /></g><mask id="d2-3134052653" maskUnits="userSpaceOnUse" x="12" y="12" width="183" height="371">
.d2-3134052653 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3134052653);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3134052653);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3134052653);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3134052653);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3134052653);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3134052653);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="37.000000" y="76.000000" width="131.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="104.000000" y="12.000000" width="59" height="59" /><text x="102.500000" y="97.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">program</text></g><g class="eQ=="><g class="shape" ><rect x="76.000000" y="264.000000" width="118.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="12.000000" y="293.500000" width="59" height="59" /><text x="165.500000" y="372.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-3134052653-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 103.000000 196.000000 L 103.000000 260.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3134052653-3488378134)" mask="url(#d2-3134052653)" /></g><mask id="d2-3134052653" maskUnits="userSpaceOnUse" x="12" y="12" width="183" height="371">
<rect x="12" y="12" width="183" height="371" fill="white"></rect>
<rect x="72.500000" y="81.000000" width="60" height="21" fill="rgba(0,0,0,0.75)"></rect>
<rect x="142.000000" y="356.000000" width="47" height="21" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

2
e2etests/testdata/regression/elk_img_empty_label_panic/dagre/sketch.exp.svg vendored
View file

@ -82,7 +82,7 @@
.d2-590849029 .color-AA4{color:#EDF0FD;}
.d2-590849029 .color-AA5{color:#F7F8FE;}
.d2-590849029 .color-AB4{color:#EDF0FD;}
.d2-590849029 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-590849029);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-590849029);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-590849029);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-590849029);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aW1n"><g class="shape" ><clipPath id="d2-590849029-img-icon"><path d="M 0.000000 0.000000 L 0.000000 0.000000 S 0.000000 0.000000 0.000000 0.000000 L 128.000000 0.000000 L 128.000000 0.000000 S 128.000000 0.000000 128.000000 0.000000 L 128.000000 128.000000 S 128.000000 128.000000 128.000000 128.000000 L 0.000000 128.000000 S 0.000000 128.000000 0.000000 128.000000L 0.000000 0.000000Z 0.000000 0.000000" fill="none" /> </clipPath><image href="https://icons.terrastruct.com/infra/019-network.svg" x="0.000000" y="0.000000" width="128.000000" height="128.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" clip-path="url(#d2-590849029-img-icon)" /></g></g><g class="aWNv"><g class="shape" ><rect x="188.000000" y="14.000000" width="100.000000" height="100.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg" x="213.000000" y="39.000000" width="50" height="50" clip-path="inset(0 round 0px)" /></g><mask id="d2-590849029" maskUnits="userSpaceOnUse" x="-1" y="-1" width="290" height="130">
.d2-590849029 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-590849029);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-590849029);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-590849029);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-590849029);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-590849029);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-590849029);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aW1n"><g class="shape" ><clipPath id="d2-590849029-img-icon"><path d="M 0.000000 0.000000 L 0.000000 0.000000 S 0.000000 0.000000 0.000000 0.000000 L 128.000000 0.000000 L 128.000000 0.000000 S 128.000000 0.000000 128.000000 0.000000 L 128.000000 128.000000 S 128.000000 128.000000 128.000000 128.000000 L 0.000000 128.000000 S 0.000000 128.000000 0.000000 128.000000L 0.000000 0.000000Z 0.000000 0.000000" fill="none" /> </clipPath><image href="https://icons.terrastruct.com/infra/019-network.svg" x="0.000000" y="0.000000" width="128.000000" height="128.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" clip-path="url(#d2-590849029-img-icon)" /></g></g><g class="aWNv"><g class="shape" ><rect x="188.000000" y="14.000000" width="100.000000" height="100.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg" x="213.000000" y="39.000000" width="50" height="50" /></g><mask id="d2-590849029" maskUnits="userSpaceOnUse" x="-1" y="-1" width="290" height="130">
<rect x="-1" y="-1" width="290" height="130" fill="white"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.1 KiB

After

Width:  |  Height:  |  Size: 7.1 KiB

2
e2etests/testdata/regression/elk_img_empty_label_panic/elk/sketch.exp.svg vendored
View file

@ -82,7 +82,7 @@
.d2-316726530 .color-AA4{color:#EDF0FD;}
.d2-316726530 .color-AA5{color:#F7F8FE;}
.d2-316726530 .color-AB4{color:#EDF0FD;}
.d2-316726530 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-316726530);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-316726530);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-316726530);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-316726530);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aW1n"><g class="shape" ><clipPath id="d2-316726530-img-icon"><path d="M 12.000000 12.000000 L 12.000000 12.000000 S 12.000000 12.000000 12.000000 12.000000 L 140.000000 12.000000 L 140.000000 12.000000 S 140.000000 12.000000 140.000000 12.000000 L 140.000000 140.000000 S 140.000000 140.000000 140.000000 140.000000 L 12.000000 140.000000 S 12.000000 140.000000 12.000000 140.000000L 12.000000 12.000000Z 12.000000 12.000000" fill="none" /> </clipPath><image href="https://icons.terrastruct.com/infra/019-network.svg" x="12.000000" y="12.000000" width="128.000000" height="128.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" clip-path="url(#d2-316726530-img-icon)" /></g></g><g class="aWNv"><g class="shape" ><rect x="160.000000" y="26.000000" width="100.000000" height="100.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg" x="185.000000" y="51.000000" width="50" height="50" clip-path="inset(0 round 0px)" /></g><mask id="d2-316726530" maskUnits="userSpaceOnUse" x="11" y="11" width="250" height="130">
.d2-316726530 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-316726530);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-316726530);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-316726530);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-316726530);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-316726530);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-316726530);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="aW1n"><g class="shape" ><clipPath id="d2-316726530-img-icon"><path d="M 12.000000 12.000000 L 12.000000 12.000000 S 12.000000 12.000000 12.000000 12.000000 L 140.000000 12.000000 L 140.000000 12.000000 S 140.000000 12.000000 140.000000 12.000000 L 140.000000 140.000000 S 140.000000 140.000000 140.000000 140.000000 L 12.000000 140.000000 S 12.000000 140.000000 12.000000 140.000000L 12.000000 12.000000Z 12.000000 12.000000" fill="none" /> </clipPath><image href="https://icons.terrastruct.com/infra/019-network.svg" x="12.000000" y="12.000000" width="128.000000" height="128.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" clip-path="url(#d2-316726530-img-icon)" /></g></g><g class="aWNv"><g class="shape" ><rect x="160.000000" y="26.000000" width="100.000000" height="100.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg" x="185.000000" y="51.000000" width="50" height="50" /></g><mask id="d2-316726530" maskUnits="userSpaceOnUse" x="11" y="11" width="250" height="130">
<rect x="11" y="11" width="250" height="130" fill="white"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.1 KiB

After

Width:  |  Height:  |  Size: 7.1 KiB

2
e2etests/testdata/regression/query_param_escape/dagre/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-229682999 .color-AA4{color:#EDF0FD;}
.d2-229682999 .color-AA5{color:#F7F8FE;}
.d2-229682999 .color-AB4{color:#EDF0FD;}
.d2-229682999 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-229682999);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-229682999);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-229682999);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-229682999);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="bXkgbmV0d29yaw=="><g class="shape" ><rect x="0.000000" y="0.000000" width="156.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg?fuga=1&amp;hoge" x="55.000000" y="23.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><text x="78.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">my network</text></g><mask id="d2-229682999" maskUnits="userSpaceOnUse" x="-1" y="-1" width="158" height="94">
.d2-229682999 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-229682999);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-229682999);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-229682999);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-229682999);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-229682999);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-229682999);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="bXkgbmV0d29yaw=="><g class="shape" ><rect x="0.000000" y="0.000000" width="156.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg?fuga=1&amp;hoge" x="55.000000" y="23.000000" width="46" height="46" /><text x="78.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">my network</text></g><mask id="d2-229682999" maskUnits="userSpaceOnUse" x="-1" y="-1" width="158" height="94">
<rect x="-1" y="-1" width="158" height="94" fill="white"></rect>
<rect x="35.500000" y="5.000000" width="85" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.6 KiB

After

Width:  |  Height:  |  Size: 9.6 KiB

2
e2etests/testdata/regression/query_param_escape/elk/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-2311556588 .color-AA4{color:#EDF0FD;}
.d2-2311556588 .color-AA5{color:#F7F8FE;}
.d2-2311556588 .color-AB4{color:#EDF0FD;}
.d2-2311556588 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2311556588);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2311556588);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2311556588);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2311556588);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="bXkgbmV0d29yaw=="><g class="shape" ><rect x="12.000000" y="12.000000" width="156.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg?fuga=1&amp;hoge" x="60.500000" y="41.500000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="90.000000" y="33.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">my network</text></g><mask id="d2-2311556588" maskUnits="userSpaceOnUse" x="11" y="11" width="158" height="120">
.d2-2311556588 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2311556588);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2311556588);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2311556588);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2311556588);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2311556588);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2311556588);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="bXkgbmV0d29yaw=="><g class="shape" ><rect x="12.000000" y="12.000000" width="156.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/infra/019-network.svg?fuga=1&amp;hoge" x="60.500000" y="41.500000" width="59" height="59" /><text x="90.000000" y="33.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">my network</text></g><mask id="d2-2311556588" maskUnits="userSpaceOnUse" x="11" y="11" width="158" height="120">
<rect x="11" y="11" width="158" height="120" fill="white"></rect>
<rect x="47.500000" y="17.000000" width="85" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.7 KiB

After

Width:  |  Height:  |  Size: 9.7 KiB

2
e2etests/testdata/stable/dagger_grid/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

2
e2etests/testdata/stable/dagger_grid/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

2
e2etests/testdata/stable/dagre_spacing/dagre/sketch.exp.svg vendored
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: 35 KiB

2
e2etests/testdata/stable/dagre_spacing/elk/sketch.exp.svg vendored
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: 34 KiB

2
e2etests/testdata/stable/dagre_spacing_right/dagre/sketch.exp.svg vendored
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: 35 KiB

2
e2etests/testdata/stable/dagre_spacing_right/elk/sketch.exp.svg vendored
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: 34 KiB

2
e2etests/testdata/stable/grid_icon/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 26 KiB

2
e2etests/testdata/stable/grid_icon/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 26 KiB

2
e2etests/testdata/stable/grid_outside_labels/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

2
e2etests/testdata/stable/grid_outside_labels/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

2
e2etests/testdata/stable/icon-containers/dagre/sketch.exp.svg vendored
View file

@ -96,7 +96,7 @@
.d2-128916829 .color-AA4{color:#EDF0FD;}
.d2-128916829 .color-AA5{color:#F7F8FE;}
.d2-128916829 .color-AB4{color:#EDF0FD;}
.d2-128916829 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-128916829);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-128916829);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-128916829);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-128916829);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="dnBj"><g class="shape" ><rect x="0.000000" y="5.000000" width="320.000000" height="327.000000" stroke="green" fill="white" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2F_Group%20Icons%2FVirtual-private-cloud-VPC_light-bg.svg" x="-5.000000" y="-64.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="212.000000" y="-8.000000" fill="green" class="text" style="text-anchor:middle;font-size:28px">VPC 1 10.1.0.0./16</text></g><g class="dnBjLmF6"><g class="shape" ><rect x="20.000000" y="46.000000" width="280.000000" height="256.000000" stroke="blue" fill="white" style="stroke-width:2;stroke-dasharray:6.000000,5.919384;" /></g><text x="160.000000" y="34.000000" fill="blue" class="text" style="text-anchor:middle;font-size:24px">Availability Zone A</text></g><g class="dnBjLmF6LmZpcmV3YWxs"><g class="shape" ><rect x="50.000000" y="120.000000" width="220.000000" height="152.000000" stroke="purple" fill="#e1d5e7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FNetworking%20&amp;%20Content%20Delivery%2FAmazon-Route-53_Hosted-Zone_light-bg.svg" x="45.000000" y="51.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="192.500000" y="109.000000" fill="purple" class="text" style="text-anchor:middle;font-size:20px">Firewall Subnet A</text></g><g class="dnBjLmF6LmZpcmV3YWxsLmVjMg=="><g class="shape" ><rect x="80.000000" y="150.000000" width="160.000000" height="92.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FCompute%2F_Instance%2FAmazon-EC2_C4-Instance_light-bg.svg" x="137.000000" y="173.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><text x="160.000000" y="171.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">EC2 Instance</text></g><mask id="d2-128916829" maskUnits="userSpaceOnUse" x="-1" y="-64" width="322" height="397">
.d2-128916829 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-128916829);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-128916829);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-128916829);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-128916829);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-128916829);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-128916829);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="dnBj"><g class="shape" ><rect x="0.000000" y="5.000000" width="320.000000" height="327.000000" stroke="green" fill="white" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2F_Group%20Icons%2FVirtual-private-cloud-VPC_light-bg.svg" x="-5.000000" y="-64.000000" width="64" height="64" /><text x="212.000000" y="-8.000000" fill="green" class="text" style="text-anchor:middle;font-size:28px">VPC 1 10.1.0.0./16</text></g><g class="dnBjLmF6"><g class="shape" ><rect x="20.000000" y="46.000000" width="280.000000" height="256.000000" stroke="blue" fill="white" style="stroke-width:2;stroke-dasharray:6.000000,5.919384;" /></g><text x="160.000000" y="34.000000" fill="blue" class="text" style="text-anchor:middle;font-size:24px">Availability Zone A</text></g><g class="dnBjLmF6LmZpcmV3YWxs"><g class="shape" ><rect x="50.000000" y="120.000000" width="220.000000" height="152.000000" stroke="purple" fill="#e1d5e7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FNetworking%20&amp;%20Content%20Delivery%2FAmazon-Route-53_Hosted-Zone_light-bg.svg" x="45.000000" y="51.000000" width="64" height="64" /><text x="192.500000" y="109.000000" fill="purple" class="text" style="text-anchor:middle;font-size:20px">Firewall Subnet A</text></g><g class="dnBjLmF6LmZpcmV3YWxsLmVjMg=="><g class="shape" ><rect x="80.000000" y="150.000000" width="160.000000" height="92.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FCompute%2F_Instance%2FAmazon-EC2_C4-Instance_light-bg.svg" x="137.000000" y="173.000000" width="46" height="46" /><text x="160.000000" y="171.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">EC2 Instance</text></g><mask id="d2-128916829" maskUnits="userSpaceOnUse" x="-1" y="-64" width="322" height="397">
<rect x="-1" y="-64" width="322" height="397" fill="white"></rect>
<rect x="109.000000" y="-36.000000" width="206" height="36" fill="rgba(0,0,0,0.75)"></rect>
<rect x="67.500000" y="10.000000" width="185" height="31" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

2
e2etests/testdata/stable/icon-containers/elk/sketch.exp.svg vendored
View file

@ -96,7 +96,7 @@
.d2-2538888798 .color-AA4{color:#EDF0FD;}
.d2-2538888798 .color-AA5{color:#F7F8FE;}
.d2-2538888798 .color-AB4{color:#EDF0FD;}
.d2-2538888798 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2538888798);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2538888798);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2538888798);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2538888798);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="dnBj"><g class="shape" ><rect x="12.000000" y="12.000000" width="460.000000" height="466.000000" stroke="green" fill="white" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2F_Group%20Icons%2FVirtual-private-cloud-VPC_light-bg.svg" x="17.000000" y="17.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="364.000000" y="45.000000" fill="green" class="text" style="text-anchor:middle;font-size:28px">VPC 1 10.1.0.0./16</text></g><g class="dnBjLmF6"><g class="shape" ><rect x="62.000000" y="86.000000" width="360.000000" height="342.000000" stroke="blue" fill="white" style="stroke-width:2;stroke-dasharray:6.000000,5.919384;" /></g><text x="242.000000" y="115.000000" fill="blue" class="text" style="text-anchor:middle;font-size:24px">Availability Zone A</text></g><g class="dnBjLmF6LmZpcmV3YWxs"><g class="shape" ><rect x="112.000000" y="136.000000" width="260.000000" height="242.000000" stroke="purple" fill="#e1d5e7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FNetworking%20&amp;%20Content%20Delivery%2FAmazon-Route-53_Hosted-Zone_light-bg.svg" x="117.000000" y="141.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="294.500000" y="161.000000" fill="purple" class="text" style="text-anchor:middle;font-size:20px">Firewall Subnet A</text></g><g class="dnBjLmF6LmZpcmV3YWxsLmVjMg=="><g class="shape" ><rect x="162.000000" y="210.000000" width="160.000000" height="118.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FCompute%2F_Instance%2FAmazon-EC2_C4-Instance_light-bg.svg" x="212.500000" y="239.500000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="242.000000" y="231.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">EC2 Instance</text></g><mask id="d2-2538888798" maskUnits="userSpaceOnUse" x="11" y="11" width="462" height="468">
.d2-2538888798 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2538888798);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2538888798);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2538888798);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2538888798);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2538888798);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2538888798);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="dnBj"><g class="shape" ><rect x="12.000000" y="12.000000" width="460.000000" height="466.000000" stroke="green" fill="white" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2F_Group%20Icons%2FVirtual-private-cloud-VPC_light-bg.svg" x="17.000000" y="17.000000" width="64" height="64" /><text x="364.000000" y="45.000000" fill="green" class="text" style="text-anchor:middle;font-size:28px">VPC 1 10.1.0.0./16</text></g><g class="dnBjLmF6"><g class="shape" ><rect x="62.000000" y="86.000000" width="360.000000" height="342.000000" stroke="blue" fill="white" style="stroke-width:2;stroke-dasharray:6.000000,5.919384;" /></g><text x="242.000000" y="115.000000" fill="blue" class="text" style="text-anchor:middle;font-size:24px">Availability Zone A</text></g><g class="dnBjLmF6LmZpcmV3YWxs"><g class="shape" ><rect x="112.000000" y="136.000000" width="260.000000" height="242.000000" stroke="purple" fill="#e1d5e7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FNetworking%20&amp;%20Content%20Delivery%2FAmazon-Route-53_Hosted-Zone_light-bg.svg" x="117.000000" y="141.000000" width="64" height="64" /><text x="294.500000" y="161.000000" fill="purple" class="text" style="text-anchor:middle;font-size:20px">Firewall Subnet A</text></g><g class="dnBjLmF6LmZpcmV3YWxsLmVjMg=="><g class="shape" ><rect x="162.000000" y="210.000000" width="160.000000" height="118.000000" stroke="#0D32B2" fill="#FFFFFF" class=" stroke-B1 fill-N7" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/aws%2FCompute%2F_Instance%2FAmazon-EC2_C4-Instance_light-bg.svg" x="212.500000" y="239.500000" width="59" height="59" /><text x="242.000000" y="231.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">EC2 Instance</text></g><mask id="d2-2538888798" maskUnits="userSpaceOnUse" x="11" y="11" width="462" height="468">
<rect x="11" y="11" width="462" height="468" fill="white"></rect>
<rect x="261.000000" y="17.000000" width="206" height="36" fill="rgba(0,0,0,0.75)"></rect>
<rect x="149.500000" y="91.000000" width="185" height="31" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

2
e2etests/testdata/stable/icon-label/dagre/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-1121055843 .color-AA4{color:#EDF0FD;}
.d2-1121055843 .color-AA5{color:#F7F8FE;}
.d2-1121055843 .color-AB4{color:#EDF0FD;}
.d2-1121055843 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-1121055843);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-1121055843);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-1121055843);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-1121055843);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="d3c="><g class="shape" ><rect x="0.000000" y="0.000000" width="106.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/time.svg" x="30.000000" y="23.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><text x="53.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-1121055843" maskUnits="userSpaceOnUse" x="-1" y="-1" width="108" height="94">
.d2-1121055843 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-1121055843);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-1121055843);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-1121055843);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-1121055843);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-1121055843);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-1121055843);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="d3c="><g class="shape" ><rect x="0.000000" y="0.000000" width="106.000000" height="92.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/time.svg" x="30.000000" y="23.000000" width="46" height="46" /><text x="53.000000" y="21.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-1121055843" maskUnits="userSpaceOnUse" x="-1" y="-1" width="108" height="94">
<rect x="-1" y="-1" width="108" height="94" fill="white"></rect>
<rect x="35.500000" y="5.000000" width="35" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.2 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB

2
e2etests/testdata/stable/icon-label/elk/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-553243892 .color-AA4{color:#EDF0FD;}
.d2-553243892 .color-AA5{color:#F7F8FE;}
.d2-553243892 .color-AB4{color:#EDF0FD;}
.d2-553243892 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-553243892);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-553243892);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-553243892);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-553243892);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="d3c="><g class="shape" ><rect x="12.000000" y="12.000000" width="106.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/time.svg" x="38.500000" y="44.500000" width="53" height="53" clip-path="inset(0 round 0px)" /><text x="65.000000" y="33.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-553243892" maskUnits="userSpaceOnUse" x="11" y="11" width="108" height="120">
.d2-553243892 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-553243892);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-553243892);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-553243892);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-553243892);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-553243892);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-553243892);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="d3c="><g class="shape" ><rect x="12.000000" y="12.000000" width="106.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/time.svg" x="38.500000" y="44.500000" width="53" height="53" /><text x="65.000000" y="33.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-553243892" maskUnits="userSpaceOnUse" x="11" y="11" width="108" height="120">
<rect x="11" y="11" width="108" height="120" fill="white"></rect>
<rect x="47.500000" y="17.000000" width="35" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.1 KiB

After

Width:  |  Height:  |  Size: 9.1 KiB

2
e2etests/testdata/stable/icon_positions/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 78 KiB

2
e2etests/testdata/stable/icon_positions/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 78 KiB

2
e2etests/testdata/stable/investigate/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 49 KiB

2
e2etests/testdata/stable/investigate/elk/sketch.exp.svg vendored
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: 46 KiB

2
e2etests/testdata/stable/label-near/dagre/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-2112050560 .color-AA4{color:#EDF0FD;}
.d2-2112050560 .color-AA5{color:#F7F8FE;}
.d2-2112050560 .color-AB4{color:#EDF0FD;}
.d2-2112050560 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2112050560);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2112050560);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2112050560);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2112050560);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="0.000000" y="74.000000" width="123.000000" height="123.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="56.000000" y="7.000000" width="62" height="62" clip-path="inset(0 round 0px)" /><text x="61.500000" y="95.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">worker</text></g><g class="eQ=="><g class="shape" ><rect x="223.000000" y="74.000000" width="118.000000" height="123.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="252.500000" y="202.000000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="312.500000" y="187.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-2112050560-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 125.000000 151.000000 C 163.000000 151.000000 183.000000 151.000000 219.000000 151.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-2112050560-3488378134)" mask="url(#d2-2112050560)" /></g><mask id="d2-2112050560" maskUnits="userSpaceOnUse" x="-1" y="7" width="343" height="254">
.d2-2112050560 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2112050560);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2112050560);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2112050560);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2112050560);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2112050560);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2112050560);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="0.000000" y="74.000000" width="123.000000" height="123.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="56.000000" y="7.000000" width="62" height="62" /><text x="61.500000" y="95.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">worker</text></g><g class="eQ=="><g class="shape" ><rect x="223.000000" y="74.000000" width="118.000000" height="123.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="252.500000" y="202.000000" width="59" height="59" /><text x="312.500000" y="187.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-2112050560-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 125.000000 151.000000 C 163.000000 151.000000 183.000000 151.000000 219.000000 151.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-2112050560-3488378134)" mask="url(#d2-2112050560)" /></g><mask id="d2-2112050560" maskUnits="userSpaceOnUse" x="-1" y="7" width="343" height="254">
<rect x="-1" y="7" width="343" height="254" fill="white"></rect>
<rect x="35.500000" y="79.000000" width="52" height="21" fill="rgba(0,0,0,0.75)"></rect>
<rect x="289.000000" y="171.000000" width="47" height="21" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

2
e2etests/testdata/stable/label-near/elk/sketch.exp.svg vendored
View file

@ -89,7 +89,7 @@
.d2-4142095785 .color-AA4{color:#EDF0FD;}
.d2-4142095785 .color-AA5{color:#F7F8FE;}
.d2-4142095785 .color-AB4{color:#EDF0FD;}
.d2-4142095785 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-4142095785);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-4142095785);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-4142095785);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-4142095785);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="12.000000" y="76.000000" width="123.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="71.000000" y="12.000000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="73.500000" y="97.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">worker</text></g><g class="eQ=="><g class="shape" ><rect x="205.000000" y="12.000000" width="118.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="234.500000" y="135.000000" width="59" height="59" clip-path="inset(0 round 0px)" /><text x="294.500000" y="120.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-4142095785-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 137.000000 103.000000 L 201.000000 103.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-4142095785-3488378134)" mask="url(#d2-4142095785)" /></g><mask id="d2-4142095785" maskUnits="userSpaceOnUse" x="11" y="11" width="313" height="184">
.d2-4142095785 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-4142095785);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-4142095785);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-4142095785);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-4142095785);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-4142095785);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-4142095785);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="eA=="><g class="shape" ><rect x="12.000000" y="76.000000" width="123.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2F005-programmer.svg" x="71.000000" y="12.000000" width="59" height="59" /><text x="73.500000" y="97.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">worker</text></g><g class="eQ=="><g class="shape" ><rect x="205.000000" y="12.000000" width="118.000000" height="118.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials%2Fprofits.svg" x="234.500000" y="135.000000" width="59" height="59" /><text x="294.500000" y="120.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">profits</text></g><g class="KHggLSZndDsgeSlbMF0="><marker id="mk-d2-4142095785-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 137.000000 103.000000 L 201.000000 103.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-4142095785-3488378134)" mask="url(#d2-4142095785)" /></g><mask id="d2-4142095785" maskUnits="userSpaceOnUse" x="11" y="11" width="313" height="184">
<rect x="11" y="11" width="313" height="184" fill="white"></rect>
<rect x="47.500000" y="81.000000" width="52" height="21" fill="rgba(0,0,0,0.75)"></rect>
<rect x="271.000000" y="104.000000" width="47" height="21" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

2
e2etests/testdata/stable/label_positions/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 89 KiB

After

Width:  |  Height:  |  Size: 87 KiB

2
e2etests/testdata/stable/label_positions/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 89 KiB

After

Width:  |  Height:  |  Size: 87 KiB

2
e2etests/testdata/stable/overlapping_child_label/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 17 KiB

2
e2etests/testdata/stable/overlapping_child_label/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

4
e2etests/testdata/stable/teleport_grid/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 59 KiB

4
e2etests/testdata/stable/teleport_grid/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 59 KiB

2
e2etests/testdata/todo/container_icon_label/dagre/sketch.exp.svg vendored
View file

@ -96,7 +96,7 @@
.d2-3892451252 .color-AA4{color:#EDF0FD;}
.d2-3892451252 .color-AA5{color:#F7F8FE;}
.d2-3892451252 .color-AB4{color:#EDF0FD;}
.d2-3892451252 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3892451252);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3892451252);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3892451252);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3892451252);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><rect x="0.000000" y="29.000000" width="173.000000" height="549.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/004-picture.svg" x="-5.000000" y="-40.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="120.000000" y="16.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:30px">Big font</text></g><g class="YS5h"><g class="shape" ><rect x="30.000000" y="70.000000" width="113.000000" height="126.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="58.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:24px">a</text></g><g class="YS5i"><g class="shape" ><rect x="60.000000" y="316.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="354.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g class="YS5j"><g class="shape" ><rect x="60.000000" y="482.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="520.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g class="YS5hLmE="><g class="shape" ><rect x="60.000000" y="100.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="86.500000" y="138.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g class="YS4oYSAtJmd0OyBiKVswXQ=="><marker id="mk-d2-3892451252-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 86.500000 198.000000 C 86.500000 252.000000 86.500000 276.000000 86.500000 312.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3892451252-3488378134)" mask="url(#d2-3892451252)" /></g><g class="YS4oYiAtJmd0OyBjKVswXQ=="><path d="M 86.500000 384.000000 C 86.500000 422.000000 86.500000 442.000000 86.500000 478.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3892451252-3488378134)" mask="url(#d2-3892451252)" /></g><mask id="d2-3892451252" maskUnits="userSpaceOnUse" x="-1" y="-40" width="175" height="619">
.d2-3892451252 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3892451252);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3892451252);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3892451252);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3892451252);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3892451252);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3892451252);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><rect x="0.000000" y="29.000000" width="173.000000" height="549.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/004-picture.svg" x="-5.000000" y="-40.000000" width="64" height="64" /><text x="120.000000" y="16.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:30px">Big font</text></g><g class="YS5h"><g class="shape" ><rect x="30.000000" y="70.000000" width="113.000000" height="126.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="58.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:24px">a</text></g><g class="YS5i"><g class="shape" ><rect x="60.000000" y="316.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="354.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g class="YS5j"><g class="shape" ><rect x="60.000000" y="482.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="520.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g class="YS5hLmE="><g class="shape" ><rect x="60.000000" y="100.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="86.500000" y="138.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g class="YS4oYSAtJmd0OyBiKVswXQ=="><marker id="mk-d2-3892451252-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 86.500000 198.000000 C 86.500000 252.000000 86.500000 276.000000 86.500000 312.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3892451252-3488378134)" mask="url(#d2-3892451252)" /></g><g class="YS4oYiAtJmd0OyBjKVswXQ=="><path d="M 86.500000 384.000000 C 86.500000 422.000000 86.500000 442.000000 86.500000 478.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3892451252-3488378134)" mask="url(#d2-3892451252)" /></g><mask id="d2-3892451252" maskUnits="userSpaceOnUse" x="-1" y="-40" width="175" height="619">
<rect x="-1" y="-40" width="175" height="619" fill="white"></rect>
<rect x="72.000000" y="-14.000000" width="96" height="38" fill="rgba(0,0,0,0.75)"></rect>
<rect x="81.500000" y="34.000000" width="10" height="31" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

2
e2etests/testdata/todo/container_icon_label/elk/sketch.exp.svg vendored
View file

@ -96,7 +96,7 @@
.d2-3155979488 .color-AA4{color:#EDF0FD;}
.d2-3155979488 .color-AA5{color:#F7F8FE;}
.d2-3155979488 .color-AB4{color:#EDF0FD;}
.d2-3155979488 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3155979488);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3155979488);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3155979488);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3155979488);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><rect x="12.000000" y="12.000000" width="253.000000" height="562.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/004-picture.svg" x="17.000000" y="17.000000" width="64" height="64" clip-path="inset(0 round 0px)" /><text x="212.000000" y="47.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:30px">Big font</text></g><g class="YS5h"><g class="shape" ><rect x="62.000000" y="86.000000" width="153.000000" height="166.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="115.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:24px">a</text></g><g class="YS5i"><g class="shape" ><rect x="112.000000" y="322.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="360.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g class="YS5j"><g class="shape" ><rect x="112.000000" y="458.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="496.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g class="YS5hLmE="><g class="shape" ><rect x="112.000000" y="136.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="138.500000" y="174.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g class="YS4oYSAtJmd0OyBiKVswXQ=="><marker id="mk-d2-3155979488-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 138.500000 254.000000 L 138.500000 318.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3155979488-3488378134)" mask="url(#d2-3155979488)" /></g><g class="YS4oYiAtJmd0OyBjKVswXQ=="><path d="M 138.500000 390.000000 L 138.500000 454.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3155979488-3488378134)" mask="url(#d2-3155979488)" /></g><mask id="d2-3155979488" maskUnits="userSpaceOnUse" x="11" y="11" width="255" height="564">
.d2-3155979488 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-3155979488);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-3155979488);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-3155979488);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-3155979488);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-3155979488);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-3155979488);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><rect x="12.000000" y="12.000000" width="253.000000" height="562.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><image href="https://icons.terrastruct.com/essentials/004-picture.svg" x="17.000000" y="17.000000" width="64" height="64" /><text x="212.000000" y="47.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:30px">Big font</text></g><g class="YS5h"><g class="shape" ><rect x="62.000000" y="86.000000" width="153.000000" height="166.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="115.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:24px">a</text></g><g class="YS5i"><g class="shape" ><rect x="112.000000" y="322.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="360.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g class="YS5j"><g class="shape" ><rect x="112.000000" y="458.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#EDF0FD" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="138.500000" y="496.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g class="YS5hLmE="><g class="shape" ><rect x="112.000000" y="136.000000" width="53.000000" height="66.000000" stroke="#0D32B2" fill="#F7F8FE" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="138.500000" y="174.500000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g class="YS4oYSAtJmd0OyBiKVswXQ=="><marker id="mk-d2-3155979488-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 138.500000 254.000000 L 138.500000 318.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3155979488-3488378134)" mask="url(#d2-3155979488)" /></g><g class="YS4oYiAtJmd0OyBjKVswXQ=="><path d="M 138.500000 390.000000 L 138.500000 454.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3155979488-3488378134)" mask="url(#d2-3155979488)" /></g><mask id="d2-3155979488" maskUnits="userSpaceOnUse" x="11" y="11" width="255" height="564">
<rect x="11" y="11" width="255" height="564" fill="white"></rect>
<rect x="164.000000" y="17.000000" width="96" height="38" fill="rgba(0,0,0,0.75)"></rect>
<rect x="133.500000" y="91.000000" width="10" height="31" fill="rgba(0,0,0,0.75)"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

2
e2etests/testdata/txtar/sql-icon/dagre/sketch.exp.svg vendored
View file

@ -845,7 +845,7 @@
}
</style><g class="d2l0aG91dA=="><g class="shape" ><rect x="10.000000" y="-4.000000" width="1052.000000" height="198.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="536.000000" y="-17.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:28px">without</text></g><g class="d2l0aA=="><g class="shape" ><rect x="10.000000" y="314.000000" width="1052.000000" height="242.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="536.000000" y="301.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:28px">with</text></g><g class="d2l0aG91dC50YWJsZUV4"><g class="shape" ><rect x="40.000000" y="59.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="40.000000" y="59.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="50.000000" y="84.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="50.000000" y="118.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="78.000000" y="118.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="136.000000" y="118.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="40.000000" x2="146.000000" y1="131.000000" y2="131.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /></g></g><g class="d2l0aG91dC5jbGFzc0V4"><g class="shape" ><rect x="206.000000" y="26.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="206.000000" y="26.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="308.000000" y="76.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="216.000000" y="146.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="236.000000" y="146.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="390.000000" y="146.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="206.000000" x2="410.000000" y1="164.000000" y2="164.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /></g></g><g class="d2l0aG91dC5jb2RlRXg="><g class="shape" ></g><g transform="translate(470.000000 77.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(470.000000 77.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aG91dC5tZEV4"><g class="shape" ></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="604.000000" y="50.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
<p>You will live a long, healthy, happy life and make bags of money.</p>
</div></foreignObject></g></g><g class="d2l0aC50YWJsZUV4"><g class="shape" ><rect x="40.000000" y="421.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="40.000000" y="421.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="50.000000" y="446.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="50.000000" y="480.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="78.000000" y="480.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="136.000000" y="480.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="40.000000" x2="146.000000" y1="493.000000" y2="493.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="35.000000" y="380.000000" width="36" height="36" /></g></g><g class="d2l0aC5jbGFzc0V4"><g class="shape" ><rect x="206.000000" y="388.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="206.000000" y="388.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="308.000000" y="438.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="216.000000" y="508.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="236.000000" y="508.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="390.000000" y="508.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="206.000000" x2="410.000000" y1="526.000000" y2="526.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="201.000000" y="319.000000" width="64" height="64" /></g></g><g class="d2l0aC5jb2RlRXg="><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="465.000000" y="402.000000" width="32" height="32" clip-path="inset(0 round 0px)" /><g transform="translate(470.000000 439.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(470.000000 439.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aC5tZEV4"><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="599.000000" y="361.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="604.000000" y="412.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
</div></foreignObject></g></g><g class="d2l0aC50YWJsZUV4"><g class="shape" ><rect x="40.000000" y="421.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="40.000000" y="421.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="50.000000" y="446.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="50.000000" y="480.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="78.000000" y="480.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="136.000000" y="480.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="40.000000" x2="146.000000" y1="493.000000" y2="493.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="35.000000" y="380.000000" width="36" height="36" /></g></g><g class="d2l0aC5jbGFzc0V4"><g class="shape" ><rect x="206.000000" y="388.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="206.000000" y="388.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="308.000000" y="438.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="216.000000" y="508.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="236.000000" y="508.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="390.000000" y="508.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="206.000000" x2="410.000000" y1="526.000000" y2="526.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="201.000000" y="319.000000" width="64" height="64" /></g></g><g class="d2l0aC5jb2RlRXg="><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="465.000000" y="402.000000" width="32" height="32" /><g transform="translate(470.000000 439.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(470.000000 439.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aC5tZEV4"><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="599.000000" y="361.000000" width="46" height="46" /><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="604.000000" y="412.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
<p>You will live a long, healthy, happy life and make bags of money.</p>
</div></foreignObject></g></g><g class="KHdpdGhvdXQudGFibGVFeCAtJmd0OyB3aXRoLnRhYmxlRXgpWzBd"><marker id="mk-d2-826738456-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 93.000000 133.000000 C 93.000000 197.399994 93.000000 224.000000 93.000000 239.000000 C 93.000000 254.000000 93.000000 335.399994 93.000000 417.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-826738456-3488378134)" mask="url(#d2-826738456)" /></g><g class="KHdpdGhvdXQuY2xhc3NFeCAtJmd0OyB3aXRoLmNsYXNzRXgpWzBd"><path d="M 308.000000 166.000000 C 308.000000 204.000000 308.000000 224.000000 308.000000 239.000000 C 308.000000 254.000000 308.000000 328.799988 308.000000 384.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-826738456-3488378134)" mask="url(#d2-826738456)" /></g><g class="KHdpdGhvdXQuY29kZUV4IC0mZ3Q7IHdpdGguY29kZUV4KVswXQ=="><path d="M 507.000000 116.500000 C 507.000000 194.100006 507.000000 224.000000 507.000000 239.000000 C 507.000000 254.000000 507.000000 338.899994 507.000000 434.500000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-826738456-3488378134)" mask="url(#d2-826738456)" /></g><g class="KHdpdGhvdXQubWRFeCAtJmd0OyB3aXRoLm1kRXgpWzBd"><path d="M 818.000000 143.500000 C 818.000000 199.500000 818.000000 224.000000 818.000000 239.000000 C 818.000000 254.000000 818.000000 333.500000 818.000000 407.500000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-826738456-3488378134)" mask="url(#d2-826738456)" /></g><mask id="d2-826738456" maskUnits="userSpaceOnUse" x="9" y="-45" width="1054" height="602">
<rect x="9" y="-45" width="1054" height="602" fill="white"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 51 KiB

2
e2etests/testdata/txtar/sql-icon/elk/sketch.exp.svg vendored
View file

@ -845,7 +845,7 @@
}
</style><g class="d2l0aG91dA=="><g class="shape" ><rect x="12.000000" y="12.000000" width="972.000000" height="238.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="498.000000" y="45.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:28px">without</text></g><g class="d2l0aA=="><g class="shape" ><rect x="12.000000" y="330.000000" width="972.000000" height="307.000000" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="498.000000" y="363.000000" fill="#0A0F25" class="text fill-N1" style="text-anchor:middle;font-size:28px">with</text></g><g class="d2l0aG91dC50YWJsZUV4"><g class="shape" ><rect x="62.000000" y="128.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="62.000000" y="128.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="72.000000" y="153.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="72.000000" y="187.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="100.000000" y="187.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="158.000000" y="187.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="62.000000" x2="168.000000" y1="200.000000" y2="200.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /></g></g><g class="d2l0aG91dC5jbGFzc0V4"><g class="shape" ><rect x="188.000000" y="62.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="188.000000" y="62.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="290.000000" y="112.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="198.000000" y="182.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="218.000000" y="182.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="372.000000" y="182.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="188.000000" x2="392.000000" y1="200.000000" y2="200.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /></g></g><g class="d2l0aG91dC5jb2RlRXg="><g class="shape" ></g><g transform="translate(412.000000 163.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(412.000000 163.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aG91dC5tZEV4"><g class="shape" ></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="506.000000" y="109.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
<p>You will live a long, healthy, happy life and make bags of money.</p>
</div></foreignObject></g></g><g class="d2l0aC50YWJsZUV4"><g class="shape" ><rect x="62.000000" y="421.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="62.000000" y="421.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="72.000000" y="446.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="72.000000" y="480.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="100.000000" y="480.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="158.000000" y="480.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="62.000000" x2="168.000000" y1="493.000000" y2="493.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="57.000000" y="380.000000" width="36" height="36" /></g></g><g class="d2l0aC5jbGFzc0V4"><g class="shape" ><rect x="188.000000" y="449.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="188.000000" y="449.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="290.000000" y="499.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="198.000000" y="569.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="218.000000" y="569.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="372.000000" y="569.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="188.000000" x2="392.000000" y1="587.000000" y2="587.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="183.000000" y="380.000000" width="64" height="64" /></g></g><g class="d2l0aC5jb2RlRXg="><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="407.000000" y="380.000000" width="32" height="32" clip-path="inset(0 round 0px)" /><g transform="translate(412.000000 417.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(412.000000 417.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aC5tZEV4"><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="501.000000" y="380.000000" width="46" height="46" clip-path="inset(0 round 0px)" /><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="506.000000" y="431.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
</div></foreignObject></g></g><g class="d2l0aC50YWJsZUV4"><g class="shape" ><rect x="62.000000" y="421.000000" width="106.000000" height="72.000000" stroke="#0A0F25" fill="#FFFFFF" class="shape stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="62.000000" y="421.000000" width="106.000000" height="36.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="72.000000" y="446.750000" fill="#FFFFFF" class="text fill-N7" style="text-anchor:start;font-size:24px">tableEx</text><text x="72.000000" y="480.000000" fill="#0D32B2" class="text fill-B2" style="text-anchor:start;font-size:20px">a</text><text x="100.000000" y="480.000000" fill="#676C7E" class="text fill-N2" style="text-anchor:start;font-size:20px">b</text><text x="158.000000" y="480.000000" fill="#4A6FF3" class="text fill-AA2" style="text-anchor:end;font-size:20px" /><line x1="62.000000" x2="168.000000" y1="493.000000" y2="493.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:2" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="57.000000" y="380.000000" width="36" height="36" /></g></g><g class="d2l0aC5jbGFzc0V4"><g class="shape" ><rect x="188.000000" y="449.000000" width="204.000000" height="138.000000" stroke="#0A0F25" fill="#FFFFFF" class=" stroke-N1 fill-N7" style="stroke-width:2;" /><rect x="188.000000" y="449.000000" width="204.000000" height="92.000000" fill="#0A0F25" class="class_header fill-N1" /><text x="290.000000" y="499.500000" fill="#FFFFFF" class="text-mono fill-N7" style="text-anchor:middle;font-size:24px;">classEx</text><text x="198.000000" y="569.000000" fill="#0D32B2" class="text-mono fill-B2" style="text-anchor:start;font-size:20px">+</text><text x="218.000000" y="569.000000" fill="#0A0F25" class="text-mono fill-N1" style="text-anchor:start;font-size:20px">a</text><text x="372.000000" y="569.000000" fill="#4A6FF3" class="text-mono fill-AA2" style="text-anchor:end;font-size:20px">b</text><line x1="188.000000" x2="392.000000" y1="587.000000" y2="587.000000" stroke="#0A0F25" class=" stroke-N1" style="stroke-width:1" /><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="183.000000" y="380.000000" width="64" height="64" /></g></g><g class="d2l0aC5jb2RlRXg="><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="407.000000" y="380.000000" width="32" height="32" /><g transform="translate(412.000000 417.000000)" class="light-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#ffffff;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em">a&#160;<tspan fill="#000000" class="text-mono-bold">:=</tspan>&#160;<tspan fill="#009999">1</tspan></text></g></g><g transform="translate(412.000000 417.000000)" class="dark-code"><rect width="74.000000" height="37.000000" stroke="#0A0F25" class="shape stroke-N1" style="fill:#1e1e2e;stroke-width:2;" /><g transform="translate(8.000000 8.000000)"><text class="text-mono" x="0" y="1.000000em"><tspan fill="#cdd6f4">a</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#89dceb" class="text-mono-bold">:=</tspan><tspan fill="#cdd6f4">&#160;</tspan><tspan fill="#fab387">1</tspan></text></g></g></g><g class="d2l0aC5tZEV4"><g class="shape" ></g><image href="https://icons.terrastruct.com/essentials%2F213-alarm.svg" x="501.000000" y="380.000000" width="46" height="46" /><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="506.000000" y="431.000000" width="428" height="91"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="color:#0A0F25"><h1>This is for all ill-treated fellows</h1>
<p>You will live a long, healthy, happy life and make bags of money.</p>
</div></foreignObject></g></g><g class="KHdpdGhvdXQudGFibGVFeCAtJmd0OyB3aXRoLnRhYmxlRXgpWzBd"><marker id="mk-d2-3895587399-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" fill="#0D32B2" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 115.000000 202.000000 L 115.000000 417.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3895587399-3488378134)" mask="url(#d2-3895587399)" /></g><g class="KHdpdGhvdXQuY2xhc3NFeCAtJmd0OyB3aXRoLmNsYXNzRXgpWzBd"><path d="M 290.000000 202.000000 L 290.000000 445.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3895587399-3488378134)" mask="url(#d2-3895587399)" /></g><g class="KHdpdGhvdXQuY29kZUV4IC0mZ3Q7IHdpdGguY29kZUV4KVswXQ=="><path d="M 449.000000 202.000000 L 449.000000 413.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3895587399-3488378134)" mask="url(#d2-3895587399)" /></g><g class="KHdpdGhvdXQubWRFeCAtJmd0OyB3aXRoLm1kRXgpWzBd"><path d="M 720.000000 202.000000 L 720.000000 427.000000" stroke="#0D32B2" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-d2-3895587399-3488378134)" mask="url(#d2-3895587399)" /></g><mask id="d2-3895587399" maskUnits="userSpaceOnUse" x="11" y="11" width="974" height="627">
<rect x="11" y="11" width="974" height="627" fill="white"></rect>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 51 KiB