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

Merge pull request #1901 from alixander/min-dims

Browse source 
allow minimum dimensions to be less than label dimensions
This commit is contained in:
Alexander Wang 2024-04-10 10:35:18 -07:00 committed by GitHub
commit 6461e842ab
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
21 changed files with 1094 additions and 691 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
ci/release/changelogs/next.md
View file

@ -5,6 +5,7 @@
#### Improvements 🧹
- Dimensions can be set less than label dimensions [#1901](https://github.com/terrastruct/d2/pull/1901)
- Boards no longer inherit `label` fields from parents [#1838](https://github.com/terrastruct/d2/pull/1838)
- Prevents `near` targeting a child of a special object like grid cells, which wasn't doing anything [#1851](https://github.com/terrastruct/d2/pull/1851)

33
d2graph/d2graph.go
View file

@ -1048,15 +1048,6 @@ func (obj *Object) GetDefaultSize(mtexts []*d2target.MText, ruler *textmeasure.R
// resizes the object to fit content of the given width and height in its inner box with the given padding.
// this accounts for the shape of the object, and if there is a desired width or height set for the object
func (obj *Object) SizeToContent(contentWidth, contentHeight, paddingX, paddingY float64) {
var desiredWidth int
var desiredHeight int
if obj.WidthAttr != nil {
desiredWidth, _ = strconv.Atoi(obj.WidthAttr.Value)
}
if obj.HeightAttr != nil {
desiredHeight, _ = strconv.Atoi(obj.HeightAttr.Value)
}
dslShape := strings.ToLower(obj.Shape.Value)
shapeType := d2target.DSL_SHAPE_TO_SHAPE_TYPE[dslShape]
s := shape.NewShape(shapeType, geo.NewBox(geo.NewPoint(0, 0), contentWidth, contentHeight))
@ -1068,8 +1059,28 @@ func (obj *Object) SizeToContent(contentWidth, contentHeight, paddingX, paddingY
} else {
fitWidth, fitHeight = s.GetDimensionsToFit(contentWidth, contentHeight, paddingX, paddingY)
}
obj.Width = math.Max(float64(desiredWidth), fitWidth)
obj.Height = math.Max(float64(desiredHeight), fitHeight)
var desiredWidth int
if obj.WidthAttr != nil {
desiredWidth, _ = strconv.Atoi(obj.WidthAttr.Value)
obj.Width = float64(desiredWidth)
} else {
obj.Width = fitWidth
}
var desiredHeight int
if obj.HeightAttr != nil {
desiredHeight, _ = strconv.Atoi(obj.HeightAttr.Value)
obj.Height = float64(desiredHeight)
} else {
obj.Height = fitHeight
}
if obj.SQLTable != nil || obj.Class != nil || obj.Language != "" {
obj.Width = math.Max(float64(desiredWidth), fitWidth)
obj.Height = math.Max(float64(desiredHeight), fitHeight)
}
if s.AspectRatio1() {
sideLength := math.Max(obj.Width, obj.Height)
obj.Width = sideLength

8
d2layouts/d2dagrelayout/layout.go
View file

@ -571,6 +571,14 @@ func positionLabelsIcons(obj *d2graph.Object) {
obj.LabelPosition = go2.Pointer(label.InsideMiddleCenter.String())
}
}
if float64(obj.LabelDimensions.Width) > obj.Width || float64(obj.LabelDimensions.Height) > obj.Height {
if len(obj.ChildrenArray) > 0 {
obj.LabelPosition = go2.Pointer(label.OutsideTopCenter.String())
} else {
obj.LabelPosition = go2.Pointer(label.OutsideBottomCenter.String())
}
}
}
func getRanks(g *d2graph.Graph, isHorizontal bool) (ranks [][]*d2graph.Object, objectRanks, startingParentRanks, endingParentRanks map[*d2graph.Object]int) {

8
d2layouts/d2elklayout/layout.go
View file

@ -1149,4 +1149,12 @@ func positionLabelsIcons(obj *d2graph.Object) {
obj.LabelPosition = go2.Pointer(label.InsideMiddleCenter.String())
}
}
if float64(obj.LabelDimensions.Width) > obj.Width || float64(obj.LabelDimensions.Height) > obj.Height {
if len(obj.ChildrenArray) > 0 {
obj.LabelPosition = go2.Pointer(label.OutsideTopCenter.String())
} else {
obj.LabelPosition = go2.Pointer(label.OutsideBottomCenter.String())
}
}
}

150
e2etests/testdata/regression/glob_dimensions/dagre/board.exp.json generated vendored
View file

@ -7,11 +7,11 @@
"id": "start",
"type": "oval",
"pos": {
"x": 138,
"x": 148,
"y": 0
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -40,7 +40,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
},
@ -49,10 +49,10 @@
"type": "rectangle",
"pos": {
"x": 18,
"y": 150
"y": 130
},
"width": 259,
"height": 548,
"height": 509,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -89,11 +89,11 @@
"id": "Check PIN.start",
"type": "oval",
"pos": {
"x": 138,
"y": 180
"x": 148,
"y": 160
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -122,7 +122,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 2
},
@ -131,7 +131,7 @@
"type": "rectangle",
"pos": {
"x": 98,
"y": 310
"y": 270
},
"width": 111,
"height": 66,
@ -172,7 +172,7 @@
"type": "diamond",
"pos": {
"x": 143,
"y": 497
"y": 457
},
"width": 20,
"height": 20,
@ -211,11 +211,11 @@
"id": "Check PIN.end",
"type": "oval",
"pos": {
"x": 138,
"y": 638
"x": 148,
"y": 598
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -244,7 +244,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 2
},
@ -253,7 +253,7 @@
"type": "rectangle",
"pos": {
"x": 133,
"y": 839
"y": 779
},
"width": 159,
"height": 66,
@ -294,7 +294,7 @@
"type": "rectangle",
"pos": {
"x": 227,
"y": 1026
"y": 966
},
"width": 89,
"height": 66,
@ -335,7 +335,7 @@
"type": "rectangle",
"pos": {
"x": 119,
"y": 1213
"y": 1153
},
"width": 68,
"height": 66,
@ -399,19 +399,19 @@
"route": [
{
"x": 153,
"y": 30
"y": 36
},
{
"x": 153,
"y": 70
"y": 55.20000076293945
},
{
"x": 153,
"y": 85.80000305175781
"y": 65.80000305175781
},
{
"x": 153,
"y": 109
"y": 89
}
],
"isCurve": true,
@ -446,19 +446,19 @@
"route": [
{
"x": 153,
"y": 210
"y": 196
},
{
"x": 153,
"y": 250
"y": 215.1999969482422
},
{
"x": 153,
"y": 230
},
{
"x": 153,
"y": 270
},
{
"x": 153,
"y": 310
}
],
"isCurve": true,
@ -493,19 +493,19 @@
"route": [
{
"x": 127.75,
"y": 375.5
"y": 335.5
},
{
"x": 90.1500015258789,
"y": 424.29998779296875
"y": 384.29998779296875
},
{
"x": 94.19999694824219,
"y": 449.6000061035156
"y": 409.6000061035156
},
{
"x": 148,
"y": 502
"y": 462
}
],
"isCurve": true,
@ -540,19 +540,19 @@
"route": [
{
"x": 158,
"y": 502
"y": 462
},
{
"x": 200,
"y": 449.6000061035156
"y": 409.6000061035156
},
{
"x": 203.10000610351562,
"y": 424.29998779296875
"y": 384.29998779296875
},
{
"x": 173.5,
"y": 375.5
"y": 335.5
}
],
"isCurve": true,
@ -587,19 +587,19 @@
"route": [
{
"x": 153,
"y": 517
"y": 477
},
{
"x": 153,
"y": 565.4000244140625
"y": 525.4000244140625
},
{
"x": 153,
"y": 589.5999755859375
"y": 549.5999755859375
},
{
"x": 153,
"y": 638
"y": 598
}
],
"isCurve": true,
@ -634,19 +634,19 @@
"route": [
{
"x": 212.75,
"y": 697.5
"y": 638.5
},
{
"x": 212.75,
"y": 762.2999877929688
"y": 702.5
},
{
"x": 212.75,
"y": 790.7000122070312
"y": 730.7000122070312
},
{
"x": 212.75,
"y": 839.5
"y": 779.5
}
],
"isCurve": true,
@ -681,19 +681,19 @@
"route": [
{
"x": 233.5,
"y": 904.5
"y": 844.5
},
{
"x": 263.8999938964844,
"y": 953.2999877929688
"y": 893.2999877929688
},
{
"x": 271.5,
"y": 977.7000122070312
"y": 917.7000122070312
},
{
"x": 271.5,
"y": 1026.5
"y": 966.5
}
],
"isCurve": true,
@ -728,55 +728,55 @@
"route": [
{
"x": 67.75,
"y": 697.5
"y": 638.5
},
{
"x": 67.75,
"y": 762.2999877929688
"y": 702.5
},
{
"x": 67.75,
"y": 797.2000122070312
"y": 737.2000122070312
},
{
"x": 67.75,
"y": 825.25
"y": 765.25
},
{
"x": 67.75,
"y": 853.2999877929688
"y": 793.2999877929688
},
{
"x": 67.75,
"y": 890.7000122070312
"y": 830.7000122070312
},
{
"x": 67.75,
"y": 918.75
"y": 858.75
},
{
"x": 67.75,
"y": 946.7999877929688
"y": 886.7999877929688
},
{
"x": 67.75,
"y": 984.2000122070312
"y": 924.2000122070312
},
{
"x": 67.75,
"y": 1012.25
"y": 952.25
},
{
"x": 67.75,
"y": 1040.300048828125
"y": 980.2999877929688
},
{
"x": 78.75,
"y": 1164.699951171875
"y": 1104.699951171875
},
{
"x": 122.75,
"y": 1213.5
"y": 1153.5
}
],
"isCurve": true,
@ -811,31 +811,31 @@
"route": [
{
"x": 192,
"y": 904.5
"y": 844.5
},
{
"x": 161.60000610351562,
"y": 953.2999877929688
"y": 893.2999877929688
},
{
"x": 154,
"y": 984.2000122070312
"y": 924.2000122070312
},
{
"x": 154,
"y": 1012.25
"y": 952.25
},
{
"x": 154,
"y": 1040.300048828125
"y": 980.2999877929688
},
{
"x": 153.8000030517578,
"y": 1164.699951171875
"y": 1104.699951171875
},
{
"x": 153,
"y": 1213.5
"y": 1153.5
}
],
"isCurve": true,
@ -870,19 +870,19 @@
"route": [
{
"x": 271.5,
"y": 1091.5
"y": 1031.5
},
{
"x": 271.5,
"y": 1140.300048828125
"y": 1080.300048828125
},
{
"x": 254.5,
"y": 1165.9000244140625
"y": 1105.9000244140625
},
{
"x": 186.5,
"y": 1219.5
"y": 1159.5
}
],
"isCurve": true,

198
e2etests/testdata/regression/glob_dimensions/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

106
e2etests/testdata/regression/glob_dimensions/elk/board.exp.json generated vendored
View file

@ -7,11 +7,11 @@
"id": "start",
"type": "oval",
"pos": {
"x": 153,
"x": 163,
"y": 12
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -40,7 +40,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
},
@ -49,10 +49,10 @@
"type": "rectangle",
"pos": {
"x": 37,
"y": 112
"y": 118
},
"width": 262,
"height": 658,
"height": 670,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -89,11 +89,11 @@
"id": "Check PIN.start",
"type": "oval",
"pos": {
"x": 151,
"y": 162
"x": 161,
"y": 168
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -122,7 +122,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 2
},
@ -131,7 +131,7 @@
"type": "rectangle",
"pos": {
"x": 111,
"y": 262
"y": 274
},
"width": 111,
"height": 66,
@ -172,7 +172,7 @@
"type": "diamond",
"pos": {
"x": 156,
"y": 509
"y": 521
},
"width": 20,
"height": 20,
@ -211,11 +211,11 @@
"id": "Check PIN.end",
"type": "oval",
"pos": {
"x": 151,
"y": 690
"x": 161,
"y": 702
},
"width": 30,
"height": 30,
"width": 10,
"height": 10,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -244,7 +244,7 @@
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 2
},
@ -253,7 +253,7 @@
"type": "rectangle",
"pos": {
"x": 29,
"y": 941
"y": 959
},
"width": 159,
"height": 66,
@ -294,7 +294,7 @@
"type": "rectangle",
"pos": {
"x": 15,
"y": 1178
"y": 1196
},
"width": 89,
"height": 66,
@ -335,7 +335,7 @@
"type": "rectangle",
"pos": {
"x": 95,
"y": 1415
"y": 1433
},
"width": 120,
"height": 66,
@ -398,12 +398,12 @@
"labelPercentage": 0,
"route": [
{
"x": 169,
"y": 42
"x": 168.5,
"y": 48
},
{
"x": 168,
"y": 112
"x": 168.5,
"y": 118
}
],
"animated": false,
@ -436,12 +436,12 @@
"labelPercentage": 0,
"route": [
{
"x": 167,
"y": 192
"x": 166.5,
"y": 204
},
{
"x": 166,
"y": 262
"x": 166.5,
"y": 274
}
],
"animated": false,
@ -475,19 +475,19 @@
"route": [
{
"x": 123.5,
"y": 328
"y": 340
},
{
"x": 123.5,
"y": 469
"y": 481
},
{
"x": 163.16600036621094,
"y": 469
"y": 481
},
{
"x": 163,
"y": 512
"y": 524
}
],
"animated": false,
@ -521,19 +521,19 @@
"route": [
{
"x": 170,
"y": 513
"y": 525
},
{
"x": 169.83299255371094,
"y": 469
"y": 481
},
{
"x": 209.5,
"y": 469
"y": 481
},
{
"x": 209.5,
"y": 328
"y": 340
}
],
"animated": false,
@ -567,11 +567,11 @@
"route": [
{
"x": 166,
"y": 528
"y": 540
},
{
"x": 167,
"y": 690
"y": 702
}
],
"animated": false,
@ -605,11 +605,11 @@
"route": [
{
"x": 108.75,
"y": 770
"y": 788
},
{
"x": 108.75,
"y": 941
"y": 959
}
],
"animated": false,
@ -643,11 +643,11 @@
"route": [
{
"x": 60,
"y": 1007
"y": 1025
},
{
"x": 60,
"y": 1178
"y": 1196
}
],
"animated": false,
@ -681,19 +681,19 @@
"route": [
{
"x": 240.99899291992188,
"y": 770
"y": 788
},
{
"x": 240.99899291992188,
"y": 1375
"y": 1393
},
{
"x": 185.25,
"y": 1375
"y": 1393
},
{
"x": 185.25,
"y": 1415
"y": 1433
}
],
"animated": false,
@ -727,11 +727,11 @@
"route": [
{
"x": 157.5,
"y": 1007
"y": 1025
},
{
"x": 157.5,
"y": 1415
"y": 1433
}
],
"animated": false,
@ -765,19 +765,19 @@
"route": [
{
"x": 60,
"y": 1244
"y": 1262
},
{
"x": 60,
"y": 1375
"y": 1393
},
{
"x": 125.25,
"y": 1375
"y": 1393
},
{
"x": 125.25,
"y": 1415
"y": 1433
}
],
"animated": false,

198
e2etests/testdata/regression/glob_dimensions/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

4
e2etests/testdata/regression/just-width/dagre/board.exp.json generated vendored
View file

@ -10,7 +10,7 @@
"x": 0,
"y": 0
},
"width": 262,
"width": 100,
"height": 61,
"opacity": 1,
"strokeDash": 0,
@ -40,7 +40,7 @@
"underline": false,
"labelWidth": 262,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
}

