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

Merge pull request #1152 from gavin-ts/e2etest-multiboard-render

Browse source 
support animated multi-board rendering in e2etests
This commit is contained in:
gavin-ts 2023-04-10 14:22:10 -07:00 committed by GitHub
commit c3f681011b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 11997 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
d2renderers/d2svg/d2svg.go
View file

@ -2165,3 +2165,38 @@ func hash(s string) string {
h.Write([]byte(fmt.Sprintf("%s%s", s, secret)))
return fmt.Sprint(h.Sum32())
}
func RenderMultiboard(diagram *d2target.Diagram, opts *RenderOpts) ([][]byte, error) {
var boards [][]byte
for _, dl := range diagram.Layers {
childrenBoards, err := RenderMultiboard(dl, opts)
if err != nil {
return nil, err
}
boards = append(boards, childrenBoards...)
}
for _, dl := range diagram.Scenarios {
childrenBoards, err := RenderMultiboard(dl, opts)
if err != nil {
return nil, err
}
boards = append(boards, childrenBoards...)
}
for _, dl := range diagram.Steps {
childrenBoards, err := RenderMultiboard(dl, opts)
if err != nil {
return nil, err
}
boards = append(boards, childrenBoards...)
}
if !diagram.IsFolderOnly {
out, err := Render(diagram, opts)
if err != nil {
return boards, err
}
boards = append([][]byte{out}, boards...)
return boards, nil
}
return boards, nil
}

20
e2etests/e2e_test.go
View file