156
e2etests/testdata/regression/just-width/dagre/sketch.exp.svg vendored
View file

@ -1,9 +1,9 @@
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 264 63"><svg id="d2-svg" class="d2-1364462136" width="264" height="63" viewBox="-1 -1 264 63"><rect x="-1.000000" y="-1.000000" width="264.000000" height="63.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-1364462136 .text-bold {
font-family: "d2-1364462136-font-bold";
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 262 88"><svg id="d2-svg" class="d2-3251595454" width="262" height="88" viewBox="-81 -1 262 88"><rect x="-81.000000" y="-1.000000" width="262.000000" height="88.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-3251595454 .text-bold {
font-family: "d2-3251595454-font-bold";
}
@font-face {
font-family: d2-1364462136-font-bold;
font-family: d2-3251595454-font-bold;
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
@ -18,78 +18,78 @@
opacity: 0.5;
}
.d2-1364462136 .fill-N1{fill:#0A0F25;}
.d2-1364462136 .fill-N2{fill:#676C7E;}
.d2-1364462136 .fill-N3{fill:#9499AB;}
.d2-1364462136 .fill-N4{fill:#CFD2DD;}
.d2-1364462136 .fill-N5{fill:#DEE1EB;}
.d2-1364462136 .fill-N6{fill:#EEF1F8;}
.d2-1364462136 .fill-N7{fill:#FFFFFF;}
.d2-1364462136 .fill-B1{fill:#0D32B2;}
.d2-1364462136 .fill-B2{fill:#0D32B2;}
.d2-1364462136 .fill-B3{fill:#E3E9FD;}
.d2-1364462136 .fill-B4{fill:#E3E9FD;}
.d2-1364462136 .fill-B5{fill:#EDF0FD;}
.d2-1364462136 .fill-B6{fill:#F7F8FE;}
.d2-1364462136 .fill-AA2{fill:#4A6FF3;}
.d2-1364462136 .fill-AA4{fill:#EDF0FD;}
.d2-1364462136 .fill-AA5{fill:#F7F8FE;}
.d2-1364462136 .fill-AB4{fill:#EDF0FD;}
.d2-1364462136 .fill-AB5{fill:#F7F8FE;}
.d2-1364462136 .stroke-N1{stroke:#0A0F25;}
.d2-1364462136 .stroke-N2{stroke:#676C7E;}
.d2-1364462136 .stroke-N3{stroke:#9499AB;}
.d2-1364462136 .stroke-N4{stroke:#CFD2DD;}
.d2-1364462136 .stroke-N5{stroke:#DEE1EB;}
.d2-1364462136 .stroke-N6{stroke:#EEF1F8;}
.d2-1364462136 .stroke-N7{stroke:#FFFFFF;}
.d2-1364462136 .stroke-B1{stroke:#0D32B2;}
.d2-1364462136 .stroke-B2{stroke:#0D32B2;}
.d2-1364462136 .stroke-B3{stroke:#E3E9FD;}
.d2-1364462136 .stroke-B4{stroke:#E3E9FD;}
.d2-1364462136 .stroke-B5{stroke:#EDF0FD;}
.d2-1364462136 .stroke-B6{stroke:#F7F8FE;}
.d2-1364462136 .stroke-AA2{stroke:#4A6FF3;}
.d2-1364462136 .stroke-AA4{stroke:#EDF0FD;}
.d2-1364462136 .stroke-AA5{stroke:#F7F8FE;}
.d2-1364462136 .stroke-AB4{stroke:#EDF0FD;}
.d2-1364462136 .stroke-AB5{stroke:#F7F8FE;}
.d2-1364462136 .background-color-N1{background-color:#0A0F25;}
.d2-1364462136 .background-color-N2{background-color:#676C7E;}
.d2-1364462136 .background-color-N3{background-color:#9499AB;}
.d2-1364462136 .background-color-N4{background-color:#CFD2DD;}
.d2-1364462136 .background-color-N5{background-color:#DEE1EB;}
.d2-1364462136 .background-color-N6{background-color:#EEF1F8;}
.d2-1364462136 .background-color-N7{background-color:#FFFFFF;}
.d2-1364462136 .background-color-B1{background-color:#0D32B2;}
.d2-1364462136 .background-color-B2{background-color:#0D32B2;}
.d2-1364462136 .background-color-B3{background-color:#E3E9FD;}
.d2-1364462136 .background-color-B4{background-color:#E3E9FD;}
.d2-1364462136 .background-color-B5{background-color:#EDF0FD;}
.d2-1364462136 .background-color-B6{background-color:#F7F8FE;}
.d2-1364462136 .background-color-AA2{background-color:#4A6FF3;}
.d2-1364462136 .background-color-AA4{background-color:#EDF0FD;}
.d2-1364462136 .background-color-AA5{background-color:#F7F8FE;}
.d2-1364462136 .background-color-AB4{background-color:#EDF0FD;}
.d2-1364462136 .background-color-AB5{background-color:#F7F8FE;}
.d2-1364462136 .color-N1{color:#0A0F25;}
.d2-1364462136 .color-N2{color:#676C7E;}
.d2-1364462136 .color-N3{color:#9499AB;}
.d2-1364462136 .color-N4{color:#CFD2DD;}
.d2-1364462136 .color-N5{color:#DEE1EB;}
.d2-1364462136 .color-N6{color:#EEF1F8;}
.d2-1364462136 .color-N7{color:#FFFFFF;}
.d2-1364462136 .color-B1{color:#0D32B2;}
.d2-1364462136 .color-B2{color:#0D32B2;}
.d2-1364462136 .color-B3{color:#E3E9FD;}
.d2-1364462136 .color-B4{color:#E3E9FD;}
.d2-1364462136 .color-B5{color:#EDF0FD;}
.d2-1364462136 .color-B6{color:#F7F8FE;}
.d2-1364462136 .color-AA2{color:#4A6FF3;}
.d2-1364462136 .color-AA4{color:#EDF0FD;}
.d2-1364462136 .color-AA5{color:#F7F8FE;}
.d2-1364462136 .color-AB4{color:#EDF0FD;}
.d2-1364462136 .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="x"><g class="shape" ><rect x="0.000000" y="0.000000" width="262.000000" height="61.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="131.000000" y="36.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">teamwork: having someone to blame</text></g><mask id="d2-1364462136" maskUnits="userSpaceOnUse" x="-1" y="-1" width="264" height="63">
<rect x="-1" y="-1" width="264" height="63" fill="white"></rect>
<rect x="0.000000" y="20.000000" width="262" height="21" fill="rgba(0,0,0,0.75)"></rect>
.d2-3251595454 .fill-N1{fill:#0A0F25;}
.d2-3251595454 .fill-N2{fill:#676C7E;}
.d2-3251595454 .fill-N3{fill:#9499AB;}
.d2-3251595454 .fill-N4{fill:#CFD2DD;}
.d2-3251595454 .fill-N5{fill:#DEE1EB;}
.d2-3251595454 .fill-N6{fill:#EEF1F8;}
.d2-3251595454 .fill-N7{fill:#FFFFFF;}
.d2-3251595454 .fill-B1{fill:#0D32B2;}
.d2-3251595454 .fill-B2{fill:#0D32B2;}
.d2-3251595454 .fill-B3{fill:#E3E9FD;}
.d2-3251595454 .fill-B4{fill:#E3E9FD;}
.d2-3251595454 .fill-B5{fill:#EDF0FD;}
.d2-3251595454 .fill-B6{fill:#F7F8FE;}
.d2-3251595454 .fill-AA2{fill:#4A6FF3;}
.d2-3251595454 .fill-AA4{fill:#EDF0FD;}
.d2-3251595454 .fill-AA5{fill:#F7F8FE;}
.d2-3251595454 .fill-AB4{fill:#EDF0FD;}
.d2-3251595454 .fill-AB5{fill:#F7F8FE;}
.d2-3251595454 .stroke-N1{stroke:#0A0F25;}
.d2-3251595454 .stroke-N2{stroke:#676C7E;}
.d2-3251595454 .stroke-N3{stroke:#9499AB;}
.d2-3251595454 .stroke-N4{stroke:#CFD2DD;}
.d2-3251595454 .stroke-N5{stroke:#DEE1EB;}
.d2-3251595454 .stroke-N6{stroke:#EEF1F8;}
.d2-3251595454 .stroke-N7{stroke:#FFFFFF;}
.d2-3251595454 .stroke-B1{stroke:#0D32B2;}
.d2-3251595454 .stroke-B2{stroke:#0D32B2;}
.d2-3251595454 .stroke-B3{stroke:#E3E9FD;}
.d2-3251595454 .stroke-B4{stroke:#E3E9FD;}
.d2-3251595454 .stroke-B5{stroke:#EDF0FD;}
.d2-3251595454 .stroke-B6{stroke:#F7F8FE;}
.d2-3251595454 .stroke-AA2{stroke:#4A6FF3;}
.d2-3251595454 .stroke-AA4{stroke:#EDF0FD;}
.d2-3251595454 .stroke-AA5{stroke:#F7F8FE;}
.d2-3251595454 .stroke-AB4{stroke:#EDF0FD;}
.d2-3251595454 .stroke-AB5{stroke:#F7F8FE;}
.d2-3251595454 .background-color-N1{background-color:#0A0F25;}
.d2-3251595454 .background-color-N2{background-color:#676C7E;}
.d2-3251595454 .background-color-N3{background-color:#9499AB;}
.d2-3251595454 .background-color-N4{background-color:#CFD2DD;}
.d2-3251595454 .background-color-N5{background-color:#DEE1EB;}
.d2-3251595454 .background-color-N6{background-color:#EEF1F8;}
.d2-3251595454 .background-color-N7{background-color:#FFFFFF;}
.d2-3251595454 .background-color-B1{background-color:#0D32B2;}
.d2-3251595454 .background-color-B2{background-color:#0D32B2;}
.d2-3251595454 .background-color-B3{background-color:#E3E9FD;}
.d2-3251595454 .background-color-B4{background-color:#E3E9FD;}
.d2-3251595454 .background-color-B5{background-color:#EDF0FD;}
.d2-3251595454 .background-color-B6{background-color:#F7F8FE;}
.d2-3251595454 .background-color-AA2{background-color:#4A6FF3;}
.d2-3251595454 .background-color-AA4{background-color:#EDF0FD;}
.d2-3251595454 .background-color-AA5{background-color:#F7F8FE;}
.d2-3251595454 .background-color-AB4{background-color:#EDF0FD;}
.d2-3251595454 .background-color-AB5{background-color:#F7F8FE;}
.d2-3251595454 .color-N1{color:#0A0F25;}
.d2-3251595454 .color-N2{color:#676C7E;}
.d2-3251595454 .color-N3{color:#9499AB;}
.d2-3251595454 .color-N4{color:#CFD2DD;}
.d2-3251595454 .color-N5{color:#DEE1EB;}
.d2-3251595454 .color-N6{color:#EEF1F8;}
.d2-3251595454 .color-N7{color:#FFFFFF;}
.d2-3251595454 .color-B1{color:#0D32B2;}
.d2-3251595454 .color-B2{color:#0D32B2;}
.d2-3251595454 .color-B3{color:#E3E9FD;}
.d2-3251595454 .color-B4{color:#E3E9FD;}
.d2-3251595454 .color-B5{color:#EDF0FD;}
.d2-3251595454 .color-B6{color:#F7F8FE;}
.d2-3251595454 .color-AA2{color:#4A6FF3;}
.d2-3251595454 .color-AA4{color:#EDF0FD;}
.d2-3251595454 .color-AA5{color:#F7F8FE;}
.d2-3251595454 .color-AB4{color:#EDF0FD;}
.d2-3251595454 .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="x"><g class="shape" ><rect x="0.000000" y="0.000000" width="100.000000" height="61.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="50.000000" y="82.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">teamwork: having someone to blame</text></g><mask id="d2-3251595454" maskUnits="userSpaceOnUse" x="-81" y="-1" width="262" height="88">
<rect x="-81" y="-1" width="262" height="88" fill="white"></rect>
<rect x="-81.000000" y="66.000000" width="262" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

4
e2etests/testdata/regression/just-width/elk/board.exp.json generated vendored
View file

@ -10,7 +10,7 @@
"x": 12,
"y": 12
},
"width": 262,
"width": 100,
"height": 61,
"opacity": 1,
"strokeDash": 0,
@ -40,7 +40,7 @@
"underline": false,
"labelWidth": 262,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
}

156
e2etests/testdata/regression/just-width/elk/sketch.exp.svg vendored
View file

@ -1,9 +1,9 @@
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 264 63"><svg id="d2-svg" class="d2-2648560688" width="264" height="63" viewBox="11 11 264 63"><rect x="11.000000" y="11.000000" width="264.000000" height="63.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-2648560688 .text-bold {
font-family: "d2-2648560688-font-bold";
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 262 88"><svg id="d2-svg" class="d2-1014957270" width="262" height="88" viewBox="-69 11 262 88"><rect x="-69.000000" y="11.000000" width="262.000000" height="88.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-1014957270 .text-bold {
font-family: "d2-1014957270-font-bold";
}
@font-face {
font-family: d2-2648560688-font-bold;
font-family: d2-1014957270-font-bold;
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
@ -18,78 +18,78 @@
opacity: 0.5;
}
.d2-2648560688 .fill-N1{fill:#0A0F25;}
.d2-2648560688 .fill-N2{fill:#676C7E;}
.d2-2648560688 .fill-N3{fill:#9499AB;}
.d2-2648560688 .fill-N4{fill:#CFD2DD;}
.d2-2648560688 .fill-N5{fill:#DEE1EB;}
.d2-2648560688 .fill-N6{fill:#EEF1F8;}
.d2-2648560688 .fill-N7{fill:#FFFFFF;}
.d2-2648560688 .fill-B1{fill:#0D32B2;}
.d2-2648560688 .fill-B2{fill:#0D32B2;}
.d2-2648560688 .fill-B3{fill:#E3E9FD;}
.d2-2648560688 .fill-B4{fill:#E3E9FD;}
.d2-2648560688 .fill-B5{fill:#EDF0FD;}
.d2-2648560688 .fill-B6{fill:#F7F8FE;}
.d2-2648560688 .fill-AA2{fill:#4A6FF3;}
.d2-2648560688 .fill-AA4{fill:#EDF0FD;}
.d2-2648560688 .fill-AA5{fill:#F7F8FE;}
.d2-2648560688 .fill-AB4{fill:#EDF0FD;}
.d2-2648560688 .fill-AB5{fill:#F7F8FE;}
.d2-2648560688 .stroke-N1{stroke:#0A0F25;}
.d2-2648560688 .stroke-N2{stroke:#676C7E;}
.d2-2648560688 .stroke-N3{stroke:#9499AB;}
.d2-2648560688 .stroke-N4{stroke:#CFD2DD;}
.d2-2648560688 .stroke-N5{stroke:#DEE1EB;}
.d2-2648560688 .stroke-N6{stroke:#EEF1F8;}
.d2-2648560688 .stroke-N7{stroke:#FFFFFF;}
.d2-2648560688 .stroke-B1{stroke:#0D32B2;}
.d2-2648560688 .stroke-B2{stroke:#0D32B2;}
.d2-2648560688 .stroke-B3{stroke:#E3E9FD;}
.d2-2648560688 .stroke-B4{stroke:#E3E9FD;}
.d2-2648560688 .stroke-B5{stroke:#EDF0FD;}
.d2-2648560688 .stroke-B6{stroke:#F7F8FE;}
.d2-2648560688 .stroke-AA2{stroke:#4A6FF3;}
.d2-2648560688 .stroke-AA4{stroke:#EDF0FD;}
.d2-2648560688 .stroke-AA5{stroke:#F7F8FE;}
.d2-2648560688 .stroke-AB4{stroke:#EDF0FD;}
.d2-2648560688 .stroke-AB5{stroke:#F7F8FE;}
.d2-2648560688 .background-color-N1{background-color:#0A0F25;}
.d2-2648560688 .background-color-N2{background-color:#676C7E;}
.d2-2648560688 .background-color-N3{background-color:#9499AB;}
.d2-2648560688 .background-color-N4{background-color:#CFD2DD;}
.d2-2648560688 .background-color-N5{background-color:#DEE1EB;}
.d2-2648560688 .background-color-N6{background-color:#EEF1F8;}
.d2-2648560688 .background-color-N7{background-color:#FFFFFF;}
.d2-2648560688 .background-color-B1{background-color:#0D32B2;}
.d2-2648560688 .background-color-B2{background-color:#0D32B2;}
.d2-2648560688 .background-color-B3{background-color:#E3E9FD;}
.d2-2648560688 .background-color-B4{background-color:#E3E9FD;}
.d2-2648560688 .background-color-B5{background-color:#EDF0FD;}
.d2-2648560688 .background-color-B6{background-color:#F7F8FE;}
.d2-2648560688 .background-color-AA2{background-color:#4A6FF3;}
.d2-2648560688 .background-color-AA4{background-color:#EDF0FD;}
.d2-2648560688 .background-color-AA5{background-color:#F7F8FE;}
.d2-2648560688 .background-color-AB4{background-color:#EDF0FD;}
.d2-2648560688 .background-color-AB5{background-color:#F7F8FE;}
.d2-2648560688 .color-N1{color:#0A0F25;}
.d2-2648560688 .color-N2{color:#676C7E;}
.d2-2648560688 .color-N3{color:#9499AB;}
.d2-2648560688 .color-N4{color:#CFD2DD;}
.d2-2648560688 .color-N5{color:#DEE1EB;}
.d2-2648560688 .color-N6{color:#EEF1F8;}
.d2-2648560688 .color-N7{color:#FFFFFF;}
.d2-2648560688 .color-B1{color:#0D32B2;}
.d2-2648560688 .color-B2{color:#0D32B2;}
.d2-2648560688 .color-B3{color:#E3E9FD;}
.d2-2648560688 .color-B4{color:#E3E9FD;}
.d2-2648560688 .color-B5{color:#EDF0FD;}
.d2-2648560688 .color-B6{color:#F7F8FE;}
.d2-2648560688 .color-AA2{color:#4A6FF3;}
.d2-2648560688 .color-AA4{color:#EDF0FD;}
.d2-2648560688 .color-AA5{color:#F7F8FE;}
.d2-2648560688 .color-AB4{color:#EDF0FD;}
.d2-2648560688 .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="x"><g class="shape" ><rect x="12.000000" y="12.000000" width="262.000000" height="61.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="143.000000" y="48.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">teamwork: having someone to blame</text></g><mask id="d2-2648560688" maskUnits="userSpaceOnUse" x="11" y="11" width="264" height="63">
<rect x="11" y="11" width="264" height="63" fill="white"></rect>
<rect x="12.000000" y="32.000000" width="262" height="21" fill="rgba(0,0,0,0.75)"></rect>
.d2-1014957270 .fill-N1{fill:#0A0F25;}
.d2-1014957270 .fill-N2{fill:#676C7E;}
.d2-1014957270 .fill-N3{fill:#9499AB;}
.d2-1014957270 .fill-N4{fill:#CFD2DD;}
.d2-1014957270 .fill-N5{fill:#DEE1EB;}
.d2-1014957270 .fill-N6{fill:#EEF1F8;}
.d2-1014957270 .fill-N7{fill:#FFFFFF;}
.d2-1014957270 .fill-B1{fill:#0D32B2;}
.d2-1014957270 .fill-B2{fill:#0D32B2;}
.d2-1014957270 .fill-B3{fill:#E3E9FD;}
.d2-1014957270 .fill-B4{fill:#E3E9FD;}
.d2-1014957270 .fill-B5{fill:#EDF0FD;}
.d2-1014957270 .fill-B6{fill:#F7F8FE;}
.d2-1014957270 .fill-AA2{fill:#4A6FF3;}
.d2-1014957270 .fill-AA4{fill:#EDF0FD;}
.d2-1014957270 .fill-AA5{fill:#F7F8FE;}
.d2-1014957270 .fill-AB4{fill:#EDF0FD;}
.d2-1014957270 .fill-AB5{fill:#F7F8FE;}
.d2-1014957270 .stroke-N1{stroke:#0A0F25;}
.d2-1014957270 .stroke-N2{stroke:#676C7E;}
.d2-1014957270 .stroke-N3{stroke:#9499AB;}
.d2-1014957270 .stroke-N4{stroke:#CFD2DD;}
.d2-1014957270 .stroke-N5{stroke:#DEE1EB;}
.d2-1014957270 .stroke-N6{stroke:#EEF1F8;}
.d2-1014957270 .stroke-N7{stroke:#FFFFFF;}
.d2-1014957270 .stroke-B1{stroke:#0D32B2;}
.d2-1014957270 .stroke-B2{stroke:#0D32B2;}
.d2-1014957270 .stroke-B3{stroke:#E3E9FD;}
.d2-1014957270 .stroke-B4{stroke:#E3E9FD;}
.d2-1014957270 .stroke-B5{stroke:#EDF0FD;}
.d2-1014957270 .stroke-B6{stroke:#F7F8FE;}
.d2-1014957270 .stroke-AA2{stroke:#4A6FF3;}
.d2-1014957270 .stroke-AA4{stroke:#EDF0FD;}
.d2-1014957270 .stroke-AA5{stroke:#F7F8FE;}
.d2-1014957270 .stroke-AB4{stroke:#EDF0FD;}
.d2-1014957270 .stroke-AB5{stroke:#F7F8FE;}
.d2-1014957270 .background-color-N1{background-color:#0A0F25;}
.d2-1014957270 .background-color-N2{background-color:#676C7E;}
.d2-1014957270 .background-color-N3{background-color:#9499AB;}
.d2-1014957270 .background-color-N4{background-color:#CFD2DD;}
.d2-1014957270 .background-color-N5{background-color:#DEE1EB;}
.d2-1014957270 .background-color-N6{background-color:#EEF1F8;}
.d2-1014957270 .background-color-N7{background-color:#FFFFFF;}
.d2-1014957270 .background-color-B1{background-color:#0D32B2;}
.d2-1014957270 .background-color-B2{background-color:#0D32B2;}
.d2-1014957270 .background-color-B3{background-color:#E3E9FD;}
.d2-1014957270 .background-color-B4{background-color:#E3E9FD;}
.d2-1014957270 .background-color-B5{background-color:#EDF0FD;}
.d2-1014957270 .background-color-B6{background-color:#F7F8FE;}
.d2-1014957270 .background-color-AA2{background-color:#4A6FF3;}
.d2-1014957270 .background-color-AA4{background-color:#EDF0FD;}
.d2-1014957270 .background-color-AA5{background-color:#F7F8FE;}
.d2-1014957270 .background-color-AB4{background-color:#EDF0FD;}
.d2-1014957270 .background-color-AB5{background-color:#F7F8FE;}
.d2-1014957270 .color-N1{color:#0A0F25;}
.d2-1014957270 .color-N2{color:#676C7E;}
.d2-1014957270 .color-N3{color:#9499AB;}
.d2-1014957270 .color-N4{color:#CFD2DD;}
.d2-1014957270 .color-N5{color:#DEE1EB;}
.d2-1014957270 .color-N6{color:#EEF1F8;}
.d2-1014957270 .color-N7{color:#FFFFFF;}
.d2-1014957270 .color-B1{color:#0D32B2;}
.d2-1014957270 .color-B2{color:#0D32B2;}
.d2-1014957270 .color-B3{color:#E3E9FD;}
.d2-1014957270 .color-B4{color:#E3E9FD;}
.d2-1014957270 .color-B5{color:#EDF0FD;}
.d2-1014957270 .color-B6{color:#F7F8FE;}
.d2-1014957270 .color-AA2{color:#4A6FF3;}
.d2-1014957270 .color-AA4{color:#EDF0FD;}
.d2-1014957270 .color-AA5{color:#F7F8FE;}
.d2-1014957270 .color-AB4{color:#EDF0FD;}
.d2-1014957270 .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="x"><g class="shape" ><rect x="12.000000" y="12.000000" width="100.000000" height="61.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="62.000000" y="94.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">teamwork: having someone to blame</text></g><mask id="d2-1014957270" maskUnits="userSpaceOnUse" x="-69" y="11" width="262" height="88">
<rect x="-69" y="11" width="262" height="88" fill="white"></rect>
<rect x="-69.000000" y="78.000000" width="262" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

18
e2etests/testdata/stable/simple_grid_edges/dagre/board.exp.json generated vendored
View file

@ -192,7 +192,7 @@
"x": 480,
"y": 0
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -408,7 +408,7 @@
"x": 480,
"y": 65
},
"width": 120,
"width": 100,
"height": 30,
"opacity": 1,
"strokeDash": 0,
@ -632,7 +632,7 @@
"x": 480,
"y": 100
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -852,7 +852,7 @@
"x": 480,
"y": 165
},
"width": 120,
"width": 100,
"height": 30,
"opacity": 1,
"strokeDash": 0,
@ -1188,7 +1188,7 @@
"x": 480,
"y": 200
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -1539,11 +1539,11 @@
"labelPercentage": 0,
"route": [
{
"x": 540,
"x": 530,
"y": 100
},
{
"x": 540,
"x": 530,
"y": 60
}
],
@ -1580,11 +1580,11 @@
"labelPercentage": 0,
"route": [
{
"x": 540,
"x": 530,
"y": 160
},
{
"x": 540,
"x": 530,
"y": 200
}
],

176
e2etests/testdata/stable/simple_grid_edges/dagre/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 37 KiB

18
e2etests/testdata/stable/simple_grid_edges/elk/board.exp.json generated vendored
View file

@ -192,7 +192,7 @@
"x": 480,
"y": 0
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -408,7 +408,7 @@
"x": 480,
"y": 65
},
"width": 120,
"width": 100,
"height": 30,
"opacity": 1,
"strokeDash": 0,
@ -632,7 +632,7 @@
"x": 480,
"y": 100
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -852,7 +852,7 @@
"x": 480,
"y": 165
},
"width": 120,
"width": 100,
"height": 30,
"opacity": 1,
"strokeDash": 0,
@ -1188,7 +1188,7 @@
"x": 480,
"y": 200
},
"width": 120,
"width": 100,
"height": 60,
"opacity": 1,
"strokeDash": 0,
@ -1539,11 +1539,11 @@
"labelPercentage": 0,
"route": [
{
"x": 540,
"x": 530,
"y": 100
},
{
"x": 540,
"x": 530,
"y": 60
}
],
@ -1580,11 +1580,11 @@
"labelPercentage": 0,
"route": [
{
"x": 540,
"x": 530,
"y": 160
},
{
"x": 540,
"x": 530,
"y": 200
}
],

176
e2etests/testdata/stable/simple_grid_edges/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 37 KiB

7
e2etests/testdata/txtar.txt vendored
View file

@ -181,3 +181,10 @@ vars: {
}
a.style.fill-pattern: none
b
-- width-smaller-than-label --
b: hello there cat {
shape: person
width: 64
height: 66
}

89
e2etests/testdata/txtar/width-smaller-than-label/dagre/board.exp.json generated vendored Normal file
View file

@ -0,0 +1,89 @@
{
"name": "",
"isFolderOnly": false,
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "b",
"type": "person",
"pos": {
"x": 0,
"y": 0
},
"width": 64,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "hello there cat",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 101,
"labelHeight": 21,
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": [],
"root": {
"id": "",
"type": "",
"pos": {
"x": 0,
"y": 0
},
"width": 0,
"height": 0,
"opacity": 0,
"strokeDash": 0,
"strokeWidth": 0,
"borderRadius": 0,
"fill": "N7",
"stroke": "",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "",
"fontSize": 0,
"fontFamily": "",
"language": "",
"color": "",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"zIndex": 0,
"level": 0
}
}

95
e2etests/testdata/txtar/width-smaller-than-label/dagre/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,95 @@
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 101 93"><svg id="d2-svg" class="d2-624489756" width="101" height="93" viewBox="-18 -1 101 93"><rect x="-18.000000" y="-1.000000" width="101.000000" height="93.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-624489756 .text-bold {
font-family: "d2-624489756-font-bold";
}
@font-face {
font-family: d2-624489756-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-624489756 .fill-N1{fill:#0A0F25;}
.d2-624489756 .fill-N2{fill:#676C7E;}
.d2-624489756 .fill-N3{fill:#9499AB;}
.d2-624489756 .fill-N4{fill:#CFD2DD;}
.d2-624489756 .fill-N5{fill:#DEE1EB;}
.d2-624489756 .fill-N6{fill:#EEF1F8;}
.d2-624489756 .fill-N7{fill:#FFFFFF;}
.d2-624489756 .fill-B1{fill:#0D32B2;}
.d2-624489756 .fill-B2{fill:#0D32B2;}
.d2-624489756 .fill-B3{fill:#E3E9FD;}
.d2-624489756 .fill-B4{fill:#E3E9FD;}
.d2-624489756 .fill-B5{fill:#EDF0FD;}
.d2-624489756 .fill-B6{fill:#F7F8FE;}
.d2-624489756 .fill-AA2{fill:#4A6FF3;}
.d2-624489756 .fill-AA4{fill:#EDF0FD;}
.d2-624489756 .fill-AA5{fill:#F7F8FE;}
.d2-624489756 .fill-AB4{fill:#EDF0FD;}
.d2-624489756 .fill-AB5{fill:#F7F8FE;}
.d2-624489756 .stroke-N1{stroke:#0A0F25;}
.d2-624489756 .stroke-N2{stroke:#676C7E;}
.d2-624489756 .stroke-N3{stroke:#9499AB;}
.d2-624489756 .stroke-N4{stroke:#CFD2DD;}
.d2-624489756 .stroke-N5{stroke:#DEE1EB;}
.d2-624489756 .stroke-N6{stroke:#EEF1F8;}
.d2-624489756 .stroke-N7{stroke:#FFFFFF;}
.d2-624489756 .stroke-B1{stroke:#0D32B2;}
.d2-624489756 .stroke-B2{stroke:#0D32B2;}
.d2-624489756 .stroke-B3{stroke:#E3E9FD;}
.d2-624489756 .stroke-B4{stroke:#E3E9FD;}
.d2-624489756 .stroke-B5{stroke:#EDF0FD;}
.d2-624489756 .stroke-B6{stroke:#F7F8FE;}
.d2-624489756 .stroke-AA2{stroke:#4A6FF3;}
.d2-624489756 .stroke-AA4{stroke:#EDF0FD;}
.d2-624489756 .stroke-AA5{stroke:#F7F8FE;}
.d2-624489756 .stroke-AB4{stroke:#EDF0FD;}
.d2-624489756 .stroke-AB5{stroke:#F7F8FE;}
.d2-624489756 .background-color-N1{background-color:#0A0F25;}
.d2-624489756 .background-color-N2{background-color:#676C7E;}
.d2-624489756 .background-color-N3{background-color:#9499AB;}
.d2-624489756 .background-color-N4{background-color:#CFD2DD;}
.d2-624489756 .background-color-N5{background-color:#DEE1EB;}
.d2-624489756 .background-color-N6{background-color:#EEF1F8;}
.d2-624489756 .background-color-N7{background-color:#FFFFFF;}
.d2-624489756 .background-color-B1{background-color:#0D32B2;}
.d2-624489756 .background-color-B2{background-color:#0D32B2;}
.d2-624489756 .background-color-B3{background-color:#E3E9FD;}
.d2-624489756 .background-color-B4{background-color:#E3E9FD;}
.d2-624489756 .background-color-B5{background-color:#EDF0FD;}
.d2-624489756 .background-color-B6{background-color:#F7F8FE;}
.d2-624489756 .background-color-AA2{background-color:#4A6FF3;}
.d2-624489756 .background-color-AA4{background-color:#EDF0FD;}
.d2-624489756 .background-color-AA5{background-color:#F7F8FE;}
.d2-624489756 .background-color-AB4{background-color:#EDF0FD;}
.d2-624489756 .background-color-AB5{background-color:#F7F8FE;}
.d2-624489756 .color-N1{color:#0A0F25;}
.d2-624489756 .color-N2{color:#676C7E;}
.d2-624489756 .color-N3{color:#9499AB;}
.d2-624489756 .color-N4{color:#CFD2DD;}
.d2-624489756 .color-N5{color:#DEE1EB;}
.d2-624489756 .color-N6{color:#EEF1F8;}
.d2-624489756 .color-N7{color:#FFFFFF;}
.d2-624489756 .color-B1{color:#0D32B2;}
.d2-624489756 .color-B2{color:#0D32B2;}
.d2-624489756 .color-B3{color:#E3E9FD;}
.d2-624489756 .color-B4{color:#E3E9FD;}
.d2-624489756 .color-B5{color:#EDF0FD;}
.d2-624489756 .color-B6{color:#F7F8FE;}
.d2-624489756 .color-AA2{color:#4A6FF3;}
.d2-624489756 .color-AA4{color:#EDF0FD;}
.d2-624489756 .color-AA5{color:#F7F8FE;}
.d2-624489756 .color-AB4{color:#EDF0FD;}
.d2-624489756 .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="b"><g class="shape" ><path d="M 64 66 H 0 V 65 C 0 54 7 44 18 39 C 12 35 8 28 8 21 C 8 10 19 0 32 0 C 45 0 56 10 56 21 C 56 28 52 34 46 38 C 57 43 64 53 64 64 V 65 H 64 Z" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="32.000000" y="87.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello there cat</text></g><mask id="d2-624489756" maskUnits="userSpaceOnUse" x="-18" y="-1" width="101" height="93">
<rect x="-18" y="-1" width="101" height="93" fill="white"></rect>
<rect x="-18.500000" y="71.000000" width="101" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 9.2 KiB

89
e2etests/testdata/txtar/width-smaller-than-label/elk/board.exp.json generated vendored Normal file
View file

@ -0,0 +1,89 @@
{
"name": "",
"isFolderOnly": false,
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "b",
"type": "person",
"pos": {
"x": 12,
"y": 12
},
"width": 64,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "hello there cat",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 101,
"labelHeight": 21,
"labelPosition": "OUTSIDE_BOTTOM_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": [],
"root": {
"id": "",
"type": "",
"pos": {
"x": 0,
"y": 0
},
"width": 0,
"height": 0,
"opacity": 0,
"strokeDash": 0,
"strokeWidth": 0,
"borderRadius": 0,
"fill": "N7",
"stroke": "",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "",
"fontSize": 0,
"fontFamily": "",
"language": "",
"color": "",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"zIndex": 0,
"level": 0
}
}

95
e2etests/testdata/txtar/width-smaller-than-label/elk/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,95 @@
<?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.6.3-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 101 93"><svg id="d2-svg" class="d2-2909831740" width="101" height="93" viewBox="-6 11 101 93"><rect x="-6.000000" y="11.000000" width="101.000000" height="93.000000" rx="0.000000" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-2909831740 .text-bold {
font-family: "d2-2909831740-font-bold";
}
@font-face {
font-family: d2-2909831740-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-2909831740 .fill-N1{fill:#0A0F25;}
.d2-2909831740 .fill-N2{fill:#676C7E;}
.d2-2909831740 .fill-N3{fill:#9499AB;}
.d2-2909831740 .fill-N4{fill:#CFD2DD;}
.d2-2909831740 .fill-N5{fill:#DEE1EB;}
.d2-2909831740 .fill-N6{fill:#EEF1F8;}
.d2-2909831740 .fill-N7{fill:#FFFFFF;}
.d2-2909831740 .fill-B1{fill:#0D32B2;}
.d2-2909831740 .fill-B2{fill:#0D32B2;}
.d2-2909831740 .fill-B3{fill:#E3E9FD;}
.d2-2909831740 .fill-B4{fill:#E3E9FD;}
.d2-2909831740 .fill-B5{fill:#EDF0FD;}
.d2-2909831740 .fill-B6{fill:#F7F8FE;}
.d2-2909831740 .fill-AA2{fill:#4A6FF3;}
.d2-2909831740 .fill-AA4{fill:#EDF0FD;}
.d2-2909831740 .fill-AA5{fill:#F7F8FE;}
.d2-2909831740 .fill-AB4{fill:#EDF0FD;}
.d2-2909831740 .fill-AB5{fill:#F7F8FE;}
.d2-2909831740 .stroke-N1{stroke:#0A0F25;}
.d2-2909831740 .stroke-N2{stroke:#676C7E;}
.d2-2909831740 .stroke-N3{stroke:#9499AB;}
.d2-2909831740 .stroke-N4{stroke:#CFD2DD;}
.d2-2909831740 .stroke-N5{stroke:#DEE1EB;}
.d2-2909831740 .stroke-N6{stroke:#EEF1F8;}
.d2-2909831740 .stroke-N7{stroke:#FFFFFF;}
.d2-2909831740 .stroke-B1{stroke:#0D32B2;}
.d2-2909831740 .stroke-B2{stroke:#0D32B2;}
.d2-2909831740 .stroke-B3{stroke:#E3E9FD;}
.d2-2909831740 .stroke-B4{stroke:#E3E9FD;}
.d2-2909831740 .stroke-B5{stroke:#EDF0FD;}
.d2-2909831740 .stroke-B6{stroke:#F7F8FE;}
.d2-2909831740 .stroke-AA2{stroke:#4A6FF3;}
.d2-2909831740 .stroke-AA4{stroke:#EDF0FD;}
.d2-2909831740 .stroke-AA5{stroke:#F7F8FE;}
.d2-2909831740 .stroke-AB4{stroke:#EDF0FD;}
.d2-2909831740 .stroke-AB5{stroke:#F7F8FE;}
.d2-2909831740 .background-color-N1{background-color:#0A0F25;}
.d2-2909831740 .background-color-N2{background-color:#676C7E;}
.d2-2909831740 .background-color-N3{background-color:#9499AB;}
.d2-2909831740 .background-color-N4{background-color:#CFD2DD;}
.d2-2909831740 .background-color-N5{background-color:#DEE1EB;}
.d2-2909831740 .background-color-N6{background-color:#EEF1F8;}
.d2-2909831740 .background-color-N7{background-color:#FFFFFF;}
.d2-2909831740 .background-color-B1{background-color:#0D32B2;}
.d2-2909831740 .background-color-B2{background-color:#0D32B2;}
.d2-2909831740 .background-color-B3{background-color:#E3E9FD;}
.d2-2909831740 .background-color-B4{background-color:#E3E9FD;}
.d2-2909831740 .background-color-B5{background-color:#EDF0FD;}
.d2-2909831740 .background-color-B6{background-color:#F7F8FE;}
.d2-2909831740 .background-color-AA2{background-color:#4A6FF3;}
.d2-2909831740 .background-color-AA4{background-color:#EDF0FD;}
.d2-2909831740 .background-color-AA5{background-color:#F7F8FE;}
.d2-2909831740 .background-color-AB4{background-color:#EDF0FD;}
.d2-2909831740 .background-color-AB5{background-color:#F7F8FE;}
.d2-2909831740 .color-N1{color:#0A0F25;}
.d2-2909831740 .color-N2{color:#676C7E;}
.d2-2909831740 .color-N3{color:#9499AB;}
.d2-2909831740 .color-N4{color:#CFD2DD;}
.d2-2909831740 .color-N5{color:#DEE1EB;}
.d2-2909831740 .color-N6{color:#EEF1F8;}
.d2-2909831740 .color-N7{color:#FFFFFF;}
.d2-2909831740 .color-B1{color:#0D32B2;}
.d2-2909831740 .color-B2{color:#0D32B2;}
.d2-2909831740 .color-B3{color:#E3E9FD;}
.d2-2909831740 .color-B4{color:#E3E9FD;}
.d2-2909831740 .color-B5{color:#EDF0FD;}
.d2-2909831740 .color-B6{color:#F7F8FE;}
.d2-2909831740 .color-AA2{color:#4A6FF3;}
.d2-2909831740 .color-AA4{color:#EDF0FD;}
.d2-2909831740 .color-AA5{color:#F7F8FE;}
.d2-2909831740 .color-AB4{color:#EDF0FD;}
.d2-2909831740 .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="b"><g class="shape" ><path d="M 76 78 H 12 V 77 C 12 66 19 56 30 51 C 24 47 20 40 20 33 C 20 22 31 12 44 12 C 57 12 68 22 68 33 C 68 40 64 46 58 50 C 69 55 76 65 76 76 V 77 H 76 Z" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="44.000000" y="99.000000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello there cat</text></g><mask id="d2-2909831740" maskUnits="userSpaceOnUse" x="-6" y="11" width="101" height="93">
<rect x="-6" y="11" width="101" height="93" fill="white"></rect>
<rect x="-6.500000" y="83.000000" width="101" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 9.2 KiB