@ -25,6 +25,7 @@ import (
"oss.terrastruct.com/d2/d2layouts/d2sequence"
"oss.terrastruct.com/d2/d2lib"
"oss.terrastruct.com/d2/d2plugin"
"oss.terrastruct.com/d2/d2renderers/d2animate"
"oss.terrastruct.com/d2/d2renderers/d2svg"
"oss.terrastruct.com/d2/d2target"
"oss.terrastruct.com/d2/lib/log"
@ -205,11 +206,26 @@ func run(t *testing.T, tc testCase) {
dataPath := filepath.Join("testdata", strings.TrimPrefix(t.Name(), "TestE2E/"), layoutName)
pathGotSVG := filepath.Join(dataPath, "sketch.got.svg")
svgBytes, err := d2svg.Render(diagram, &d2svg.RenderOpts{
renderOpts := &d2svg.RenderOpts{
Pad: 0,
ThemeID: tc.themeID,
})
}
if len(diagram.Layers) > 0 || len(diagram.Scenarios) > 0 || len(diagram.Steps) > 0 {
masterID, err := diagram.HashID()
assert.Success(t, err)
renderOpts.MasterID = masterID
}
boards, err := d2svg.RenderMultiboard(diagram, renderOpts)
assert.Success(t, err)
var svgBytes []byte
if len(boards) == 1 {
svgBytes = boards[0]
} else {
svgBytes, err = d2animate.Wrap(diagram, boards, *renderOpts, 1000)
assert.Success(t, err)
}
err = os.MkdirAll(dataPath, 0755)
assert.Success(t, err)
err = ioutil.WriteFile(pathGotSVG, svgBytes, 0600)

1
e2etests/stable_test.go
View file

@ -2571,6 +2571,7 @@ scenarios: {
loadFromFile(t, "dagger_grid"),
loadFromFile(t, "grid_tests"),
loadFromFile(t, "executive_grid"),
loadFromFile(t, "grid_animated"),
}
runa(t, tcs)

53
e2etests/testdata/files/grid_animated.d2 vendored Normal file
View file

@ -0,0 +1,53 @@
gd: rows 2 columns 3 (<cap) {
grid-rows: 2
grid-columns: 3
a
}
steps: {
1: {
gd.b
}
2: {
gd.c
}
3: {
gd.d
}
4: {
gd.e
}
5: {
gd.f
gd: rows 2 columns 3 (=cap)
}
6: {
gd.style.opacity: 1
}
7: {
gd.style.opacity: 1
}
8: {
gd.g
gd: rows 2 columns 3 (>cap)
}
9: {
gd.h
}
10: {
gd.i
}
11: {
gd.j
}
12: {
gd.k
}
13: {
gd.l
}
14: {
gd.style.opacity: 1
}
}

139
e2etests/testdata/stable/complex-layers/dagre/sketch.exp.svg vendored
View file

@ -1,10 +1,17 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 394 68"><svg id="d2-svg" class="d2-1606881621" width="394" height="68" viewBox="-1 -1 394 68"><rect x="-1.000000" y="-1.000000" width="394.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 838 500"><svg id="d2-svg" width="838" height="500" viewBox="-1 -1 838 500"><style type="text/css"><![CDATA[
.d2-1606881621 .text {
font-family: "d2-1606881621-font-regular";
}
@font-face {
font-family: d2-1606881621-font-regular;
src: url("data:application/font-woff;base64,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");
}
.d2-1606881621 .text-bold {
font-family: "d2-1606881621-font-bold";
}
@font-face {
font-family: d2-1606881621-font-bold;
src: url("data:application/font-woff;base64,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");
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
@ -89,7 +96,131 @@
.d2-1606881621 .color-AA4{color:#EDF0FD;}
.d2-1606881621 .color-AA5{color:#F7F8FE;}
.d2-1606881621 .color-AB4{color:#EDF0FD;}
.d2-1606881621 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g id="window"><g class="shape" ><rect x="0.000000" y="0.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="5.000000" y="5.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="51.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="163.000000" y="0.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="200.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="298.000000" y="0.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="345.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><mask id="d2-1606881621" maskUnits="userSpaceOnUse" x="-1" y="-1" width="394" height="68">
.d2-1606881621 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css"><![CDATA[@keyframes d2Transition-d2-1606881621-0 {
0%, 0.000000% {
opacity: 0;
}
0.000000%, 9.990000% {
opacity: 1;
}
10.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-1 {
0%, 9.990000% {
opacity: 0;
}
10.000000%, 19.990000% {
opacity: 1;
}
20.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-2 {
0%, 19.990000% {
opacity: 0;
}
20.000000%, 29.990000% {
opacity: 1;
}
30.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-3 {
0%, 29.990000% {
opacity: 0;
}
30.000000%, 39.990000% {
opacity: 1;
}
40.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-4 {
0%, 39.990000% {
opacity: 0;
}
40.000000%, 49.990000% {
opacity: 1;
}
50.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-5 {
0%, 49.990000% {
opacity: 0;
}
50.000000%, 59.990000% {
opacity: 1;
}
60.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-6 {
0%, 59.990000% {
opacity: 0;
}
60.000000%, 69.990000% {
opacity: 1;
}
70.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-7 {
0%, 69.990000% {
opacity: 0;
}
70.000000%, 79.990000% {
opacity: 1;
}
80.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-8 {
0%, 79.990000% {
opacity: 0;
}
80.000000%, 89.990000% {
opacity: 1;
}
90.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1606881621-9 {
0%, 89.990000% {
opacity: 0;
}
90.000000%, 100.000000% {
opacity: 1;
}
}]]></style><g style="animation: d2Transition-d2-1606881621-0 10000ms infinite" class="d2-1606881621" width="394" height="68" viewBox="-1 -1 394 68"><rect x="-1.000000" y="-1.000000" width="394.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="window"><g class="shape" ><rect x="0.000000" y="0.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="5.000000" y="5.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="51.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="163.000000" y="0.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="200.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="298.000000" y="0.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="345.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><mask id="d2-1606881621" maskUnits="userSpaceOnUse" x="-1" y="-1" width="394" height="68">
<rect x="-1" y="-1" width="394" height="68" fill="white"></rect>
</mask></svg></svg>
</mask></g><g style="animation: d2Transition-d2-1606881621-1 10000ms infinite" class="d2-1606881621" width="231" height="68" viewBox="-1 -1 231 68"><rect x="-1.000000" y="-1.000000" width="231.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="blinds"><g class="shape" ><rect x="0.000000" y="0.000000" width="88.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="44.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">blinds</text></g><g id="glass"><g class="shape" ><rect x="148.000000" y="0.000000" width="81.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="188.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">glass</text></g><mask id="d2-1327917873" maskUnits="userSpaceOnUse" x="-1" y="-1" width="231" height="68">
<rect x="-1" y="-1" width="231" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-2 10000ms infinite" class="d2-1606881621" width="473" height="68" viewBox="-1 -1 473 68"><rect x="-1.000000" y="-1.000000" width="473.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="shingles"><g class="shape" ><rect x="0.000000" y="0.000000" width="104.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="52.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">shingles</text></g><g id="starlink"><g class="shape" ><rect x="164.000000" y="0.000000" width="101.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="214.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">starlink</text></g><g id="utility hookup"><g class="shape" ><rect x="325.000000" y="0.000000" width="146.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="398.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">utility hookup</text></g><mask id="d2-776641380" maskUnits="userSpaceOnUse" x="-1" y="-1" width="473" height="68">
<rect x="-1" y="-1" width="473" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-3 10000ms infinite" class="d2-1606881621" width="246" height="68" viewBox="-1 -1 246 68"><rect x="-1.000000" y="-1.000000" width="246.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="tools"><g class="shape" ><rect x="0.000000" y="0.000000" width="81.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="40.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">tools</text></g><g id="vehicles"><g class="shape" ><rect x="141.000000" y="0.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="192.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">vehicles</text></g><mask id="d2-3746301632" maskUnits="userSpaceOnUse" x="-1" y="-1" width="246" height="68">
<rect x="-1" y="-1" width="246" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-4 10000ms infinite" class="d2-1606881621" width="0" height="0" viewBox="0 0 0 0"><rect x="0.000000" y="0.000000" width="0.000000" height="0.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><mask id="d2-2621802722" maskUnits="userSpaceOnUse" x="0" y="0" width="0" height="0">
<rect x="0" y="0" width="0" height="0" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-5 10000ms infinite" class="d2-1606881621" width="363" height="167" viewBox="-1 0 363 167"><rect x="-1.000000" y="0.000000" width="363.000000" height="167.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="0.000000" y="41.000000" width="361.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="40.000000" y="70.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="95.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="210.000000" y="70.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="265.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><mask id="d2-1968702673" maskUnits="userSpaceOnUse" x="-1" y="0" width="363" height="167">
<rect x="-1" y="0" width="363" height="167" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-6 10000ms infinite" class="d2-1606881621" width="363" height="333" viewBox="-1 0 363 333"><rect x="-1.000000" y="0.000000" width="363.000000" height="333.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="0.000000" y="41.000000" width="361.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="196.000000" y="266.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="266.000000" y="304.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="40.000000" y="70.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="95.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="210.000000" y="70.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="265.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 265.500000 168.000000 C 265.500000 206.000000 265.500000 226.000000 265.500000 262.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-980170683)" /></g><mask id="d2-980170683" maskUnits="userSpaceOnUse" x="-1" y="0" width="363" height="333">
<rect x="-1" y="0" width="363" height="333" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-7 10000ms infinite" class="d2-1606881621" width="546" height="333" viewBox="-1 0 546 333"><rect x="-1.000000" y="0.000000" width="546.000000" height="333.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="0.000000" y="41.000000" width="361.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="196.000000" y="266.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="266.000000" y="304.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="obtain quotes"><g class="shape" ><rect x="401.000000" y="50.000000" width="143.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="472.500000" y="88.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">obtain quotes</text></g><g id="negotiate"><g class="shape" ><rect x="417.000000" y="266.000000" width="112.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="473.000000" y="304.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">negotiate</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="40.000000" y="70.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="95.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="210.000000" y="70.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="265.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 265.500000 168.000000 C 265.500000 206.000000 265.500000 226.000000 265.500000 262.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-3102257106)" /></g><g id="(obtain quotes -&gt; negotiate)[0]"><path d="M 472.500000 118.000000 C 472.500000 156.000000 472.500000 226.000000 472.500000 262.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-3102257106)" /></g><mask id="d2-3102257106" maskUnits="userSpaceOnUse" x="-1" y="0" width="546" height="333">
<rect x="-1" y="0" width="546" height="333" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-8 10000ms infinite" class="d2-1606881621" width="558" height="499" viewBox="-1 0 558 499"><rect x="-1.000000" y="0.000000" width="558.000000" height="499.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="0.000000" y="41.000000" width="361.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="196.000000" y="266.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="266.000000" y="304.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="obtain quotes"><g class="shape" ><rect x="401.000000" y="50.000000" width="143.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="472.500000" y="88.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">obtain quotes</text></g><g id="negotiate"><g class="shape" ><rect x="417.000000" y="266.000000" width="112.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="473.000000" y="304.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">negotiate</text></g><g id="book the best bid"><g class="shape" ><rect x="389.000000" y="432.000000" width="167.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="472.500000" y="470.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">book the best bid</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="40.000000" y="70.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="95.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="210.000000" y="70.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="265.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 265.500000 168.000000 C 265.500000 206.000000 265.500000 226.000000 265.500000 262.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-2818388967)" /></g><g id="(obtain quotes -&gt; negotiate)[0]"><path d="M 472.500000 118.000000 C 472.500000 156.000000 472.500000 226.000000 472.500000 262.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-2818388967)" /></g><g id="(negotiate -&gt; book the best bid)[0]"><path d="M 472.500000 334.000000 C 472.500000 372.000000 472.500000 392.000000 472.500000 428.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-2818388967)" /></g><mask id="d2-2818388967" maskUnits="userSpaceOnUse" x="-1" y="0" width="558" height="499">
<rect x="-1" y="0" width="558" height="499" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1606881621-9 10000ms infinite" class="d2-1606881621" width="838" height="68" viewBox="-1 -1 838 68"><rect x="-1.000000" y="-1.000000" width="838.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="window"><g class="shape" ><rect x="0.000000" y="0.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="5.000000" y="5.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="51.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="163.000000" y="0.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="200.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="298.000000" y="0.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="345.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><g id="water"><g class="shape" ><rect x="452.000000" y="0.000000" width="88.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="496.000000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">water</text></g><g id="rain"><g class="shape" ><rect x="600.000000" y="0.000000" width="73.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="636.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">rain</text></g><g id="thunder"><g class="shape" ><rect x="733.000000" y="0.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="784.500000" y="38.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">thunder</text></g><mask id="d2-2729558277" maskUnits="userSpaceOnUse" x="-1" y="-1" width="838" height="68">
<rect x="-1" y="-1" width="838" height="68" fill="white"></rect>
</mask></g></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 33 KiB

139
e2etests/testdata/stable/complex-layers/elk/sketch.exp.svg vendored
View file

@ -1,10 +1,17 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 314 68"><svg id="d2-svg" class="d2-1428720329" width="314" height="68" viewBox="11 11 314 68"><rect x="11.000000" y="11.000000" width="314.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 649 451"><svg id="d2-svg" width="649" height="451" viewBox="0 0 649 451"><style type="text/css"><![CDATA[
.d2-1428720329 .text {
font-family: "d2-1428720329-font-regular";
}
@font-face {
font-family: d2-1428720329-font-regular;
src: url("data:application/font-woff;base64,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");
}
.d2-1428720329 .text-bold {
font-family: "d2-1428720329-font-bold";
}
@font-face {
font-family: d2-1428720329-font-bold;
src: url("data:application/font-woff;base64,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");
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
@ -89,7 +96,131 @@
.d2-1428720329 .color-AA4{color:#EDF0FD;}
.d2-1428720329 .color-AA5{color:#F7F8FE;}
.d2-1428720329 .color-AB4{color:#EDF0FD;}
.d2-1428720329 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g id="window"><g class="shape" ><rect x="12.000000" y="12.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="17.000000" y="17.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="63.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="135.000000" y="12.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="172.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="230.000000" y="12.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="277.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><mask id="d2-1428720329" maskUnits="userSpaceOnUse" x="11" y="11" width="314" height="68">
.d2-1428720329 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css"><![CDATA[@keyframes d2Transition-d2-1428720329-0 {
0%, 0.000000% {
opacity: 0;
}
0.000000%, 9.990000% {
opacity: 1;
}
10.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-1 {
0%, 9.990000% {
opacity: 0;
}
10.000000%, 19.990000% {
opacity: 1;
}
20.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-2 {
0%, 19.990000% {
opacity: 0;
}
20.000000%, 29.990000% {
opacity: 1;
}
30.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-3 {
0%, 29.990000% {
opacity: 0;
}
30.000000%, 39.990000% {
opacity: 1;
}
40.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-4 {
0%, 39.990000% {
opacity: 0;
}
40.000000%, 49.990000% {
opacity: 1;
}
50.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-5 {
0%, 49.990000% {
opacity: 0;
}
50.000000%, 59.990000% {
opacity: 1;
}
60.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-6 {
0%, 59.990000% {
opacity: 0;
}
60.000000%, 69.990000% {
opacity: 1;
}
70.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-7 {
0%, 69.990000% {
opacity: 0;
}
70.000000%, 79.990000% {
opacity: 1;
}
80.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-8 {
0%, 79.990000% {
opacity: 0;
}
80.000000%, 89.990000% {
opacity: 1;
}
90.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1428720329-9 {
0%, 89.990000% {
opacity: 0;
}
90.000000%, 100.000000% {
opacity: 1;
}
}]]></style><g style="animation: d2Transition-d2-1428720329-0 10000ms infinite" class="d2-1428720329" width="314" height="68" viewBox="11 11 314 68"><rect x="11.000000" y="11.000000" width="314.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="window"><g class="shape" ><rect x="12.000000" y="12.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="17.000000" y="17.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="63.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="135.000000" y="12.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="172.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="230.000000" y="12.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="277.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><mask id="d2-1428720329" maskUnits="userSpaceOnUse" x="11" y="11" width="314" height="68">
<rect x="11" y="11" width="314" height="68" fill="white"></rect>
</mask></svg></svg>
</mask></g><g style="animation: d2Transition-d2-1428720329-1 10000ms infinite" class="d2-1428720329" width="191" height="68" viewBox="11 11 191 68"><rect x="11.000000" y="11.000000" width="191.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="blinds"><g class="shape" ><rect x="12.000000" y="12.000000" width="88.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="56.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">blinds</text></g><g id="glass"><g class="shape" ><rect x="120.000000" y="12.000000" width="81.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="160.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">glass</text></g><mask id="d2-176978712" maskUnits="userSpaceOnUse" x="11" y="11" width="191" height="68">
<rect x="11" y="11" width="191" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-2 10000ms infinite" class="d2-1428720329" width="393" height="68" viewBox="11 11 393 68"><rect x="11.000000" y="11.000000" width="393.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="shingles"><g class="shape" ><rect x="12.000000" y="12.000000" width="104.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="64.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">shingles</text></g><g id="starlink"><g class="shape" ><rect x="136.000000" y="12.000000" width="101.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="186.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">starlink</text></g><g id="utility hookup"><g class="shape" ><rect x="257.000000" y="12.000000" width="146.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="330.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">utility hookup</text></g><mask id="d2-3621630373" maskUnits="userSpaceOnUse" x="11" y="11" width="393" height="68">
<rect x="11" y="11" width="393" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-3 10000ms infinite" class="d2-1428720329" width="206" height="68" viewBox="11 11 206 68"><rect x="11.000000" y="11.000000" width="206.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="tools"><g class="shape" ><rect x="12.000000" y="12.000000" width="81.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="52.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">tools</text></g><g id="vehicles"><g class="shape" ><rect x="113.000000" y="12.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="164.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">vehicles</text></g><mask id="d2-3748577948" maskUnits="userSpaceOnUse" x="11" y="11" width="206" height="68">
<rect x="11" y="11" width="206" height="68" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-4 10000ms infinite" class="d2-1428720329" width="0" height="0" viewBox="0 0 0 0"><rect x="0.000000" y="0.000000" width="0.000000" height="0.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><mask id="d2-1598515741" maskUnits="userSpaceOnUse" x="0" y="0" width="0" height="0">
<rect x="0" y="0" width="0" height="0" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-5 10000ms infinite" class="d2-1428720329" width="343" height="168" viewBox="11 11 343 168"><rect x="11.000000" y="11.000000" width="343.000000" height="168.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="12.000000" y="12.000000" width="341.000000" height="166.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="182.500000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="62.000000" y="62.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="117.000000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="192.000000" y="62.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="247.500000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><mask id="d2-987832019" maskUnits="userSpaceOnUse" x="11" y="11" width="343" height="168">
<rect x="11" y="11" width="343" height="168" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-6 10000ms infinite" class="d2-1428720329" width="343" height="304" viewBox="11 11 343 304"><rect x="11.000000" y="11.000000" width="343.000000" height="304.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="12.000000" y="12.000000" width="341.000000" height="166.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="182.500000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="112.000000" y="248.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="182.000000" y="286.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="62.000000" y="62.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="117.000000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="192.000000" y="62.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="247.500000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 182.500000 180.000000 L 182.500000 244.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-2728054271)" /></g><mask id="d2-2728054271" maskUnits="userSpaceOnUse" x="11" y="11" width="343" height="304">
<rect x="11" y="11" width="343" height="304" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-7 10000ms infinite" class="d2-1428720329" width="506" height="304" viewBox="11 11 506 304"><rect x="11.000000" y="11.000000" width="506.000000" height="304.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="12.000000" y="12.000000" width="341.000000" height="166.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="182.500000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="112.000000" y="248.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="182.000000" y="286.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="obtain quotes"><g class="shape" ><rect x="373.000000" y="112.000000" width="143.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="444.500000" y="150.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">obtain quotes</text></g><g id="negotiate"><g class="shape" ><rect x="388.000000" y="248.000000" width="112.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="444.000000" y="286.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">negotiate</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="62.000000" y="62.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="117.000000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="192.000000" y="62.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="247.500000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 182.500000 180.000000 L 182.500000 244.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-1376554407)" /></g><g id="(obtain quotes -&gt; negotiate)[0]"><path d="M 444.500000 180.000000 L 444.500000 244.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-1376554407)" /></g><mask id="d2-1376554407" maskUnits="userSpaceOnUse" x="11" y="11" width="506" height="304">
<rect x="11" y="11" width="506" height="304" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-8 10000ms infinite" class="d2-1428720329" width="518" height="440" viewBox="11 11 518 440"><rect x="11.000000" y="11.000000" width="518.000000" height="440.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="find contractors"><g class="shape" ><rect x="12.000000" y="12.000000" width="341.000000" height="166.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="182.500000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">find contractors</text></g><g id="solicit quotes"><g class="shape" ><rect x="112.000000" y="248.000000" width="140.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="182.000000" y="286.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">solicit quotes</text></g><g id="obtain quotes"><g class="shape" ><rect x="373.000000" y="112.000000" width="143.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="444.500000" y="150.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">obtain quotes</text></g><g id="negotiate"><g class="shape" ><rect x="388.000000" y="248.000000" width="112.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="444.000000" y="286.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">negotiate</text></g><g id="book the best bid"><g class="shape" ><rect x="361.000000" y="384.000000" width="167.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="444.500000" y="422.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">book the best bid</text></g><g id="find contractors.craigslist"><g class="shape" ><rect x="62.000000" y="62.000000" width="110.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="117.000000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">craigslist</text></g><g id="find contractors.facebook"><g class="shape" ><rect x="192.000000" y="62.000000" width="111.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="247.500000" y="100.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">facebook</text></g><g id="(find contractors -&gt; solicit quotes)[0]"><marker id="mk-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" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 182.500000 180.000000 L 182.500000 244.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-3671290355)" /></g><g id="(obtain quotes -&gt; negotiate)[0]"><path d="M 444.500000 180.000000 L 444.500000 244.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-3671290355)" /></g><g id="(negotiate -&gt; book the best bid)[0]"><path d="M 444.500000 316.000000 L 444.500000 380.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#d2-3671290355)" /></g><mask id="d2-3671290355" maskUnits="userSpaceOnUse" x="11" y="11" width="518" height="440">
<rect x="11" y="11" width="518" height="440" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1428720329-9 10000ms infinite" class="d2-1428720329" width="638" height="68" viewBox="11 11 638 68"><rect x="11.000000" y="11.000000" width="638.000000" height="68.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="window"><g class="shape" ><rect x="12.000000" y="12.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /><rect x="17.000000" y="17.000000" width="93.000000" height="56.000000" fill="transparent" class=" stroke-B1" style="stroke-width:2;" /></g><text x="63.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">window</text></g><g id="roof"><g class="shape" ><rect x="135.000000" y="12.000000" width="75.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="172.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">roof</text></g><g id="garage"><g class="shape" ><rect x="230.000000" y="12.000000" width="94.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="277.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">garage</text></g><g id="water"><g class="shape" ><rect x="344.000000" y="12.000000" width="88.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="388.000000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">water</text></g><g id="rain"><g class="shape" ><rect x="452.000000" y="12.000000" width="73.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="488.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">rain</text></g><g id="thunder"><g class="shape" ><rect x="545.000000" y="12.000000" width="103.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="596.500000" y="50.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">thunder</text></g><mask id="d2-676377399" maskUnits="userSpaceOnUse" x="11" y="11" width="638" height="68">
<rect x="11" y="11" width="638" height="68" fill="white"></rect>
</mask></g></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 33 KiB

5519
e2etests/testdata/stable/grid_animated/dagre/board.exp.json generated vendored Normal file
View file

File diff suppressed because it is too large Load diff

291
e2etests/testdata/stable/grid_animated/dagre/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,291 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 362 506"><svg id="d2-svg" width="362" height="506" viewBox="-1 -1 362 506"><style type="text/css"><![CDATA[
.d2-1308311690 .text {
font-family: "d2-1308311690-font-regular";
}
@font-face {
font-family: d2-1308311690-font-regular;
src: url("data:application/font-woff;base64,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");
}
.d2-1308311690 .text-bold {
font-family: "d2-1308311690-font-bold";
}
@font-face {
font-family: d2-1308311690-font-bold;
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
}
.connection {
stroke-linecap: round;
stroke-linejoin: round;
}
.blend {
mix-blend-mode: multiply;
opacity: 0.5;
}
.d2-1308311690 .fill-N1{fill:#0A0F25;}
.d2-1308311690 .fill-N2{fill:#676C7E;}
.d2-1308311690 .fill-N3{fill:#9499AB;}
.d2-1308311690 .fill-N4{fill:#CFD2DD;}
.d2-1308311690 .fill-N5{fill:#DEE1EB;}
.d2-1308311690 .fill-N6{fill:#EEF1F8;}
.d2-1308311690 .fill-N7{fill:#FFFFFF;}
.d2-1308311690 .fill-B1{fill:#0D32B2;}
.d2-1308311690 .fill-B2{fill:#0D32B2;}
.d2-1308311690 .fill-B3{fill:#E3E9FD;}
.d2-1308311690 .fill-B4{fill:#E3E9FD;}
.d2-1308311690 .fill-B5{fill:#EDF0FD;}
.d2-1308311690 .fill-B6{fill:#F7F8FE;}
.d2-1308311690 .fill-AA2{fill:#4A6FF3;}
.d2-1308311690 .fill-AA4{fill:#EDF0FD;}
.d2-1308311690 .fill-AA5{fill:#F7F8FE;}
.d2-1308311690 .fill-AB4{fill:#EDF0FD;}
.d2-1308311690 .fill-AB5{fill:#F7F8FE;}
.d2-1308311690 .stroke-N1{stroke:#0A0F25;}
.d2-1308311690 .stroke-N2{stroke:#676C7E;}
.d2-1308311690 .stroke-N3{stroke:#9499AB;}
.d2-1308311690 .stroke-N4{stroke:#CFD2DD;}
.d2-1308311690 .stroke-N5{stroke:#DEE1EB;}
.d2-1308311690 .stroke-N6{stroke:#EEF1F8;}
.d2-1308311690 .stroke-N7{stroke:#FFFFFF;}
.d2-1308311690 .stroke-B1{stroke:#0D32B2;}
.d2-1308311690 .stroke-B2{stroke:#0D32B2;}
.d2-1308311690 .stroke-B3{stroke:#E3E9FD;}
.d2-1308311690 .stroke-B4{stroke:#E3E9FD;}
.d2-1308311690 .stroke-B5{stroke:#EDF0FD;}
.d2-1308311690 .stroke-B6{stroke:#F7F8FE;}
.d2-1308311690 .stroke-AA2{stroke:#4A6FF3;}
.d2-1308311690 .stroke-AA4{stroke:#EDF0FD;}
.d2-1308311690 .stroke-AA5{stroke:#F7F8FE;}
.d2-1308311690 .stroke-AB4{stroke:#EDF0FD;}
.d2-1308311690 .stroke-AB5{stroke:#F7F8FE;}
.d2-1308311690 .background-color-N1{background-color:#0A0F25;}
.d2-1308311690 .background-color-N2{background-color:#676C7E;}
.d2-1308311690 .background-color-N3{background-color:#9499AB;}
.d2-1308311690 .background-color-N4{background-color:#CFD2DD;}
.d2-1308311690 .background-color-N5{background-color:#DEE1EB;}
.d2-1308311690 .background-color-N6{background-color:#EEF1F8;}
.d2-1308311690 .background-color-N7{background-color:#FFFFFF;}
.d2-1308311690 .background-color-B1{background-color:#0D32B2;}
.d2-1308311690 .background-color-B2{background-color:#0D32B2;}
.d2-1308311690 .background-color-B3{background-color:#E3E9FD;}
.d2-1308311690 .background-color-B4{background-color:#E3E9FD;}
.d2-1308311690 .background-color-B5{background-color:#EDF0FD;}
.d2-1308311690 .background-color-B6{background-color:#F7F8FE;}
.d2-1308311690 .background-color-AA2{background-color:#4A6FF3;}
.d2-1308311690 .background-color-AA4{background-color:#EDF0FD;}
.d2-1308311690 .background-color-AA5{background-color:#F7F8FE;}
.d2-1308311690 .background-color-AB4{background-color:#EDF0FD;}
.d2-1308311690 .background-color-AB5{background-color:#F7F8FE;}
.d2-1308311690 .color-N1{color:#0A0F25;}
.d2-1308311690 .color-N2{color:#676C7E;}
.d2-1308311690 .color-N3{color:#9499AB;}
.d2-1308311690 .color-N4{color:#CFD2DD;}
.d2-1308311690 .color-N5{color:#DEE1EB;}
.d2-1308311690 .color-N6{color:#EEF1F8;}
.d2-1308311690 .color-N7{color:#FFFFFF;}
.d2-1308311690 .color-B1{color:#0D32B2;}
.d2-1308311690 .color-B2{color:#0D32B2;}
.d2-1308311690 .color-B3{color:#E3E9FD;}
.d2-1308311690 .color-B4{color:#E3E9FD;}
.d2-1308311690 .color-B5{color:#EDF0FD;}
.d2-1308311690 .color-B6{color:#F7F8FE;}
.d2-1308311690 .color-AA2{color:#4A6FF3;}
.d2-1308311690 .color-AA4{color:#EDF0FD;}
.d2-1308311690 .color-AA5{color:#F7F8FE;}
.d2-1308311690 .color-AB4{color:#EDF0FD;}
.d2-1308311690 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css"><![CDATA[@keyframes d2Transition-d2-1308311690-0 {
0%, 0.000000% {
opacity: 0;
}
0.000000%, 6.660000% {
opacity: 1;
}
6.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-1 {
0%, 6.660000% {
opacity: 0;
}
6.666667%, 13.326667% {
opacity: 1;
}
13.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-2 {
0%, 13.326667% {
opacity: 0;
}
13.333333%, 19.993333% {
opacity: 1;
}
20.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-3 {
0%, 19.993333% {
opacity: 0;
}
20.000000%, 26.660000% {
opacity: 1;
}
26.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-4 {
0%, 26.660000% {
opacity: 0;
}
26.666667%, 33.326667% {
opacity: 1;
}
33.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-5 {
0%, 33.326667% {
opacity: 0;
}
33.333333%, 39.993333% {
opacity: 1;
}
40.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-6 {
0%, 39.993333% {
opacity: 0;
}
40.000000%, 46.660000% {
opacity: 1;
}
46.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-7 {
0%, 46.660000% {
opacity: 0;
}
46.666667%, 53.326667% {
opacity: 1;
}
53.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-8 {
0%, 53.326667% {
opacity: 0;
}
53.333333%, 59.993333% {
opacity: 1;
}
60.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-9 {
0%, 59.993333% {
opacity: 0;
}
60.000000%, 66.660000% {
opacity: 1;
}
66.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-10 {
0%, 66.660000% {
opacity: 0;
}
66.666667%, 73.326667% {
opacity: 1;
}
73.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-11 {
0%, 73.326667% {
opacity: 0;
}
73.333333%, 79.993333% {
opacity: 1;
}
80.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-12 {
0%, 79.993333% {
opacity: 0;
}
80.000000%, 86.660000% {
opacity: 1;
}
86.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-13 {
0%, 86.660000% {
opacity: 0;
}
86.666667%, 93.326667% {
opacity: 1;
}
93.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-1308311690-14 {
0%, 93.326667% {
opacity: 0;
}
93.333333%, 100.000000% {
opacity: 1;
}
}]]></style><g style="animation: d2Transition-d2-1308311690-0 15000ms infinite" class="d2-1308311690" width="290" height="228" viewBox="-1 -1 290 228"><rect x="-1.000000" y="-1.000000" width="290.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="288.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="144.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="77.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="103.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><mask id="d2-1308311690" maskUnits="userSpaceOnUse" x="-1" y="-1" width="290" height="228">
<rect x="-1" y="-1" width="290" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-1 15000ms infinite" class="d2-1308311690" width="308" height="228" viewBox="-1 -1 308 228"><rect x="-1.000000" y="-1.000000" width="308.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="306.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="153.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="153.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="179.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><mask id="d2-2501547975" maskUnits="userSpaceOnUse" x="-1" y="-1" width="308" height="228">
<rect x="-1" y="-1" width="308" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-2 15000ms infinite" class="d2-1308311690" width="361" height="228" viewBox="-1 -1 361 228"><rect x="-1.000000" y="-1.000000" width="361.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="359.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="179.500000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="86.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="153.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="179.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="246.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="272.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><mask id="d2-343083647" maskUnits="userSpaceOnUse" x="-1" y="-1" width="361" height="228">
<rect x="-1" y="-1" width="361" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-3 15000ms infinite" class="d2-1308311690" width="362" height="294" viewBox="-1 -1 362 294"><rect x="-1.000000" y="-1.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><mask id="d2-792956672" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="294">
<rect x="-1" y="-1" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-4 15000ms infinite" class="d2-1308311690" width="362" height="294" viewBox="-1 -1 362 294"><rect x="-1.000000" y="-1.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><mask id="d2-1122783653" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="294">
<rect x="-1" y="-1" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-5 15000ms infinite" class="d2-1308311690" width="362" height="294" viewBox="-1 -1 362 294"><rect x="-1.000000" y="-1.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-4232532621" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="294">
<rect x="-1" y="-1" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-6 15000ms infinite" class="d2-1308311690" width="362" height="294" viewBox="-1 -1 362 294"><rect x="-1.000000" y="-1.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-4232532621" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="294">
<rect x="-1" y="-1" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-7 15000ms infinite" class="d2-1308311690" width="362" height="294" viewBox="-1 -1 362 294"><rect x="-1.000000" y="-1.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-4232532621" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="294">
<rect x="-1" y="-1" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-8 15000ms infinite" class="d2-1308311690" width="362" height="400" viewBox="-1 -1 362 400"><rect x="-1.000000" y="-1.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><mask id="d2-561959215" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="400">
<rect x="-1" y="-1" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-9 15000ms infinite" class="d2-1308311690" width="362" height="400" viewBox="-1 -1 362 400"><rect x="-1.000000" y="-1.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><mask id="d2-2214403192" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="400">
<rect x="-1" y="-1" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-10 15000ms infinite" class="d2-1308311690" width="362" height="400" viewBox="-1 -1 362 400"><rect x="-1.000000" y="-1.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="247.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><mask id="d2-271907534" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="400">
<rect x="-1" y="-1" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-11 15000ms infinite" class="d2-1308311690" width="362" height="506" viewBox="-1 -1 362 506"><rect x="-1.000000" y="-1.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="247.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="60.000000" y="378.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><mask id="d2-2010757607" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="506">
<rect x="-1" y="-1" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-12 15000ms infinite" class="d2-1308311690" width="362" height="506" viewBox="-1 -1 362 506"><rect x="-1.000000" y="-1.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="247.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="60.000000" y="378.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="154.000000" y="378.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><mask id="d2-1464310995" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="506">
<rect x="-1" y="-1" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-13 15000ms infinite" class="d2-1308311690" width="362" height="506" viewBox="-1 -1 362 506"><rect x="-1.000000" y="-1.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="247.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="60.000000" y="378.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="154.000000" y="378.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><g id="gd.l"><g class="shape" ><rect x="247.000000" y="378.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">l</text></g><mask id="d2-2726846044" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="506">
<rect x="-1" y="-1" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-1308311690-14 15000ms infinite" class="d2-1308311690" width="362" height="506" viewBox="-1 -1 362 506"><rect x="-1.000000" y="-1.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="0.000000" y="0.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="180.000000" y="33.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="60.000000" y="60.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="154.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="247.000000" y="60.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="98.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="60.000000" y="166.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="154.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="247.000000" y="166.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="204.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="60.000000" y="272.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="154.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="247.000000" y="272.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="310.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="60.000000" y="378.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="87.000000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="154.000000" y="378.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="180.500000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><g id="gd.l"><g class="shape" ><rect x="247.000000" y="378.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="273.500000" y="416.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">l</text></g><mask id="d2-2726846044" maskUnits="userSpaceOnUse" x="-1" y="-1" width="362" height="506">
<rect x="-1" y="-1" width="362" height="506" fill="white"></rect>
</mask></g></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 55 KiB

5519
e2etests/testdata/stable/grid_animated/elk/board.exp.json generated vendored Normal file
View file

File diff suppressed because it is too large Load diff

291
e2etests/testdata/stable/grid_animated/elk/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,291 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.4.0-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 362 506"><svg id="d2-svg" width="362" height="506" viewBox="11 11 362 506"><style type="text/css"><![CDATA[
.d2-2751317931 .text {
font-family: "d2-2751317931-font-regular";
}
@font-face {
font-family: d2-2751317931-font-regular;
src: url("data:application/font-woff;base64,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");
}
.d2-2751317931 .text-bold {
font-family: "d2-2751317931-font-bold";
}
@font-face {
font-family: d2-2751317931-font-bold;
src: url("data:application/font-woff;base64,d09GRgABAAAAAA1sAAoAAAAAFKgAAguFAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAAA9AAAAGAAAABgXxHXrmNtYXAAAAFUAAAAiQAAAK4C2ANRZ2x5ZgAAAeAAAAcCAAAJXCkYGtZoZWFkAAAI5AAAADYAAAA2G38e1GhoZWEAAAkcAAAAJAAAACQKfwXgaG10eAAACUAAAACAAAAAhDyxBKtsb2NhAAAJwAAAAEQAAABEKmgs5G1heHAAAAoEAAAAIAAAACAAOQD3bmFtZQAACiQAAAMoAAAIKgjwVkFwb3N0AAANTAAAAB0AAAAg/9EAMgADAioCvAAFAAACigJYAAAASwKKAlgAAAFeADIBKQAAAgsHAwMEAwICBGAAAvcAAAADAAAAAAAAAABBREJPACAAIP//Au7/BgAAA9gBESAAAZ8AAAAAAfAClAAAACAAA3icbMy5bcIAGEDhz7HjXE7iXM5F4RJaaIFd2ACBEDswBMdggJAYgA1+JKDklV/xkEglKGRmqJRSuVpLR1dP39DYxDQCtab2xQdGZ49dHGIf21jHJlaxjEXMT9drJX78qnz796fhRipzK3fn3oNHTwrPXrwqvXn34dMXRwAAAP//AQAA///QDR4XAAAAeJxkVVtsG1kZ/s/Yntm4TuPbzPg2vszYM54ktmOPx5PETh03dpKm8SZpaJq2udA8tNlN20CbssmqZZGoKJdFK3AfEBIsQiCBVNBGFRIsChISrFhteOpCXmAL0qqPlSkR4sGdQTPjpA37YJ/R6Mz5/v/7vv87YINpAGwFuw8W6IAucAMJILliroQkCByhSIrC0RZFQC5iGnOrP/2JIFpF0dod/V7kzeVlVF/C7j+/erG+svKf5WJR/eFv3le/jW6+D4BBt7aPPkYt8AMHQLO8nC8oPM+xOCEUClKOIl2cwOG4kisoMo6TXup31em7DYwTI8NxObM2uHx5026NjL3iT3heLUUc58qvznfFBB95iYlfv6F+KoW4G7TnnL2H8dGg41W0fYzCdsALEQAbywscwbkkkjDAKNKL40KuIOc5liApCtViI4zVcbNhZapsaT5TWp7nC3O9ojfpiEVlbOfBZIA58cXJs1vlzdHJr6U+ch8HAARxbR/toBYEDAS9Jf1wmtDbIr2UlCsoNI4jf229Mv6lanosVOOicrnc50t7BhNzjqFbZ2Y3hsL0MjNZGa6TXZ+PBsGoXdD2UQvbAQ9ED7gyDhZk6SWW+DbMs4X14nJe7PfjjU27NTCK+QS3p8fLFTKOb23N3DoR8k3+/PlINsBtev0fuY+PjJ2qAWbU/k/UAl+bnwMQnRoiRlFSTq/dIuV1FBQZu3Fy5GpxbDFjxdQ9+2hWLmT5pe8/FHrZguPExpmZjXJ5repJdBSk2PlAGA2KcgYMjnwAaAP7UF8lFycrL0gyyiclknNdOHkyPj0SyTuDnQFHMHz+PLpzzRaU5/IO/KrNFuPDN9WvAliA1VIYgVqQgSJMGMzwcl4nQjeTfNACLZGcqTDHCoYOur28OG7RBW+T5jGfOZY3tjwbXOof8wSjvoA4uCT3xn41RXTk5xUm4mbF6YVL1dsTjCAwjCCIuWEhIfljjuDQo0B/bylp7UxGgjmn1V3tKU0lHWvHWO/ARNzeRXncxRFpJo0+7BYFMZkUu9VG3E87LRafP8SY3FR0sQ2PgnToTdLFuYwqCVelQYRO52ZONZhoKOnDdh6c9/esLaq7KFZI+ml1GzQNFAD4O/YI40E/lIAwfBNA07Q/ayV4bLyPtN+/fYgZxnbAYWC6JEUiPJxAkJV3rD/40S9/++4XytiOev2Pu+rffj/2pr5f20dubAe6TCe6JNehsf80WWy4OmwE7nYkHBdPY9zzPdqN0DUbYeJYGNSCmIFDS6bqRzokDteKPtujWbniiU1kp083mGiiT//LoOZwJNWTZLMHbfep2+3lgD/UavPXxniZv027NVo/JBA1y+HUEf7MOTA81QXBz8yBGRFtxyCqvF6trpfL16vV6+VUOp1Kp1LtGR7amD1za+iN+nBlUh9lM3/GMQq1wANhAPpFdYYteYEmPS/iR6+TOSVcWC0tF6KlgG2KL8z1dHuTv8Z+lg1w37h5drMc9E99B8UPw8foHb2DWuA+wq85VWbnwUmeDNl9nX5naMiLmudyWZvtLatVzKn/AASkto/eRS0QDF0FRZ94vVleSGNy/sVhpJeiwxjpxR9lr/An2XIkFmbSgXAx+drZgXORk4F8YGCAjw6Jqw4+suAP0h4X5bE74gNibU7wzXspwec/fowbSI8smp4vafvov6ipa3bET652tP115lQjHA3xVGPzmCUy4VhbRHn1sSwGGDSuOmuJXjNTsCZqGt6ySDRF6e0ryktPFk7gef04grh/+7t9uB23Ep0dylv9HV2EleggMl9/40GK6CSsxDGiFzWfJMZ5foJ7YqzjiSeq8wNuNJkc5T4wag4DoE+xexACkOQTmGmJ9r1lKKpPrkQmZu6MZkVW8U1nVqrlJbm4kPeVqK98rn7ntVQmKwSmclLu4pC8vl6w2G7r51LaPnqM3QPx/zXg5APjHdyOXlw3io717/o1rsqMJjP9oYna3HCSZ5XwRO/K4MqWIiljlTVHLrkYigvxkEitZvhYIhy4wPdcnM2OUlZn/URxtsfUYVyroyT2GDoBaDNAaePapXfLtVp5QcnllIdXPrl795Mr/KW9tdf3VgBBn1ZHzvY3QkGvUK+Z9OJvL/Tncv0L5VrtIb+y9/ra3iXe+FbTgIUfo6foGcZDFDYAh2g7h1hYRU+xPugASCTkBEkQJE2jp2oe7b537957q9uXt7cGM9bM4NG9iqwosiDINpLVt6HdVXPX1vblw0yFj1ETLGa+VRqoqToBab/ABmAWewTHAFzGjWqymkinE4l0Ghvo5rhu/QeAjOz8C2qC84guulVxPB4RuwJ2j52hG9H6H17Br1qsgoj+pXoKFxSjL0Shp+jLOr5HjpEs2kXU6ioA/A8AAP//AQAA//+aRvDJAAAAAQAAAAILhWNw88lfDzz1AAED6AAAAADYXaCEAAAAAN1mLzb+N/7ECG0D8QABAAMAAgAAAAAAAAABAAAD2P7vAAAImP43/jcIbQABAAAAAAAAAAAAAAAAAAAAIXicNMyhCsJQHEbx830DsXnDHEsLlwuCFpuCW/g3o0WYL+WbWKy+gMXkA00YGE47/Pzkwhu8YuuB0JfigY0XFF1p3ZB9IlRzUDN9XAh1RHUj3BPezX/oTujF2kf6aknrROdEo5GzRvZO5H+qCZges5fIPwAAAP//AQAA//+1GxKMAAAALAAsAGQAlgDCAPQBKAFOAbYB2AHkAfACCAIkAlYCeAKkAtQC9AMwA1IDigO2A/QEDgQoBDQESgRgBGwEggSgBK4AAQAAACEAkAAMAGMABwABAAAAAAAAAAAAAAAAAAQAA3icnJTPbhtVFMZ/TmzTCsECRVW6ie6CRZHo2FRJ1TYrh9SKRRQHjwtCQkgTz/iPMp4ZeSYO4QlY8xa8RVc8BM+BWKP5fOzYBdEmipJ8d+75851zvnOBHf5mm0r1IfBHPTFcYa9+bniLB/UTw9u061uGqzyp/Wm4RlibG67zea1n+CPeVn8z/ID96k+GH7JbbRv+mGfVHcOfbDv+Mvwp+7xd4Aq84FfDFXbJDG+xw4+Gt3mExaxUeUTTcI3P2DNcZw/oM6EgZkLCCMeQCSOumBGR4xMxY8KQiBBHhxYxhb4mBEKO0X9+DfApmBEo4pgCR4xPTEDO2CL+Iq+Uc2Uc6jSzuxYFYwIu5HFJQIIjZURKQsSl4hQUZLyiQYOcgfhmFOR45EyI8UiZMaJBlzan9BkzIcfRVqSSmU/KkIJrAuV3ZlF2ZkBEQm6srkgIxdOJXyTvDqc4umSyXY98uhHhSxzfybvklsr2Kzz9ujVmm3mXbALm6mesrsS6udYEx7ot87b4VrjgFe5e/dlk8v4ehfpfKPIFV5p/qEklYpLg3C4tfCnId49xHOncwVdHvqdDnxO6vKGvc4sePVqc0afDa/l26eH4mi5nHMujI7y4a0sxZ/yA4xs6siljR9afxcQifiYzdefiOFMdUzL1vGTuqdZIFd59wuUOpRvqyOUz0B6Vlk7zS7RnASNTRSaGU/VyqY3c+heaIqaqpZzt7X25DXPbveUW35Bqh0u1LjiVk1swet9UvXc0c60fj4CQlAtZDEiZ0qDgRrzPCbgixnGs7p1oSwpaK58yz41UEjEVgw6J4szI9Dcw3fjGfbChe2dvSSj/kunlqqr7ZHHq1e2M3qh7yzvfuhytTaBhU03X1DQQ18S0H2mn1vn78s31uqU85YiUmPBfL8AzPJrsc8AhY2UY6GZur0NTL0STlxyq+ksiWQ2l58giHODxnAMOeMnzd/q4ZOKMi1txWc/d4pgjuhx+UBUL+y5HvF59+/+sv4tpU7U4nq5OL+49xSd3UOsX2rPb97KniZWTmFu02604I2BacnG76zW5x3j/AAAA//8BAAD///S3T1F4nGJgZgCD/+cYjBiwAAAAAAD//wEAAP//LwECAwAAAA==");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
}
.connection {
stroke-linecap: round;
stroke-linejoin: round;
}
.blend {
mix-blend-mode: multiply;
opacity: 0.5;
}
.d2-2751317931 .fill-N1{fill:#0A0F25;}
.d2-2751317931 .fill-N2{fill:#676C7E;}
.d2-2751317931 .fill-N3{fill:#9499AB;}
.d2-2751317931 .fill-N4{fill:#CFD2DD;}
.d2-2751317931 .fill-N5{fill:#DEE1EB;}
.d2-2751317931 .fill-N6{fill:#EEF1F8;}
.d2-2751317931 .fill-N7{fill:#FFFFFF;}
.d2-2751317931 .fill-B1{fill:#0D32B2;}
.d2-2751317931 .fill-B2{fill:#0D32B2;}
.d2-2751317931 .fill-B3{fill:#E3E9FD;}
.d2-2751317931 .fill-B4{fill:#E3E9FD;}
.d2-2751317931 .fill-B5{fill:#EDF0FD;}
.d2-2751317931 .fill-B6{fill:#F7F8FE;}
.d2-2751317931 .fill-AA2{fill:#4A6FF3;}
.d2-2751317931 .fill-AA4{fill:#EDF0FD;}
.d2-2751317931 .fill-AA5{fill:#F7F8FE;}
.d2-2751317931 .fill-AB4{fill:#EDF0FD;}
.d2-2751317931 .fill-AB5{fill:#F7F8FE;}
.d2-2751317931 .stroke-N1{stroke:#0A0F25;}
.d2-2751317931 .stroke-N2{stroke:#676C7E;}
.d2-2751317931 .stroke-N3{stroke:#9499AB;}
.d2-2751317931 .stroke-N4{stroke:#CFD2DD;}
.d2-2751317931 .stroke-N5{stroke:#DEE1EB;}
.d2-2751317931 .stroke-N6{stroke:#EEF1F8;}
.d2-2751317931 .stroke-N7{stroke:#FFFFFF;}
.d2-2751317931 .stroke-B1{stroke:#0D32B2;}
.d2-2751317931 .stroke-B2{stroke:#0D32B2;}
.d2-2751317931 .stroke-B3{stroke:#E3E9FD;}
.d2-2751317931 .stroke-B4{stroke:#E3E9FD;}
.d2-2751317931 .stroke-B5{stroke:#EDF0FD;}
.d2-2751317931 .stroke-B6{stroke:#F7F8FE;}
.d2-2751317931 .stroke-AA2{stroke:#4A6FF3;}
.d2-2751317931 .stroke-AA4{stroke:#EDF0FD;}
.d2-2751317931 .stroke-AA5{stroke:#F7F8FE;}
.d2-2751317931 .stroke-AB4{stroke:#EDF0FD;}
.d2-2751317931 .stroke-AB5{stroke:#F7F8FE;}
.d2-2751317931 .background-color-N1{background-color:#0A0F25;}
.d2-2751317931 .background-color-N2{background-color:#676C7E;}
.d2-2751317931 .background-color-N3{background-color:#9499AB;}
.d2-2751317931 .background-color-N4{background-color:#CFD2DD;}
.d2-2751317931 .background-color-N5{background-color:#DEE1EB;}
.d2-2751317931 .background-color-N6{background-color:#EEF1F8;}
.d2-2751317931 .background-color-N7{background-color:#FFFFFF;}
.d2-2751317931 .background-color-B1{background-color:#0D32B2;}
.d2-2751317931 .background-color-B2{background-color:#0D32B2;}
.d2-2751317931 .background-color-B3{background-color:#E3E9FD;}
.d2-2751317931 .background-color-B4{background-color:#E3E9FD;}
.d2-2751317931 .background-color-B5{background-color:#EDF0FD;}
.d2-2751317931 .background-color-B6{background-color:#F7F8FE;}
.d2-2751317931 .background-color-AA2{background-color:#4A6FF3;}
.d2-2751317931 .background-color-AA4{background-color:#EDF0FD;}
.d2-2751317931 .background-color-AA5{background-color:#F7F8FE;}
.d2-2751317931 .background-color-AB4{background-color:#EDF0FD;}
.d2-2751317931 .background-color-AB5{background-color:#F7F8FE;}
.d2-2751317931 .color-N1{color:#0A0F25;}
.d2-2751317931 .color-N2{color:#676C7E;}
.d2-2751317931 .color-N3{color:#9499AB;}
.d2-2751317931 .color-N4{color:#CFD2DD;}
.d2-2751317931 .color-N5{color:#DEE1EB;}
.d2-2751317931 .color-N6{color:#EEF1F8;}
.d2-2751317931 .color-N7{color:#FFFFFF;}
.d2-2751317931 .color-B1{color:#0D32B2;}
.d2-2751317931 .color-B2{color:#0D32B2;}
.d2-2751317931 .color-B3{color:#E3E9FD;}
.d2-2751317931 .color-B4{color:#E3E9FD;}
.d2-2751317931 .color-B5{color:#EDF0FD;}
.d2-2751317931 .color-B6{color:#F7F8FE;}
.d2-2751317931 .color-AA2{color:#4A6FF3;}
.d2-2751317931 .color-AA4{color:#EDF0FD;}
.d2-2751317931 .color-AA5{color:#F7F8FE;}
.d2-2751317931 .color-AB4{color:#EDF0FD;}
.d2-2751317931 .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);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css"><![CDATA[@keyframes d2Transition-d2-2751317931-0 {
0%, 0.000000% {
opacity: 0;
}
0.000000%, 6.660000% {
opacity: 1;
}
6.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-1 {
0%, 6.660000% {
opacity: 0;
}
6.666667%, 13.326667% {
opacity: 1;
}
13.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-2 {
0%, 13.326667% {
opacity: 0;
}
13.333333%, 19.993333% {
opacity: 1;
}
20.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-3 {
0%, 19.993333% {
opacity: 0;
}
20.000000%, 26.660000% {
opacity: 1;
}
26.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-4 {
0%, 26.660000% {
opacity: 0;
}
26.666667%, 33.326667% {
opacity: 1;
}
33.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-5 {
0%, 33.326667% {
opacity: 0;
}
33.333333%, 39.993333% {
opacity: 1;
}
40.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-6 {
0%, 39.993333% {
opacity: 0;
}
40.000000%, 46.660000% {
opacity: 1;
}
46.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-7 {
0%, 46.660000% {
opacity: 0;
}
46.666667%, 53.326667% {
opacity: 1;
}
53.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-8 {
0%, 53.326667% {
opacity: 0;
}
53.333333%, 59.993333% {
opacity: 1;
}
60.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-9 {
0%, 59.993333% {
opacity: 0;
}
60.000000%, 66.660000% {
opacity: 1;
}
66.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-10 {
0%, 66.660000% {
opacity: 0;
}
66.666667%, 73.326667% {
opacity: 1;
}
73.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-11 {
0%, 73.326667% {
opacity: 0;
}
73.333333%, 79.993333% {
opacity: 1;
}
80.000000%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-12 {
0%, 79.993333% {
opacity: 0;
}
80.000000%, 86.660000% {
opacity: 1;
}
86.666667%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-13 {
0%, 86.660000% {
opacity: 0;
}
86.666667%, 93.326667% {
opacity: 1;
}
93.333333%, 100% {
opacity: 0;
}
}@keyframes d2Transition-d2-2751317931-14 {
0%, 93.326667% {
opacity: 0;
}
93.333333%, 100.000000% {
opacity: 1;
}
}]]></style><g style="animation: d2Transition-d2-2751317931-0 15000ms infinite" class="d2-2751317931" width="290" height="228" viewBox="11 11 290 228"><rect x="11.000000" y="11.000000" width="290.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="288.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="156.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="89.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="115.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><mask id="d2-2751317931" maskUnits="userSpaceOnUse" x="11" y="11" width="290" height="228">
<rect x="11" y="11" width="290" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-1 15000ms infinite" class="d2-2751317931" width="308" height="228" viewBox="11 11 308 228"><rect x="11.000000" y="11.000000" width="308.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="306.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="165.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="98.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="165.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="191.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><mask id="d2-3827571425" maskUnits="userSpaceOnUse" x="11" y="11" width="308" height="228">
<rect x="11" y="11" width="308" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-2 15000ms infinite" class="d2-2751317931" width="361" height="228" viewBox="11 11 361 228"><rect x="11.000000" y="11.000000" width="361.000000" height="228.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="359.000000" height="226.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="191.500000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="98.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="165.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="191.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="258.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="284.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><mask id="d2-1596129019" maskUnits="userSpaceOnUse" x="11" y="11" width="361" height="228">
<rect x="11" y="11" width="361" height="228" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-3 15000ms infinite" class="d2-2751317931" width="362" height="294" viewBox="11 11 362 294"><rect x="11.000000" y="11.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><mask id="d2-3731074308" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="294">
<rect x="11" y="11" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-4 15000ms infinite" class="d2-2751317931" width="362" height="294" viewBox="11 11 362 294"><rect x="11.000000" y="11.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&lt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><mask id="d2-629134967" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="294">
<rect x="11" y="11" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-5 15000ms infinite" class="d2-2751317931" width="362" height="294" viewBox="11 11 362 294"><rect x="11.000000" y="11.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-1835140335" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="294">
<rect x="11" y="11" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-6 15000ms infinite" class="d2-2751317931" width="362" height="294" viewBox="11 11 362 294"><rect x="11.000000" y="11.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-1835140335" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="294">
<rect x="11" y="11" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-7 15000ms infinite" class="d2-2751317931" width="362" height="294" viewBox="11 11 362 294"><rect x="11.000000" y="11.000000" width="362.000000" height="294.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="292.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (=cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><mask id="d2-1835140335" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="294">
<rect x="11" y="11" width="362" height="294" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-8 15000ms infinite" class="d2-2751317931" width="362" height="400" viewBox="11 11 362 400"><rect x="11.000000" y="11.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><mask id="d2-1216046003" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="400">
<rect x="11" y="11" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-9 15000ms infinite" class="d2-2751317931" width="362" height="400" viewBox="11 11 362 400"><rect x="11.000000" y="11.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><mask id="d2-172705724" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="400">
<rect x="11" y="11" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-10 15000ms infinite" class="d2-2751317931" width="362" height="400" viewBox="11 11 362 400"><rect x="11.000000" y="11.000000" width="362.000000" height="400.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="398.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="259.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><mask id="d2-2222967424" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="400">
<rect x="11" y="11" width="362" height="400" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-11 15000ms infinite" class="d2-2751317931" width="362" height="506" viewBox="11 11 362 506"><rect x="11.000000" y="11.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="259.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="72.000000" y="390.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><mask id="d2-2081699254" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="506">
<rect x="11" y="11" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-12 15000ms infinite" class="d2-2751317931" width="362" height="506" viewBox="11 11 362 506"><rect x="11.000000" y="11.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="259.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="72.000000" y="390.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="166.000000" y="390.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><mask id="d2-653728197" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="506">
<rect x="11" y="11" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-13 15000ms infinite" class="d2-2751317931" width="362" height="506" viewBox="11 11 362 506"><rect x="11.000000" y="11.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="259.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="72.000000" y="390.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="166.000000" y="390.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><g id="gd.l"><g class="shape" ><rect x="259.000000" y="390.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">l</text></g><mask id="d2-1505942985" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="506">
<rect x="11" y="11" width="362" height="506" fill="white"></rect>
</mask></g><g style="animation: d2Transition-d2-2751317931-14 15000ms infinite" class="d2-2751317931" width="362" height="506" viewBox="11 11 362 506"><rect x="11.000000" y="11.000000" width="362.000000" height="506.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><g id="gd"><g class="shape" ><rect x="12.000000" y="12.000000" width="360.000000" height="504.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="192.000000" y="45.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">rows 2 columns 3 (&gt;cap)</text></g><g id="gd.a"><g class="shape" ><rect x="72.000000" y="72.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">a</text></g><g id="gd.b"><g class="shape" ><rect x="166.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="gd.c"><g class="shape" ><rect x="259.000000" y="72.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="110.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c</text></g><g id="gd.d"><g class="shape" ><rect x="72.000000" y="178.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="gd.e"><g class="shape" ><rect x="166.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">e</text></g><g id="gd.f"><g class="shape" ><rect x="259.000000" y="178.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="216.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">f</text></g><g id="gd.g"><g class="shape" ><rect x="72.000000" y="284.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">g</text></g><g id="gd.h"><g class="shape" ><rect x="166.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">h</text></g><g id="gd.i"><g class="shape" ><rect x="259.000000" y="284.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="322.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">i</text></g><g id="gd.j"><g class="shape" ><rect x="72.000000" y="390.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="99.000000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">j</text></g><g id="gd.k"><g class="shape" ><rect x="166.000000" y="390.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="192.500000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k</text></g><g id="gd.l"><g class="shape" ><rect x="259.000000" y="390.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="285.500000" y="428.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">l</text></g><mask id="d2-1505942985" maskUnits="userSpaceOnUse" x="11" y="11" width="362" height="506">
<rect x="11" y="11" width="362" height="506" fill="white"></rect>
</mask></g></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 56 KiB