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

fix c4 person

Browse source
This commit is contained in:
Alexander Wang 2025-03-13 12:20:34 -06:00
parent d5e82a5ed9
commit 1153b11e35
No known key found for this signature in database
GPG key ID: BE3937D0D52D8927
18 changed files with 3698 additions and 1593 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

183
e2etests/testdata/txtar/c4-person-label/dagre/board.exp.json generated vendored Normal file
View file

@ -0,0 +1,183 @@
{
"name": "",
"config": {
"sketch": false,
"themeID": 0,
"darkThemeID": null,
"pad": null,
"center": null,
"layoutEngine": null
},
"isFolderOnly": false,
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "c4mdperson",
"type": "c4-person",
"pos": {
"x": 0,
"y": 0
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "c4mdperson2",
"type": "c4-person",
"pos": {
"x": 482,
"y": 0
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "c4mdperson3",
"type": "c4-person",
"pos": {
"x": 964,
"y": 0
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_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": "",
"animated": false,
"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
}
}

846
e2etests/testdata/txtar/c4-person-label/dagre/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,846 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 1388 510"><svg class="d2-2013950895 d2-svg" width="1388" height="510" viewBox="-1 -3 1388 510"><rect x="-1.000000" y="-3.000000" width="1388.000000" height="510.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-2013950895 .text {
font-family: "d2-2013950895-font-regular";
}
@font-face {
font-family: d2-2013950895-font-regular;
src: url("data:application/font-woff;base64,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");
}
@font-face {
font-family: d2-2013950895-font-semibold;
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-2013950895 .fill-N1{fill:#0A0F25;}
.d2-2013950895 .fill-N2{fill:#676C7E;}
.d2-2013950895 .fill-N3{fill:#9499AB;}
.d2-2013950895 .fill-N4{fill:#CFD2DD;}
.d2-2013950895 .fill-N5{fill:#DEE1EB;}
.d2-2013950895 .fill-N6{fill:#EEF1F8;}
.d2-2013950895 .fill-N7{fill:#FFFFFF;}
.d2-2013950895 .fill-B1{fill:#0D32B2;}
.d2-2013950895 .fill-B2{fill:#0D32B2;}
.d2-2013950895 .fill-B3{fill:#E3E9FD;}
.d2-2013950895 .fill-B4{fill:#E3E9FD;}
.d2-2013950895 .fill-B5{fill:#EDF0FD;}
.d2-2013950895 .fill-B6{fill:#F7F8FE;}
.d2-2013950895 .fill-AA2{fill:#4A6FF3;}
.d2-2013950895 .fill-AA4{fill:#EDF0FD;}
.d2-2013950895 .fill-AA5{fill:#F7F8FE;}
.d2-2013950895 .fill-AB4{fill:#EDF0FD;}
.d2-2013950895 .fill-AB5{fill:#F7F8FE;}
.d2-2013950895 .stroke-N1{stroke:#0A0F25;}
.d2-2013950895 .stroke-N2{stroke:#676C7E;}
.d2-2013950895 .stroke-N3{stroke:#9499AB;}
.d2-2013950895 .stroke-N4{stroke:#CFD2DD;}
.d2-2013950895 .stroke-N5{stroke:#DEE1EB;}
.d2-2013950895 .stroke-N6{stroke:#EEF1F8;}
.d2-2013950895 .stroke-N7{stroke:#FFFFFF;}
.d2-2013950895 .stroke-B1{stroke:#0D32B2;}
.d2-2013950895 .stroke-B2{stroke:#0D32B2;}
.d2-2013950895 .stroke-B3{stroke:#E3E9FD;}
.d2-2013950895 .stroke-B4{stroke:#E3E9FD;}
.d2-2013950895 .stroke-B5{stroke:#EDF0FD;}
.d2-2013950895 .stroke-B6{stroke:#F7F8FE;}
.d2-2013950895 .stroke-AA2{stroke:#4A6FF3;}
.d2-2013950895 .stroke-AA4{stroke:#EDF0FD;}
.d2-2013950895 .stroke-AA5{stroke:#F7F8FE;}
.d2-2013950895 .stroke-AB4{stroke:#EDF0FD;}
.d2-2013950895 .stroke-AB5{stroke:#F7F8FE;}
.d2-2013950895 .background-color-N1{background-color:#0A0F25;}
.d2-2013950895 .background-color-N2{background-color:#676C7E;}
.d2-2013950895 .background-color-N3{background-color:#9499AB;}
.d2-2013950895 .background-color-N4{background-color:#CFD2DD;}
.d2-2013950895 .background-color-N5{background-color:#DEE1EB;}
.d2-2013950895 .background-color-N6{background-color:#EEF1F8;}
.d2-2013950895 .background-color-N7{background-color:#FFFFFF;}
.d2-2013950895 .background-color-B1{background-color:#0D32B2;}
.d2-2013950895 .background-color-B2{background-color:#0D32B2;}
.d2-2013950895 .background-color-B3{background-color:#E3E9FD;}
.d2-2013950895 .background-color-B4{background-color:#E3E9FD;}
.d2-2013950895 .background-color-B5{background-color:#EDF0FD;}
.d2-2013950895 .background-color-B6{background-color:#F7F8FE;}
.d2-2013950895 .background-color-AA2{background-color:#4A6FF3;}
.d2-2013950895 .background-color-AA4{background-color:#EDF0FD;}
.d2-2013950895 .background-color-AA5{background-color:#F7F8FE;}
.d2-2013950895 .background-color-AB4{background-color:#EDF0FD;}
.d2-2013950895 .background-color-AB5{background-color:#F7F8FE;}
.d2-2013950895 .color-N1{color:#0A0F25;}
.d2-2013950895 .color-N2{color:#676C7E;}
.d2-2013950895 .color-N3{color:#9499AB;}
.d2-2013950895 .color-N4{color:#CFD2DD;}
.d2-2013950895 .color-N5{color:#DEE1EB;}
.d2-2013950895 .color-N6{color:#EEF1F8;}
.d2-2013950895 .color-N7{color:#FFFFFF;}
.d2-2013950895 .color-B1{color:#0D32B2;}
.d2-2013950895 .color-B2{color:#0D32B2;}
.d2-2013950895 .color-B3{color:#E3E9FD;}
.d2-2013950895 .color-B4{color:#E3E9FD;}
.d2-2013950895 .color-B5{color:#EDF0FD;}
.d2-2013950895 .color-B6{color:#F7F8FE;}
.d2-2013950895 .color-AA2{color:#4A6FF3;}
.d2-2013950895 .color-AA4{color:#EDF0FD;}
.d2-2013950895 .color-AA5{color:#F7F8FE;}
.d2-2013950895 .color-AB4{color:#EDF0FD;}
.d2-2013950895 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-2013950895);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-2013950895);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-2013950895);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-2013950895);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-2013950895);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-2013950895);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-2013950895);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-2013950895);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css">.d2-2013950895 .md em,
.d2-2013950895 .md dfn {
font-family: "d2-2013950895-font-italic";
}
.d2-2013950895 .md b,
.d2-2013950895 .md strong {
font-family: "d2-2013950895-font-bold";
}
.d2-2013950895 .md code,
.d2-2013950895 .md kbd,
.d2-2013950895 .md pre,
.d2-2013950895 .md samp {
font-family: "d2-2013950895-font-mono";
font-size: 1em;
}
.d2-2013950895 .md {
tab-size: 4;
}
/* variables are provided in d2renderers/d2svg/d2svg.go */
.d2-2013950895 .md {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
margin: 0;
color: var(--color-fg-default);
background-color: transparent; /* we don't want to define the background color */
font-family: "d2-2013950895-font-regular";
font-size: 16px;
line-height: 1.5;
word-wrap: break-word;
}
.d2-2013950895 .md details,
.d2-2013950895 .md figcaption,
.d2-2013950895 .md figure {
display: block;
}
.d2-2013950895 .md summary {
display: list-item;
}
.d2-2013950895 .md [hidden] {
display: none !important;
}
.d2-2013950895 .md a {
background-color: transparent;
color: var(--color-accent-fg);
text-decoration: none;
}
.d2-2013950895 .md a:active,
.d2-2013950895 .md a:hover {
outline-width: 0;
}
.d2-2013950895 .md abbr[title] {
border-bottom: none;
text-decoration: underline dotted;
}
.d2-2013950895 .md dfn {
font-style: italic;
}
.d2-2013950895 .md h1 {
margin: 0.67em 0;
padding-bottom: 0.3em;
font-size: 2em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-2013950895 .md mark {
background-color: var(--color-attention-subtle);
color: var(--color-text-primary);
}
.d2-2013950895 .md small {
font-size: 90%;
}
.d2-2013950895 .md sub,
.d2-2013950895 .md sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
.d2-2013950895 .md sub {
bottom: -0.25em;
}
.d2-2013950895 .md sup {
top: -0.5em;
}
.d2-2013950895 .md img {
border-style: none;
max-width: 100%;
box-sizing: content-box;
background-color: var(--color-canvas-default);
}
.d2-2013950895 .md figure {
margin: 1em 40px;
}
.d2-2013950895 .md hr {
box-sizing: content-box;
overflow: hidden;
background: transparent;
border-bottom: 1px solid var(--color-border-muted);
height: 0.25em;
padding: 0;
margin: 24px 0;
background-color: var(--color-border-default);
border: 0;
}
.d2-2013950895 .md input {
font: inherit;
margin: 0;
overflow: visible;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
.d2-2013950895 .md [type="button"],
.d2-2013950895 .md [type="reset"],
.d2-2013950895 .md [type="submit"] {
-webkit-appearance: button;
}
.d2-2013950895 .md [type="button"]::-moz-focus-inner,
.d2-2013950895 .md [type="reset"]::-moz-focus-inner,
.d2-2013950895 .md [type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
.d2-2013950895 .md [type="button"]:-moz-focusring,
.d2-2013950895 .md [type="reset"]:-moz-focusring,
.d2-2013950895 .md [type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
.d2-2013950895 .md [type="checkbox"],
.d2-2013950895 .md [type="radio"] {
box-sizing: border-box;
padding: 0;
}
.d2-2013950895 .md [type="number"]::-webkit-inner-spin-button,
.d2-2013950895 .md [type="number"]::-webkit-outer-spin-button {
height: auto;
}
.d2-2013950895 .md [type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
.d2-2013950895 .md [type="search"]::-webkit-search-cancel-button,
.d2-2013950895 .md [type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
.d2-2013950895 .md ::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
.d2-2013950895 .md ::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
.d2-2013950895 .md a:hover {
text-decoration: underline;
}
.d2-2013950895 .md hr::before {
display: table;
content: "";
}
.d2-2013950895 .md hr::after {
display: table;
clear: both;
content: "";
}
.d2-2013950895 .md table {
border-spacing: 0;
border-collapse: collapse;
display: block;
width: max-content;
max-width: 100%;
overflow: auto;
}
.d2-2013950895 .md td,
.d2-2013950895 .md th {
padding: 0;
}
.d2-2013950895 .md details summary {
cursor: pointer;
}
.d2-2013950895 .md details:not([open]) > *:not(summary) {
display: none !important;
}
.d2-2013950895 .md kbd {
display: inline-block;
padding: 3px 5px;
color: var(--color-fg-default);
vertical-align: middle;
background-color: var(--color-canvas-subtle);
border: solid 1px var(--color-neutral-muted);
border-bottom-color: var(--color-neutral-muted);
border-radius: 6px;
box-shadow: inset 0 -1px 0 var(--color-neutral-muted);
}
.d2-2013950895 .md h1,
.d2-2013950895 .md h2,
.d2-2013950895 .md h3,
.d2-2013950895 .md h4,
.d2-2013950895 .md h5,
.d2-2013950895 .md h6 {
margin-top: 24px;
margin-bottom: 16px;
font-weight: 400;
line-height: 1.25;
font-family: "d2-2013950895-font-semibold";
}
.d2-2013950895 .md h2 {
padding-bottom: 0.3em;
font-size: 1.5em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-2013950895 .md h3 {
font-size: 1.25em;
}
.d2-2013950895 .md h4 {
font-size: 1em;
}
.d2-2013950895 .md h5 {
font-size: 0.875em;
}
.d2-2013950895 .md h6 {
font-size: 0.85em;
color: var(--color-fg-muted);
}
.d2-2013950895 .md p {
margin-top: 0;
margin-bottom: 10px;
}
.d2-2013950895 .md blockquote {
margin: 0;
padding: 0 1em;
color: var(--color-fg-muted);
border-left: 0.25em solid var(--color-border-default);
}
.d2-2013950895 .md ul,
.d2-2013950895 .md ol {
margin-top: 0;
margin-bottom: 0;
padding-left: 2em;
}
.d2-2013950895 .md ol ol,
.d2-2013950895 .md ul ol {
list-style-type: lower-roman;
}
.d2-2013950895 .md ul ul ol,
.d2-2013950895 .md ul ol ol,
.d2-2013950895 .md ol ul ol,
.d2-2013950895 .md ol ol ol {
list-style-type: lower-alpha;
}
.d2-2013950895 .md dd {
margin-left: 0;
}
.d2-2013950895 .md pre {
margin-top: 0;
margin-bottom: 0;
word-wrap: normal;
}
.d2-2013950895 .md ::placeholder {
color: var(--color-fg-subtle);
opacity: 1;
}
.d2-2013950895 .md input::-webkit-outer-spin-button,
.d2-2013950895 .md input::-webkit-inner-spin-button {
margin: 0;
-webkit-appearance: none;
appearance: none;
}
.d2-2013950895 .md::before {
display: table;
content: "";
}
.d2-2013950895 .md::after {
display: table;
clear: both;
content: "";
}
.d2-2013950895 .md > *:first-child {
margin-top: 0 !important;
}
.d2-2013950895 .md > *:last-child {
margin-bottom: 0 !important;
}
.d2-2013950895 .md a:not([href]) {
color: inherit;
text-decoration: none;
}
.d2-2013950895 .md .absent {
color: var(--color-danger-fg);
}
.d2-2013950895 .md .anchor {
float: left;
padding-right: 4px;
margin-left: -20px;
line-height: 1;
}
.d2-2013950895 .md .anchor:focus {
outline: none;
}
.d2-2013950895 .md p,
.d2-2013950895 .md blockquote,
.d2-2013950895 .md ul,
.d2-2013950895 .md ol,
.d2-2013950895 .md dl,
.d2-2013950895 .md table,
.d2-2013950895 .md pre,
.d2-2013950895 .md details {
margin-top: 0;
margin-bottom: 16px;
}
.d2-2013950895 .md blockquote > :first-child {
margin-top: 0;
}
.d2-2013950895 .md blockquote > :last-child {
margin-bottom: 0;
}
.d2-2013950895 .md sup > a::before {
content: "[";
}
.d2-2013950895 .md sup > a::after {
content: "]";
}
.d2-2013950895 .md h1:hover .anchor,
.d2-2013950895 .md h2:hover .anchor,
.d2-2013950895 .md h3:hover .anchor,
.d2-2013950895 .md h4:hover .anchor,
.d2-2013950895 .md h5:hover .anchor,
.d2-2013950895 .md h6:hover .anchor {
text-decoration: none;
}
.d2-2013950895 .md h1 tt,
.d2-2013950895 .md h1 code,
.d2-2013950895 .md h2 tt,
.d2-2013950895 .md h2 code,
.d2-2013950895 .md h3 tt,
.d2-2013950895 .md h3 code,
.d2-2013950895 .md h4 tt,
.d2-2013950895 .md h4 code,
.d2-2013950895 .md h5 tt,
.d2-2013950895 .md h5 code,
.d2-2013950895 .md h6 tt,
.d2-2013950895 .md h6 code {
padding: 0 0.2em;
font-size: inherit;
}
.d2-2013950895 .md ul.no-list,
.d2-2013950895 .md ol.no-list {
padding: 0;
list-style-type: none;
}
.d2-2013950895 .md ol[type="1"] {
list-style-type: decimal;
}
.d2-2013950895 .md ol[type="a"] {
list-style-type: lower-alpha;
}
.d2-2013950895 .md ol[type="i"] {
list-style-type: lower-roman;
}
.d2-2013950895 .md div > ol:not([type]) {
list-style-type: decimal;
}
.d2-2013950895 .md ul ul,
.d2-2013950895 .md ul ol,
.d2-2013950895 .md ol ol,
.d2-2013950895 .md ol ul {
margin-top: 0;
margin-bottom: 0;
}
.d2-2013950895 .md li > p {
margin-top: 16px;
}
.d2-2013950895 .md li + li {
margin-top: 0.25em;
}
.d2-2013950895 .md dl {
padding: 0;
}
.d2-2013950895 .md dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-family: "d2-2013950895-font-semibold";
}
.d2-2013950895 .md dl dd {
padding: 0 16px;
margin-bottom: 16px;
}
.d2-2013950895 .md table th {
font-family: "d2-2013950895-font-semibold";
}
.d2-2013950895 .md table th,
.d2-2013950895 .md table td {
padding: 6px 13px;
border: 1px solid var(--color-border-default);
}
.d2-2013950895 .md table tr {
background-color: var(--color-canvas-default);
border-top: 1px solid var(--color-border-muted);
}
.d2-2013950895 .md table tr:nth-child(2n) {
background-color: var(--color-canvas-subtle);
}
.d2-2013950895 .md table img {
background-color: transparent;
}
.d2-2013950895 .md img[align="right"] {
padding-left: 20px;
}
.d2-2013950895 .md img[align="left"] {
padding-right: 20px;
}
.d2-2013950895 .md span.frame {
display: block;
overflow: hidden;
}
.d2-2013950895 .md span.frame > span {
display: block;
float: left;
width: auto;
padding: 7px;
margin: 13px 0 0;
overflow: hidden;
border: 1px solid var(--color-border-default);
}
.d2-2013950895 .md span.frame span img {
display: block;
float: left;
}
.d2-2013950895 .md span.frame span span {
display: block;
padding: 5px 0 0;
clear: both;
color: var(--color-fg-default);
}
.d2-2013950895 .md span.align-center {
display: block;
overflow: hidden;
clear: both;
}
.d2-2013950895 .md span.align-center > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: center;
}
.d2-2013950895 .md span.align-center span img {
margin: 0 auto;
text-align: center;
}
.d2-2013950895 .md span.align-right {
display: block;
overflow: hidden;
clear: both;
}
.d2-2013950895 .md span.align-right > span {
display: block;
margin: 13px 0 0;
overflow: hidden;
text-align: right;
}
.d2-2013950895 .md span.align-right span img {
margin: 0;
text-align: right;
}
.d2-2013950895 .md span.float-left {
display: block;
float: left;
margin-right: 13px;
overflow: hidden;
}
.d2-2013950895 .md span.float-left span {
margin: 13px 0 0;
}
.d2-2013950895 .md span.float-right {
display: block;
float: right;
margin-left: 13px;
overflow: hidden;
}
.d2-2013950895 .md span.float-right > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: right;
}
.d2-2013950895 .md code,
.d2-2013950895 .md tt {
padding: 0.2em 0.4em;
margin: 0;
font-size: 85%;
background-color: var(--color-neutral-muted);
border-radius: 6px;
}
.d2-2013950895 .md code br,
.d2-2013950895 .md tt br {
display: none;
}
.d2-2013950895 .md del code {
text-decoration: inherit;
}
.d2-2013950895 .md pre code {
font-size: 100%;
}
.d2-2013950895 .md pre > code {
padding: 0;
margin: 0;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}
.d2-2013950895 .md .highlight {
margin-bottom: 16px;
}
.d2-2013950895 .md .highlight pre {
margin-bottom: 0;
word-break: normal;
}
.d2-2013950895 .md .highlight pre,
.d2-2013950895 .md pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: var(--color-canvas-subtle);
border-radius: 6px;
}
.d2-2013950895 .md pre code,
.d2-2013950895 .md pre tt {
display: inline;
max-width: auto;
padding: 0;
margin: 0;
overflow: visible;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}
.d2-2013950895 .md .csv-data td,
.d2-2013950895 .md .csv-data th {
padding: 5px;
overflow: hidden;
font-size: 12px;
line-height: 1;
text-align: left;
white-space: nowrap;
}
.d2-2013950895 .md .csv-data .blob-num {
padding: 10px 8px 9px;
text-align: right;
background: var(--color-canvas-default);
border: 0;
}
.d2-2013950895 .md .csv-data tr {
border-top: 0;
}
.d2-2013950895 .md .csv-data th {
font-family: "d2-2013950895-font-semibold";
background: var(--color-canvas-subtle);
border-top: 0;
}
.d2-2013950895 .md .footnotes {
font-size: 12px;
color: var(--color-fg-muted);
border-top: 1px solid var(--color-border-default);
}
.d2-2013950895 .md .footnotes ol {
padding-left: 16px;
}
.d2-2013950895 .md .footnotes li {
position: relative;
}
.d2-2013950895 .md .footnotes li:target::before {
position: absolute;
top: -8px;
right: -8px;
bottom: -8px;
left: -24px;
pointer-events: none;
content: "";
border: 2px solid var(--color-accent-emphasis);
border-radius: 6px;
}
.d2-2013950895 .md .footnotes li:target {
color: var(--color-fg-default);
}
.d2-2013950895 .md .task-list-item {
list-style-type: none;
}
.d2-2013950895 .md .task-list-item label {
font-weight: 400;
}
.d2-2013950895 .md .task-list-item.enabled label {
cursor: pointer;
}
.d2-2013950895 .md .task-list-item + .task-list-item {
margin-top: 3px;
}
.d2-2013950895 .md .task-list-item .handle {
display: none;
}
.d2-2013950895 .md .task-list-item-checkbox {
margin: 0 0.2em 0.25em -1.6em;
vertical-align: middle;
}
.d2-2013950895 .md .contains-task-list:dir(rtl) .task-list-item-checkbox {
margin: 0 -1.6em 0.25em 0.2em;
}
</style><g class="YzRtZHBlcnNvbg=="><g class="shape" ><path d="M 0 239 C 0 198 41 165 74 165 H 348 C 389 165 422 206 422 239 V 432 C 422 473 381 506 348 506 H 74 C 33 506 0 465 0 432 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 211 -2 C 262 -2 304 40 304 91 C 304 142 262 184 211 184 C 160 184 118 142 118 91 C 118 40 160 -2 211 -2" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="34.000000" y="276.176000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><g class="YzRtZHBlcnNvbjI="><g class="shape" ><path d="M 482 239 C 482 198 523 165 556 165 H 830 C 871 165 904 206 904 239 V 432 C 904 473 863 506 830 506 H 556 C 515 506 482 465 482 432 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 693 -2 C 744 -2 786 40 786 91 C 786 142 744 184 693 184 C 642 184 600 142 600 91 C 600 40 642 -2 693 -2" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="516.000000" y="185.532000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><g class="YzRtZHBlcnNvbjM="><g class="shape" ><path d="M 964 239 C 964 198 1005 165 1038 165 H 1312 C 1353 165 1386 206 1386 239 V 432 C 1386 473 1345 506 1312 506 H 1038 C 997 506 964 465 964 432 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 1175 -2 C 1226 -2 1268 40 1268 91 C 1268 142 1226 184 1175 184 C 1124 184 1082 142 1082 91 C 1082 40 1124 -2 1175 -2" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="998.000000" y="366.820000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><mask id="d2-2013950895" maskUnits="userSpaceOnUse" x="-1" y="-3" width="1388" height="510">
<rect x="-1" y="-3" width="1388" height="510" fill="white"></rect>
<rect x="34.000000" y="276.176000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
<rect x="516.000000" y="185.532000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
<rect x="998.000000" y="366.820000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 32 KiB

183
e2etests/testdata/txtar/c4-person-label/elk/board.exp.json generated vendored Normal file
View file

@ -0,0 +1,183 @@
{
"name": "",
"config": {
"sketch": false,
"themeID": 0,
"darkThemeID": null,
"pad": null,
"center": null,
"layoutEngine": null
},
"isFolderOnly": false,
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "c4mdperson",
"type": "c4-person",
"pos": {
"x": 12,
"y": 12
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "c4mdperson2",
"type": "c4-person",
"pos": {
"x": 454,
"y": 12
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "c4mdperson3",
"type": "c4-person",
"pos": {
"x": 896,
"y": 12
},
"width": 422,
"height": 506,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B3",
"stroke": "B1",
"animated": false,
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "## Personal Banking Customer\n\n[person]\n\nA customer of the bank, with personal bank accounts",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "markdown",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 354,
"labelHeight": 119,
"labelPosition": "INSIDE_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": "",
"animated": false,
"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
}
}

846
e2etests/testdata/txtar/c4-person-label/elk/sketch.exp.svg vendored Normal file
View file

@ -0,0 +1,846 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 1308 510"><svg class="d2-738374020 d2-svg" width="1308" height="510" viewBox="11 9 1308 510"><rect x="11.000000" y="9.000000" width="1308.000000" height="510.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-738374020 .text {
font-family: "d2-738374020-font-regular";
}
@font-face {
font-family: d2-738374020-font-regular;
src: url("data:application/font-woff;base64,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");
}
@font-face {
font-family: d2-738374020-font-semibold;
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-738374020 .fill-N1{fill:#0A0F25;}
.d2-738374020 .fill-N2{fill:#676C7E;}
.d2-738374020 .fill-N3{fill:#9499AB;}
.d2-738374020 .fill-N4{fill:#CFD2DD;}
.d2-738374020 .fill-N5{fill:#DEE1EB;}
.d2-738374020 .fill-N6{fill:#EEF1F8;}
.d2-738374020 .fill-N7{fill:#FFFFFF;}
.d2-738374020 .fill-B1{fill:#0D32B2;}
.d2-738374020 .fill-B2{fill:#0D32B2;}
.d2-738374020 .fill-B3{fill:#E3E9FD;}
.d2-738374020 .fill-B4{fill:#E3E9FD;}
.d2-738374020 .fill-B5{fill:#EDF0FD;}
.d2-738374020 .fill-B6{fill:#F7F8FE;}
.d2-738374020 .fill-AA2{fill:#4A6FF3;}
.d2-738374020 .fill-AA4{fill:#EDF0FD;}
.d2-738374020 .fill-AA5{fill:#F7F8FE;}
.d2-738374020 .fill-AB4{fill:#EDF0FD;}
.d2-738374020 .fill-AB5{fill:#F7F8FE;}
.d2-738374020 .stroke-N1{stroke:#0A0F25;}
.d2-738374020 .stroke-N2{stroke:#676C7E;}
.d2-738374020 .stroke-N3{stroke:#9499AB;}
.d2-738374020 .stroke-N4{stroke:#CFD2DD;}
.d2-738374020 .stroke-N5{stroke:#DEE1EB;}
.d2-738374020 .stroke-N6{stroke:#EEF1F8;}
.d2-738374020 .stroke-N7{stroke:#FFFFFF;}
.d2-738374020 .stroke-B1{stroke:#0D32B2;}
.d2-738374020 .stroke-B2{stroke:#0D32B2;}
.d2-738374020 .stroke-B3{stroke:#E3E9FD;}
.d2-738374020 .stroke-B4{stroke:#E3E9FD;}
.d2-738374020 .stroke-B5{stroke:#EDF0FD;}
.d2-738374020 .stroke-B6{stroke:#F7F8FE;}
.d2-738374020 .stroke-AA2{stroke:#4A6FF3;}
.d2-738374020 .stroke-AA4{stroke:#EDF0FD;}
.d2-738374020 .stroke-AA5{stroke:#F7F8FE;}
.d2-738374020 .stroke-AB4{stroke:#EDF0FD;}
.d2-738374020 .stroke-AB5{stroke:#F7F8FE;}
.d2-738374020 .background-color-N1{background-color:#0A0F25;}
.d2-738374020 .background-color-N2{background-color:#676C7E;}
.d2-738374020 .background-color-N3{background-color:#9499AB;}
.d2-738374020 .background-color-N4{background-color:#CFD2DD;}
.d2-738374020 .background-color-N5{background-color:#DEE1EB;}
.d2-738374020 .background-color-N6{background-color:#EEF1F8;}
.d2-738374020 .background-color-N7{background-color:#FFFFFF;}
.d2-738374020 .background-color-B1{background-color:#0D32B2;}
.d2-738374020 .background-color-B2{background-color:#0D32B2;}
.d2-738374020 .background-color-B3{background-color:#E3E9FD;}
.d2-738374020 .background-color-B4{background-color:#E3E9FD;}
.d2-738374020 .background-color-B5{background-color:#EDF0FD;}
.d2-738374020 .background-color-B6{background-color:#F7F8FE;}
.d2-738374020 .background-color-AA2{background-color:#4A6FF3;}
.d2-738374020 .background-color-AA4{background-color:#EDF0FD;}
.d2-738374020 .background-color-AA5{background-color:#F7F8FE;}
.d2-738374020 .background-color-AB4{background-color:#EDF0FD;}
.d2-738374020 .background-color-AB5{background-color:#F7F8FE;}
.d2-738374020 .color-N1{color:#0A0F25;}
.d2-738374020 .color-N2{color:#676C7E;}
.d2-738374020 .color-N3{color:#9499AB;}
.d2-738374020 .color-N4{color:#CFD2DD;}
.d2-738374020 .color-N5{color:#DEE1EB;}
.d2-738374020 .color-N6{color:#EEF1F8;}
.d2-738374020 .color-N7{color:#FFFFFF;}
.d2-738374020 .color-B1{color:#0D32B2;}
.d2-738374020 .color-B2{color:#0D32B2;}
.d2-738374020 .color-B3{color:#E3E9FD;}
.d2-738374020 .color-B4{color:#E3E9FD;}
.d2-738374020 .color-B5{color:#EDF0FD;}
.d2-738374020 .color-B6{color:#F7F8FE;}
.d2-738374020 .color-AA2{color:#4A6FF3;}
.d2-738374020 .color-AA4{color:#EDF0FD;}
.d2-738374020 .color-AA5{color:#F7F8FE;}
.d2-738374020 .color-AB4{color:#EDF0FD;}
.d2-738374020 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-738374020);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-738374020);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-738374020);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-738374020);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-738374020);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-738374020);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-738374020);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-738374020);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><style type="text/css">.d2-738374020 .md em,
.d2-738374020 .md dfn {
font-family: "d2-738374020-font-italic";
}
.d2-738374020 .md b,
.d2-738374020 .md strong {
font-family: "d2-738374020-font-bold";
}
.d2-738374020 .md code,
.d2-738374020 .md kbd,
.d2-738374020 .md pre,
.d2-738374020 .md samp {
font-family: "d2-738374020-font-mono";
font-size: 1em;
}
.d2-738374020 .md {
tab-size: 4;
}
/* variables are provided in d2renderers/d2svg/d2svg.go */
.d2-738374020 .md {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
margin: 0;
color: var(--color-fg-default);
background-color: transparent; /* we don't want to define the background color */
font-family: "d2-738374020-font-regular";
font-size: 16px;
line-height: 1.5;
word-wrap: break-word;
}
.d2-738374020 .md details,
.d2-738374020 .md figcaption,
.d2-738374020 .md figure {
display: block;
}
.d2-738374020 .md summary {
display: list-item;
}
.d2-738374020 .md [hidden] {
display: none !important;
}
.d2-738374020 .md a {
background-color: transparent;
color: var(--color-accent-fg);
text-decoration: none;
}
.d2-738374020 .md a:active,
.d2-738374020 .md a:hover {
outline-width: 0;
}
.d2-738374020 .md abbr[title] {
border-bottom: none;
text-decoration: underline dotted;
}
.d2-738374020 .md dfn {
font-style: italic;
}
.d2-738374020 .md h1 {
margin: 0.67em 0;
padding-bottom: 0.3em;
font-size: 2em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-738374020 .md mark {
background-color: var(--color-attention-subtle);
color: var(--color-text-primary);
}
.d2-738374020 .md small {
font-size: 90%;
}
.d2-738374020 .md sub,
.d2-738374020 .md sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
.d2-738374020 .md sub {
bottom: -0.25em;
}
.d2-738374020 .md sup {
top: -0.5em;
}
.d2-738374020 .md img {
border-style: none;
max-width: 100%;
box-sizing: content-box;
background-color: var(--color-canvas-default);
}
.d2-738374020 .md figure {
margin: 1em 40px;
}
.d2-738374020 .md hr {
box-sizing: content-box;
overflow: hidden;
background: transparent;
border-bottom: 1px solid var(--color-border-muted);
height: 0.25em;
padding: 0;
margin: 24px 0;
background-color: var(--color-border-default);
border: 0;
}
.d2-738374020 .md input {
font: inherit;
margin: 0;
overflow: visible;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
.d2-738374020 .md [type="button"],
.d2-738374020 .md [type="reset"],
.d2-738374020 .md [type="submit"] {
-webkit-appearance: button;
}
.d2-738374020 .md [type="button"]::-moz-focus-inner,
.d2-738374020 .md [type="reset"]::-moz-focus-inner,
.d2-738374020 .md [type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
.d2-738374020 .md [type="button"]:-moz-focusring,
.d2-738374020 .md [type="reset"]:-moz-focusring,
.d2-738374020 .md [type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
.d2-738374020 .md [type="checkbox"],
.d2-738374020 .md [type="radio"] {
box-sizing: border-box;
padding: 0;
}
.d2-738374020 .md [type="number"]::-webkit-inner-spin-button,
.d2-738374020 .md [type="number"]::-webkit-outer-spin-button {
height: auto;
}
.d2-738374020 .md [type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
.d2-738374020 .md [type="search"]::-webkit-search-cancel-button,
.d2-738374020 .md [type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
.d2-738374020 .md ::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
.d2-738374020 .md ::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
.d2-738374020 .md a:hover {
text-decoration: underline;
}
.d2-738374020 .md hr::before {
display: table;
content: "";
}
.d2-738374020 .md hr::after {
display: table;
clear: both;
content: "";
}
.d2-738374020 .md table {
border-spacing: 0;
border-collapse: collapse;
display: block;
width: max-content;
max-width: 100%;
overflow: auto;
}
.d2-738374020 .md td,
.d2-738374020 .md th {
padding: 0;
}
.d2-738374020 .md details summary {
cursor: pointer;
}
.d2-738374020 .md details:not([open]) > *:not(summary) {
display: none !important;
}
.d2-738374020 .md kbd {
display: inline-block;
padding: 3px 5px;
color: var(--color-fg-default);
vertical-align: middle;
background-color: var(--color-canvas-subtle);
border: solid 1px var(--color-neutral-muted);
border-bottom-color: var(--color-neutral-muted);
border-radius: 6px;
box-shadow: inset 0 -1px 0 var(--color-neutral-muted);
}
.d2-738374020 .md h1,
.d2-738374020 .md h2,
.d2-738374020 .md h3,
.d2-738374020 .md h4,
.d2-738374020 .md h5,
.d2-738374020 .md h6 {
margin-top: 24px;
margin-bottom: 16px;
font-weight: 400;
line-height: 1.25;
font-family: "d2-738374020-font-semibold";
}
.d2-738374020 .md h2 {
padding-bottom: 0.3em;
font-size: 1.5em;
border-bottom: 1px solid var(--color-border-muted);
}
.d2-738374020 .md h3 {
font-size: 1.25em;
}
.d2-738374020 .md h4 {
font-size: 1em;
}
.d2-738374020 .md h5 {
font-size: 0.875em;
}
.d2-738374020 .md h6 {
font-size: 0.85em;
color: var(--color-fg-muted);
}
.d2-738374020 .md p {
margin-top: 0;
margin-bottom: 10px;
}
.d2-738374020 .md blockquote {
margin: 0;
padding: 0 1em;
color: var(--color-fg-muted);
border-left: 0.25em solid var(--color-border-default);
}
.d2-738374020 .md ul,
.d2-738374020 .md ol {
margin-top: 0;
margin-bottom: 0;
padding-left: 2em;
}
.d2-738374020 .md ol ol,
.d2-738374020 .md ul ol {
list-style-type: lower-roman;
}
.d2-738374020 .md ul ul ol,
.d2-738374020 .md ul ol ol,
.d2-738374020 .md ol ul ol,
.d2-738374020 .md ol ol ol {
list-style-type: lower-alpha;
}
.d2-738374020 .md dd {
margin-left: 0;
}
.d2-738374020 .md pre {
margin-top: 0;
margin-bottom: 0;
word-wrap: normal;
}
.d2-738374020 .md ::placeholder {
color: var(--color-fg-subtle);
opacity: 1;
}
.d2-738374020 .md input::-webkit-outer-spin-button,
.d2-738374020 .md input::-webkit-inner-spin-button {
margin: 0;
-webkit-appearance: none;
appearance: none;
}
.d2-738374020 .md::before {
display: table;
content: "";
}
.d2-738374020 .md::after {
display: table;
clear: both;
content: "";
}
.d2-738374020 .md > *:first-child {
margin-top: 0 !important;
}
.d2-738374020 .md > *:last-child {
margin-bottom: 0 !important;
}
.d2-738374020 .md a:not([href]) {
color: inherit;
text-decoration: none;
}
.d2-738374020 .md .absent {
color: var(--color-danger-fg);
}
.d2-738374020 .md .anchor {
float: left;
padding-right: 4px;
margin-left: -20px;
line-height: 1;
}
.d2-738374020 .md .anchor:focus {
outline: none;
}
.d2-738374020 .md p,
.d2-738374020 .md blockquote,
.d2-738374020 .md ul,
.d2-738374020 .md ol,
.d2-738374020 .md dl,
.d2-738374020 .md table,
.d2-738374020 .md pre,
.d2-738374020 .md details {
margin-top: 0;
margin-bottom: 16px;
}
.d2-738374020 .md blockquote > :first-child {
margin-top: 0;
}
.d2-738374020 .md blockquote > :last-child {
margin-bottom: 0;
}
.d2-738374020 .md sup > a::before {
content: "[";
}
.d2-738374020 .md sup > a::after {
content: "]";
}
.d2-738374020 .md h1:hover .anchor,
.d2-738374020 .md h2:hover .anchor,
.d2-738374020 .md h3:hover .anchor,
.d2-738374020 .md h4:hover .anchor,
.d2-738374020 .md h5:hover .anchor,
.d2-738374020 .md h6:hover .anchor {
text-decoration: none;
}
.d2-738374020 .md h1 tt,
.d2-738374020 .md h1 code,
.d2-738374020 .md h2 tt,
.d2-738374020 .md h2 code,
.d2-738374020 .md h3 tt,
.d2-738374020 .md h3 code,
.d2-738374020 .md h4 tt,
.d2-738374020 .md h4 code,
.d2-738374020 .md h5 tt,
.d2-738374020 .md h5 code,
.d2-738374020 .md h6 tt,
.d2-738374020 .md h6 code {
padding: 0 0.2em;
font-size: inherit;
}
.d2-738374020 .md ul.no-list,
.d2-738374020 .md ol.no-list {
padding: 0;
list-style-type: none;
}
.d2-738374020 .md ol[type="1"] {
list-style-type: decimal;
}
.d2-738374020 .md ol[type="a"] {
list-style-type: lower-alpha;
}
.d2-738374020 .md ol[type="i"] {
list-style-type: lower-roman;
}
.d2-738374020 .md div > ol:not([type]) {
list-style-type: decimal;
}
.d2-738374020 .md ul ul,
.d2-738374020 .md ul ol,
.d2-738374020 .md ol ol,
.d2-738374020 .md ol ul {
margin-top: 0;
margin-bottom: 0;
}
.d2-738374020 .md li > p {
margin-top: 16px;
}
.d2-738374020 .md li + li {
margin-top: 0.25em;
}
.d2-738374020 .md dl {
padding: 0;
}
.d2-738374020 .md dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-family: "d2-738374020-font-semibold";
}
.d2-738374020 .md dl dd {
padding: 0 16px;
margin-bottom: 16px;
}
.d2-738374020 .md table th {
font-family: "d2-738374020-font-semibold";
}
.d2-738374020 .md table th,
.d2-738374020 .md table td {
padding: 6px 13px;
border: 1px solid var(--color-border-default);
}
.d2-738374020 .md table tr {
background-color: var(--color-canvas-default);
border-top: 1px solid var(--color-border-muted);
}
.d2-738374020 .md table tr:nth-child(2n) {
background-color: var(--color-canvas-subtle);
}
.d2-738374020 .md table img {
background-color: transparent;
}
.d2-738374020 .md img[align="right"] {
padding-left: 20px;
}
.d2-738374020 .md img[align="left"] {
padding-right: 20px;
}
.d2-738374020 .md span.frame {
display: block;
overflow: hidden;
}
.d2-738374020 .md span.frame > span {
display: block;
float: left;
width: auto;
padding: 7px;
margin: 13px 0 0;
overflow: hidden;
border: 1px solid var(--color-border-default);
}
.d2-738374020 .md span.frame span img {
display: block;
float: left;
}
.d2-738374020 .md span.frame span span {
display: block;
padding: 5px 0 0;
clear: both;
color: var(--color-fg-default);
}
.d2-738374020 .md span.align-center {
display: block;
overflow: hidden;
clear: both;
}
.d2-738374020 .md span.align-center > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: center;
}
.d2-738374020 .md span.align-center span img {
margin: 0 auto;
text-align: center;
}
.d2-738374020 .md span.align-right {
display: block;
overflow: hidden;
clear: both;
}
.d2-738374020 .md span.align-right > span {
display: block;
margin: 13px 0 0;
overflow: hidden;
text-align: right;
}
.d2-738374020 .md span.align-right span img {
margin: 0;
text-align: right;
}
.d2-738374020 .md span.float-left {
display: block;
float: left;
margin-right: 13px;
overflow: hidden;
}
.d2-738374020 .md span.float-left span {
margin: 13px 0 0;
}
.d2-738374020 .md span.float-right {
display: block;
float: right;
margin-left: 13px;
overflow: hidden;
}
.d2-738374020 .md span.float-right > span {
display: block;
margin: 13px auto 0;
overflow: hidden;
text-align: right;
}
.d2-738374020 .md code,
.d2-738374020 .md tt {
padding: 0.2em 0.4em;
margin: 0;
font-size: 85%;
background-color: var(--color-neutral-muted);
border-radius: 6px;
}
.d2-738374020 .md code br,
.d2-738374020 .md tt br {
display: none;
}
.d2-738374020 .md del code {
text-decoration: inherit;
}
.d2-738374020 .md pre code {
font-size: 100%;
}
.d2-738374020 .md pre > code {
padding: 0;
margin: 0;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}
.d2-738374020 .md .highlight {
margin-bottom: 16px;
}
.d2-738374020 .md .highlight pre {
margin-bottom: 0;
word-break: normal;
}
.d2-738374020 .md .highlight pre,
.d2-738374020 .md pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: var(--color-canvas-subtle);
border-radius: 6px;
}
.d2-738374020 .md pre code,
.d2-738374020 .md pre tt {
display: inline;
max-width: auto;
padding: 0;
margin: 0;
overflow: visible;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}
.d2-738374020 .md .csv-data td,
.d2-738374020 .md .csv-data th {
padding: 5px;
overflow: hidden;
font-size: 12px;
line-height: 1;
text-align: left;
white-space: nowrap;
}
.d2-738374020 .md .csv-data .blob-num {
padding: 10px 8px 9px;
text-align: right;
background: var(--color-canvas-default);
border: 0;
}
.d2-738374020 .md .csv-data tr {
border-top: 0;
}
.d2-738374020 .md .csv-data th {
font-family: "d2-738374020-font-semibold";
background: var(--color-canvas-subtle);
border-top: 0;
}
.d2-738374020 .md .footnotes {
font-size: 12px;
color: var(--color-fg-muted);
border-top: 1px solid var(--color-border-default);
}
.d2-738374020 .md .footnotes ol {
padding-left: 16px;
}
.d2-738374020 .md .footnotes li {
position: relative;
}
.d2-738374020 .md .footnotes li:target::before {
position: absolute;
top: -8px;
right: -8px;
bottom: -8px;
left: -24px;
pointer-events: none;
content: "";
border: 2px solid var(--color-accent-emphasis);
border-radius: 6px;
}
.d2-738374020 .md .footnotes li:target {
color: var(--color-fg-default);
}
.d2-738374020 .md .task-list-item {
list-style-type: none;
}
.d2-738374020 .md .task-list-item label {
font-weight: 400;
}
.d2-738374020 .md .task-list-item.enabled label {
cursor: pointer;
}
.d2-738374020 .md .task-list-item + .task-list-item {
margin-top: 3px;
}
.d2-738374020 .md .task-list-item .handle {
display: none;
}
.d2-738374020 .md .task-list-item-checkbox {
margin: 0 0.2em 0.25em -1.6em;
vertical-align: middle;
}
.d2-738374020 .md .contains-task-list:dir(rtl) .task-list-item-checkbox {
margin: 0 -1.6em 0.25em 0.2em;
}
</style><g class="YzRtZHBlcnNvbg=="><g class="shape" ><path d="M 12 251 C 12 210 53 177 86 177 H 360 C 401 177 434 218 434 251 V 444 C 434 485 393 518 360 518 H 86 C 45 518 12 477 12 444 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 223 10 C 274 10 316 52 316 103 C 316 154 274 196 223 196 C 172 196 130 154 130 103 C 130 52 172 10 223 10" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="46.000000" y="288.176000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><g class="YzRtZHBlcnNvbjI="><g class="shape" ><path d="M 454 251 C 454 210 495 177 528 177 H 802 C 843 177 876 218 876 251 V 444 C 876 485 835 518 802 518 H 528 C 487 518 454 477 454 444 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 665 10 C 716 10 758 52 758 103 C 758 154 716 196 665 196 C 614 196 572 154 572 103 C 572 52 614 10 665 10" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="488.000000" y="197.532000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><g class="YzRtZHBlcnNvbjM="><g class="shape" ><path d="M 896 251 C 896 210 937 177 970 177 H 1244 C 1285 177 1318 218 1318 251 V 444 C 1318 485 1277 518 1244 518 H 970 C 929 518 896 477 896 444 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 1107 10 C 1158 10 1200 52 1200 103 C 1200 154 1158 196 1107 196 C 1056 196 1014 154 1014 103 C 1014 52 1056 10 1107 10" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><g><foreignObject requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" x="930.000000" y="378.820000" width="354" height="119"><div xmlns="http://www.w3.org/1999/xhtml" class="md" style="background-color:B3;color:#0A0F25"><h2>Personal Banking Customer</h2>
<p>[person]</p>
<p>A customer of the bank, with personal bank accounts</p>
</div></foreignObject></g></g><mask id="d2-738374020" maskUnits="userSpaceOnUse" x="11" y="9" width="1308" height="510">
<rect x="11" y="9" width="1308" height="510" fill="white"></rect>
<rect x="46.000000" y="288.176000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
<rect x="488.000000" y="197.532000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
<rect x="930.000000" y="378.820000" width="354" height="119" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 32 KiB

98
e2etests/testdata/txtar/c4-person-shape/dagre/board.exp.json generated vendored
View file

@ -16,10 +16,10 @@
"type": "c4-person",
"pos": {
"x": 0,
"y": 612
"y": 577
},
"width": 390,
"height": 468,
"width": 347,
"height": 416,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -57,11 +57,11 @@
"id": "c4person",
"type": "c4-person",
"pos": {
"x": 286,
"x": 263,
"y": 0
},
"width": 169,
"height": 203,
"width": 150,
"height": 180,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -99,8 +99,8 @@
"id": "regular_person",
"type": "person",
"pos": {
"x": 128,
"y": 399
"x": 107,
"y": 370
},
"width": 134,
"height": 89,
@ -141,11 +141,11 @@
"id": "styling",
"type": "rectangle",
"pos": {
"x": 440,
"y": 344
"x": 397,
"y": 321
},
"width": 210,
"height": 622,
"height": 584,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -183,11 +183,11 @@
"id": "styling.c4styled",
"type": "c4-person",
"pos": {
"x": 492,
"y": 374
"x": 455,
"y": 351
},
"width": 107,
"height": 138,
"width": 95,
"height": 126,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -225,8 +225,8 @@
"id": "styling.c4sized",
"type": "c4-person",
"pos": {
"x": 470,
"y": 756
"x": 427,
"y": 695
},
"width": 150,
"height": 180,
@ -291,20 +291,20 @@
"link": "",
"route": [
{
"x": 195,
"y": 514
"x": 173.5,
"y": 485
},
{
"x": 195,
"y": 552.4000244140625
"x": 173.5,
"y": 518.5999755859375
},
{
"x": 195,
"y": 571.5999755859375
"x": 173.60000610351562,
"y": 536.7999877929688
},
{
"x": 195,
"y": 610
"x": 174,
"y": 576
}
],
"isCurve": true,
@ -339,20 +339,20 @@
"link": "",
"route": [
{
"x": 287,
"y": 179
"x": 264,
"y": 157
},
{
"x": 213.3990020751953,
"y": 246.60000610351562
"x": 191.60000610351562,
"y": 223.8000030517578
},
{
"x": 195,
"y": 339
"x": 173.60000610351562,
"y": 314.79998779296875
},
{
"x": 195,
"y": 399
"x": 174,
"y": 370
}
],
"isCurve": true,
@ -387,20 +387,20 @@
"link": "",
"route": [
{
"x": 455,
"y": 180
"x": 413,
"y": 158
},
{
"x": 527,
"y": 246.8000030517578
"x": 484.20001220703125,
"y": 224
},
{
"x": 545,
"y": 334.20001220703125
"x": 502,
"y": 311.3999938964844
},
{
"x": 545,
"y": 375
"x": 502,
"y": 353
}
],
"isCurve": true,
@ -435,20 +435,20 @@
"link": "",
"route": [
{
"x": 545,
"y": 512
"x": 502,
"y": 477
},
{
"x": 545,
"y": 552
"x": 502,
"y": 517
},
{
"x": 545,
"y": 600.5999755859375
"x": 502,
"y": 560.4000244140625
},
{
"x": 545,
"y": 755
"x": 502,
"y": 694
}
],
"isCurve": true,

578
e2etests/testdata/txtar/c4-person-shape/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: 46 KiB

After

Width:  |  Height:  |  Size: 46 KiB

82
e2etests/testdata/txtar/c4-person-shape/elk/board.exp.json generated vendored
View file

@ -16,10 +16,10 @@
"type": "c4-person",
"pos": {
"x": 12,
"y": 1043
"y": 1008
},
"width": 390,
"height": 468,
"width": 347,
"height": 416,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -57,11 +57,11 @@
"id": "c4person",
"type": "c4-person",
"pos": {
"x": 223,
"x": 211,
"y": 12
},
"width": 169,
"height": 203,
"width": 150,
"height": 180,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -99,8 +99,8 @@
"id": "regular_person",
"type": "person",
"pos": {
"x": 140,
"y": 858
"x": 118,
"y": 823
},
"width": 134,
"height": 89,
@ -141,11 +141,11 @@
"id": "styling",
"type": "rectangle",
"pos": {
"x": 283,
"y": 300
"x": 262,
"y": 277
},
"width": 250,
"height": 488,
"height": 476,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -183,11 +183,11 @@
"id": "styling.c4styled",
"type": "c4-person",
"pos": {
"x": 355,
"y": 350
"x": 339,
"y": 327
},
"width": 107,
"height": 138,
"width": 95,
"height": 126,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 1,
@ -225,8 +225,8 @@
"id": "styling.c4sized",
"type": "c4-person",
"pos": {
"x": 333,
"y": 558
"x": 312,
"y": 523
},
"width": 150,
"height": 180,
@ -291,12 +291,12 @@
"link": "",
"route": [
{
"x": 207,
"y": 973
"x": 185.5,
"y": 938
},
{
"x": 207,
"y": 1041
"x": 186,
"y": 1007
}
],
"animated": false,
@ -330,20 +330,20 @@
"link": "",
"route": [
{
"x": 280,
"y": 216
"x": 261,
"y": 192
},
{
"x": 279.5830078125,
"y": 255
"x": 261.25,
"y": 232
},
{
"x": 207,
"y": 255
"x": 185.5,
"y": 232
},
{
"x": 207,
"y": 858
"x": 186,
"y": 823
}
],
"animated": false,
@ -377,20 +377,20 @@
"link": "",
"route": [
{
"x": 336,
"y": 216
"x": 311,
"y": 192
},
{
"x": 335.9159851074219,
"y": 255
"x": 311.25,
"y": 232
},
{
"x": 408.5,
"y": 255
"x": 387,
"y": 232
},
{
"x": 409,
"y": 351
"x": 387,
"y": 329
}
],
"animated": false,
@ -424,12 +424,12 @@
"link": "",
"route": [
{
"x": 408,
"y": 488
"x": 387,
"y": 453
},
{
"x": 409,
"y": 557
"x": 387,
"y": 522
}
],
"animated": false,

578
e2etests/testdata/txtar/c4-person-shape/elk/sketch.exp.svg vendored
View file

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

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 46 KiB

184
e2etests/testdata/txtar/c4-theme/dagre/board.exp.json generated vendored
View file

@ -15,11 +15,11 @@
"id": "customer",
"type": "c4-person",
"pos": {
"x": 1057,
"x": 1083,
"y": 0
},
"width": 479,
"height": 575,
"width": 426,
"height": 511,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -58,7 +58,7 @@
"type": "rectangle",
"pos": {
"x": 147,
"y": 732
"y": 668
},
"width": 2407,
"height": 915,
@ -100,7 +100,7 @@
"type": "rectangle",
"pos": {
"x": 177,
"y": 762
"y": 698
},
"width": 550,
"height": 164,
@ -142,7 +142,7 @@
"type": "rectangle",
"pos": {
"x": 390,
"y": 1047
"y": 983
},
"width": 609,
"height": 164,
@ -184,7 +184,7 @@
"type": "rectangle",
"pos": {
"x": 1123,
"y": 1047
"y": 983
},
"width": 707,
"height": 164,
@ -226,7 +226,7 @@
"type": "rectangle",
"pos": {
"x": 1246,
"y": 1348
"y": 1284
},
"width": 461,
"height": 164,
@ -268,7 +268,7 @@
"type": "rectangle",
"pos": {
"x": 1890,
"y": 1047
"y": 983
},
"width": 634,
"height": 164,
@ -310,7 +310,7 @@
"type": "rectangle",
"pos": {
"x": 2410,
"y": 1784
"y": 1720
},
"width": 360,
"height": 164,
@ -352,7 +352,7 @@
"type": "rectangle",
"pos": {
"x": 0,
"y": 1784
"y": 1720
},
"width": 629,
"height": 164,
@ -417,20 +417,20 @@
"link": "",
"route": [
{
"x": 1057,
"y": 388
"x": 1083,
"y": 337
},
{
"x": 573,
"y": 592.4000244140625
"x": 578.2000122070312,
"y": 531
},
{
"x": 452,
"y": 722
"y": 658
},
{
"x": 452,
"y": 762
"y": 698
}
],
"isCurve": true,
@ -466,19 +466,19 @@
"route": [
{
"x": 452,
"y": 925.5
"y": 861.5
},
{
"x": 452,
"y": 974.2999877929688
"y": 910.2999877929688
},
{
"x": 472.3999938964844,
"y": 998.7000122070312
"y": 934.7000122070312
},
{
"x": 554,
"y": 1047.5
"y": 983.5
}
],
"isCurve": true,
@ -513,44 +513,44 @@
"link": "",
"route": [
{
"x": 1063,
"y": 519
"x": 1084,
"y": 447
},
{
"x": 962.2000122070312,
"y": 618.5999755859375
"x": 966.4000244140625,
"y": 553
},
{
"x": 937,
"y": 657.2000122070312
"y": 593.2000122070312
},
{
"x": 937,
"y": 677.75
"y": 613.75
},
{
"x": 937,
"y": 698.2999877929688
"y": 634.2999877929688
},
{
"x": 937,
"y": 738.4000244140625
"y": 674.4000244140625
},
{
"x": 937,
"y": 778
"y": 714
},
{
"x": 937,
"y": 817.5999755859375
"y": 753.5999755859375
},
{
"x": 916.5999755859375,
"y": 998.7000122070312
"y": 934.7000122070312
},
{
"x": 835,
"y": 1047.5
"y": 983.5
}
],
"isCurve": true,
@ -585,44 +585,44 @@
"link": "",
"route": [
{
"x": 1442,
"y": 576
"x": 1439,
"y": 512
},
{
"x": 1469.199951171875,
"y": 630
"x": 1468.5999755859375,
"y": 566
},
{
"x": 1476,
"y": 657.2000122070312
"y": 593.2000122070312
},
{
"x": 1476,
"y": 677.75
"y": 613.75
},
{
"x": 1476,
"y": 698.2999877929688
"y": 634.2999877929688
},
{
"x": 1476,
"y": 738.4000244140625
"y": 674.4000244140625
},
{
"x": 1476,
"y": 778
"y": 714
},
{
"x": 1476,
"y": 817.5999755859375
"y": 753.5999755859375
},
{
"x": 1476,
"y": 998.7000122070312
"y": 934.7000122070312
},
{
"x": 1476,
"y": 1047.5
"y": 983.5
}
],
"isCurve": true,
@ -658,19 +658,19 @@
"route": [
{
"x": 694.5,
"y": 1210.5
"y": 1146.5
},
{
"x": 694.5,
"y": 1265.699951171875
"y": 1201.699951171875
},
{
"x": 804.7000122070312,
"y": 1300.7220458984375
"y": 1236.7220458984375
},
{
"x": 1245.5,
"y": 1385.6099853515625
"y": 1321.6099853515625
}
],
"isCurve": true,
@ -706,19 +706,19 @@
"route": [
{
"x": 1476,
"y": 1210.5
"y": 1146.5
},
{
"x": 1476,
"y": 1265.699951171875
"y": 1201.699951171875
},
{
"x": 1476,
"y": 1293.300048828125
"y": 1229.300048828125
},
{
"x": 1476,
"y": 1348.5
"y": 1284.5
}
],
"isCurve": true,
@ -754,19 +754,19 @@
"route": [
{
"x": 1245.5,
"y": 1456.1949462890625
"y": 1392.1949462890625
},
{
"x": 500.6990051269531,
"y": 1608.8389892578125
"y": 1544.8389892578125
},
{
"x": 314.5,
"y": 1729.300048828125
"y": 1665.300048828125
},
{
"x": 314.5,
"y": 1784.5
"y": 1720.5
}
],
"isCurve": true,
@ -801,104 +801,104 @@
"link": "",
"route": [
{
"x": 1536,
"y": 351
"x": 1510,
"y": 307
},
{
"x": 2416.800048828125,
"y": 585
"x": 2411.60009765625,
"y": 525
},
{
"x": 2637,
"y": 657.2000122070312
"y": 593.2000122070312
},
{
"x": 2637,
"y": 677.75
"y": 613.75
},
{
"x": 2637,
"y": 698.2999877929688
"y": 634.2999877929688
},
{
"x": 2637,
"y": 738.4000244140625
"y": 674.4000244140625
},
{
"x": 2637,
"y": 778
"y": 714
},
{
"x": 2637,
"y": 817.5999755859375
"y": 753.5999755859375
},
{
"x": 2637,
"y": 872.5
"y": 808.5
},
{
"x": 2637,
"y": 915.25
"y": 851.25
},
{
"x": 2637,
"y": 958
"y": 894
},
{
"x": 2637,
"y": 1015
"y": 951
},
{
"x": 2637,
"y": 1057.75
"y": 993.75
},
{
"x": 2637,
"y": 1100.5
"y": 1036.5
},
{
"x": 2637,
"y": 1159.0999755859375
"y": 1095.0999755859375
},
{
"x": 2637,
"y": 1204.25
"y": 1140.25
},
{
"x": 2637,
"y": 1249.4000244140625
"y": 1185.4000244140625
},
{
"x": 2637,
"y": 1309.5999755859375
"y": 1245.5999755859375
},
{
"x": 2637,
"y": 1354.75
"y": 1290.75
},
{
"x": 2637,
"y": 1399.9000244140625
"y": 1335.9000244140625
},
{
"x": 2637,
"y": 1473.4000244140625
"y": 1409.4000244140625
},
{
"x": 2637,
"y": 1538.5
"y": 1474.5
},
{
"x": 2637,
"y": 1603.5999755859375
"y": 1539.5999755859375
},
{
"x": 2632.800048828125,
"y": 1729.300048828125
"y": 1665.300048828125
},
{
"x": 2616,
"y": 1784.5
"y": 1720.5
}
],
"isCurve": true,
@ -934,19 +934,19 @@
"route": [
{
"x": 1707.5,
"y": 1463.843994140625
"y": 1399.843994140625
},
{
"x": 2241.5,
"y": 1610.3680419921875
"y": 1546.3680419921875
},
{
"x": 2394.39990234375,
"y": 1729.300048828125
"y": 1665.300048828125
},
{
"x": 2472,
"y": 1784.5
"y": 1720.5
}
],
"isCurve": true,
@ -982,19 +982,19 @@
"route": [
{
"x": 2206.5,
"y": 1210.5
"y": 1146.5
},
{
"x": 2206.5,
"y": 1265.699951171875
"y": 1201.699951171875
},
{
"x": 2106.5,
"y": 1300.0999755859375
"y": 1236.0999755859375
},
{
"x": 1706.5,
"y": 1382.5
"y": 1318.5
}
],
"isCurve": true,

612
e2etests/testdata/txtar/c4-theme/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: 53 KiB

After

Width:  |  Height:  |  Size: 54 KiB

106
e2etests/testdata/txtar/c4-theme/elk/board.exp.json generated vendored
View file

@ -15,11 +15,11 @@
"id": "customer",
"type": "c4-person",
"pos": {
"x": 672,
"x": 699,
"y": 12
},
"width": 479,
"height": 575,
"width": 426,
"height": 511,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
@ -58,7 +58,7 @@
"type": "rectangle",
"pos": {
"x": 12,
"y": 839
"y": 775
},
"width": 2218,
"height": 1035,
@ -100,7 +100,7 @@
"type": "rectangle",
"pos": {
"x": 62,
"y": 889
"y": 825
},
"width": 550,
"height": 164,
@ -142,7 +142,7 @@
"type": "rectangle",
"pos": {
"x": 190,
"y": 1224
"y": 1160
},
"width": 609,
"height": 164,
@ -184,7 +184,7 @@
"type": "rectangle",
"pos": {
"x": 819,
"y": 1224
"y": 1160
},
"width": 707,
"height": 164,
@ -226,7 +226,7 @@
"type": "rectangle",
"pos": {
"x": 942,
"y": 1575
"y": 1511
},
"width": 461,
"height": 164,
@ -268,7 +268,7 @@
"type": "rectangle",
"pos": {
"x": 1546,
"y": 1224
"y": 1160
},
"width": 634,
"height": 164,
@ -310,7 +310,7 @@
"type": "rectangle",
"pos": {
"x": 1746,
"y": 2076
"y": 2012
},
"width": 360,
"height": 164,
@ -352,7 +352,7 @@
"type": "rectangle",
"pos": {
"x": 781,
"y": 2076
"y": 2012
},
"width": 629,
"height": 164,
@ -417,20 +417,20 @@
"link": "",
"route": [
{
"x": 769,
"y": 588
"x": 784,
"y": 524
},
{
"x": 768.5499877929688,
"y": 627
"x": 784.4500122070312,
"y": 563
},
{
"x": 359.25,
"y": 627
"y": 563
},
{
"x": 359.25,
"y": 889
"y": 825
}
],
"animated": false,
@ -465,11 +465,11 @@
"route": [
{
"x": 393,
"y": 1053
"y": 989
},
{
"x": 393,
"y": 1224
"y": 1160
}
],
"animated": false,
@ -503,20 +503,20 @@
"link": "",
"route": [
{
"x": 864,
"y": 588
"x": 870,
"y": 524
},
{
"x": 864.3499755859375,
"y": 677
"x": 869.6500244140625,
"y": 613
},
{
"x": 652,
"y": 677
"y": 613
},
{
"x": 652,
"y": 1224
"y": 1160
}
],
"animated": false,
@ -550,12 +550,12 @@
"link": "",
"route": [
{
"x": 960,
"y": 588
"x": 955,
"y": 524
},
{
"x": 960.1500244140625,
"y": 1224
"x": 954.8499755859375,
"y": 1160
}
],
"animated": false,
@ -590,19 +590,19 @@
"route": [
{
"x": 494.5,
"y": 1388
"y": 1324
},
{
"x": 494.5,
"y": 1535
"y": 1471
},
{
"x": 1057.25,
"y": 1535
"y": 1471
},
{
"x": 1057.25,
"y": 1575
"y": 1511
}
],
"animated": false,
@ -637,11 +637,11 @@
"route": [
{
"x": 1172.5,
"y": 1388
"y": 1324
},
{
"x": 1172.5,
"y": 1575
"y": 1511
}
],
"animated": false,
@ -676,11 +676,11 @@
"route": [
{
"x": 1095.666015625,
"y": 1739
"y": 1675
},
{
"x": 1095.666015625,
"y": 2076
"y": 2012
}
],
"animated": false,
@ -714,28 +714,28 @@
"link": "",
"route": [
{
"x": 1056,
"y": 588
"x": 1040,
"y": 524
},
{
"x": 1055.948974609375,
"y": 627
"x": 1040.050048828125,
"y": 563
},
{
"x": 2303.5,
"y": 627
"y": 563
},
{
"x": 2303.5,
"y": 2036
"y": 1972
},
{
"x": 1986.8330078125,
"y": 2036
"y": 1972
},
{
"x": 1986.8330078125,
"y": 2076
"y": 2012
}
],
"animated": false,
@ -770,19 +770,19 @@
"route": [
{
"x": 1249.3330078125,
"y": 1739
"y": 1675
},
{
"x": 1249.3330078125,
"y": 2036
"y": 1972
},
{
"x": 1866.8330078125,
"y": 2036
"y": 1972
},
{
"x": 1866.8330078125,
"y": 2076
"y": 2012
}
],
"animated": false,
@ -817,19 +817,19 @@
"route": [
{
"x": 1863,
"y": 1388
"y": 1324
},
{
"x": 1863,
"y": 1535
"y": 1471
},
{
"x": 1287.75,
"y": 1535
"y": 1471
},
{
"x": 1287.75,
"y": 1575
"y": 1511
}
],
"animated": false,

612
e2etests/testdata/txtar/c4-theme/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: 53 KiB

After

Width:  |  Height:  |  Size: 53 KiB

2
e2etests/testdata/txtar/small-c4-person/dagre/board.exp.json generated vendored
View file

@ -19,7 +19,7 @@
"y": 0
},
"width": 180,
"height": 126,
"height": 114,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,

156
e2etests/testdata/txtar/small-c4-person/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" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 182 146"><svg class="d2-144415964 d2-svg" width="182" height="146" viewBox="-1 -19 182 146"><rect x="-1.000000" y="-19.000000" width="182.000000" height="146.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-144415964 .text-bold {
font-family: "d2-144415964-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" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 182 136"><svg class="d2-1872684779 d2-svg" width="182" height="136" viewBox="-1 -21 182 136"><rect x="-1.000000" y="-21.000000" width="182.000000" height="136.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-1872684779 .text-bold {
font-family: "d2-1872684779-font-bold";
}
@font-face {
font-family: d2-144415964-font-bold;
font-family: d2-1872684779-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-144415964 .fill-N1{fill:#0A0F25;}
.d2-144415964 .fill-N2{fill:#676C7E;}
.d2-144415964 .fill-N3{fill:#9499AB;}
.d2-144415964 .fill-N4{fill:#CFD2DD;}
.d2-144415964 .fill-N5{fill:#DEE1EB;}
.d2-144415964 .fill-N6{fill:#EEF1F8;}
.d2-144415964 .fill-N7{fill:#FFFFFF;}
.d2-144415964 .fill-B1{fill:#0D32B2;}
.d2-144415964 .fill-B2{fill:#0D32B2;}
.d2-144415964 .fill-B3{fill:#E3E9FD;}
.d2-144415964 .fill-B4{fill:#E3E9FD;}
.d2-144415964 .fill-B5{fill:#EDF0FD;}
.d2-144415964 .fill-B6{fill:#F7F8FE;}
.d2-144415964 .fill-AA2{fill:#4A6FF3;}
.d2-144415964 .fill-AA4{fill:#EDF0FD;}
.d2-144415964 .fill-AA5{fill:#F7F8FE;}
.d2-144415964 .fill-AB4{fill:#EDF0FD;}
.d2-144415964 .fill-AB5{fill:#F7F8FE;}
.d2-144415964 .stroke-N1{stroke:#0A0F25;}
.d2-144415964 .stroke-N2{stroke:#676C7E;}
.d2-144415964 .stroke-N3{stroke:#9499AB;}
.d2-144415964 .stroke-N4{stroke:#CFD2DD;}
.d2-144415964 .stroke-N5{stroke:#DEE1EB;}
.d2-144415964 .stroke-N6{stroke:#EEF1F8;}
.d2-144415964 .stroke-N7{stroke:#FFFFFF;}
.d2-144415964 .stroke-B1{stroke:#0D32B2;}
.d2-144415964 .stroke-B2{stroke:#0D32B2;}
.d2-144415964 .stroke-B3{stroke:#E3E9FD;}
.d2-144415964 .stroke-B4{stroke:#E3E9FD;}
.d2-144415964 .stroke-B5{stroke:#EDF0FD;}
.d2-144415964 .stroke-B6{stroke:#F7F8FE;}
.d2-144415964 .stroke-AA2{stroke:#4A6FF3;}
.d2-144415964 .stroke-AA4{stroke:#EDF0FD;}
.d2-144415964 .stroke-AA5{stroke:#F7F8FE;}
.d2-144415964 .stroke-AB4{stroke:#EDF0FD;}
.d2-144415964 .stroke-AB5{stroke:#F7F8FE;}
.d2-144415964 .background-color-N1{background-color:#0A0F25;}
.d2-144415964 .background-color-N2{background-color:#676C7E;}
.d2-144415964 .background-color-N3{background-color:#9499AB;}
.d2-144415964 .background-color-N4{background-color:#CFD2DD;}
.d2-144415964 .background-color-N5{background-color:#DEE1EB;}
.d2-144415964 .background-color-N6{background-color:#EEF1F8;}
.d2-144415964 .background-color-N7{background-color:#FFFFFF;}
.d2-144415964 .background-color-B1{background-color:#0D32B2;}
.d2-144415964 .background-color-B2{background-color:#0D32B2;}
.d2-144415964 .background-color-B3{background-color:#E3E9FD;}
.d2-144415964 .background-color-B4{background-color:#E3E9FD;}
.d2-144415964 .background-color-B5{background-color:#EDF0FD;}
.d2-144415964 .background-color-B6{background-color:#F7F8FE;}
.d2-144415964 .background-color-AA2{background-color:#4A6FF3;}
.d2-144415964 .background-color-AA4{background-color:#EDF0FD;}
.d2-144415964 .background-color-AA5{background-color:#F7F8FE;}
.d2-144415964 .background-color-AB4{background-color:#EDF0FD;}
.d2-144415964 .background-color-AB5{background-color:#F7F8FE;}
.d2-144415964 .color-N1{color:#0A0F25;}
.d2-144415964 .color-N2{color:#676C7E;}
.d2-144415964 .color-N3{color:#9499AB;}
.d2-144415964 .color-N4{color:#CFD2DD;}
.d2-144415964 .color-N5{color:#DEE1EB;}
.d2-144415964 .color-N6{color:#EEF1F8;}
.d2-144415964 .color-N7{color:#FFFFFF;}
.d2-144415964 .color-B1{color:#0D32B2;}
.d2-144415964 .color-B2{color:#0D32B2;}
.d2-144415964 .color-B3{color:#E3E9FD;}
.d2-144415964 .color-B4{color:#E3E9FD;}
.d2-144415964 .color-B5{color:#EDF0FD;}
.d2-144415964 .color-B6{color:#F7F8FE;}
.d2-144415964 .color-AA2{color:#4A6FF3;}
.d2-144415964 .color-AA4{color:#EDF0FD;}
.d2-144415964 .color-AA5{color:#F7F8FE;}
.d2-144415964 .color-AB4{color:#EDF0FD;}
.d2-144415964 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-144415964);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-144415964);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-144415964);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-144415964);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-144415964);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-144415964);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-144415964);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-144415964);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><path d="M 0 72 C 0 62 10 54 18 54 H 162 C 172 54 180 64 180 72 V 108 C 180 118 170 126 162 126 H 18 C 8 126 0 116 0 108 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 90 -17 C 112 -17 130 1 130 23 C 130 45 112 62 90 62 C 68 62 50 45 50 23 C 50 1 68 -17 90 -17" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="90.000000" y="95.680000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c4-person</text></g><mask id="d2-144415964" maskUnits="userSpaceOnUse" x="-1" y="-19" width="182" height="146">
<rect x="-1" y="-19" width="182" height="146" fill="white"></rect>
<rect x="54.500000" y="79.680000" width="71" height="21" fill="rgba(0,0,0,0.75)"></rect>
.d2-1872684779 .fill-N1{fill:#0A0F25;}
.d2-1872684779 .fill-N2{fill:#676C7E;}
.d2-1872684779 .fill-N3{fill:#9499AB;}
.d2-1872684779 .fill-N4{fill:#CFD2DD;}
.d2-1872684779 .fill-N5{fill:#DEE1EB;}
.d2-1872684779 .fill-N6{fill:#EEF1F8;}
.d2-1872684779 .fill-N7{fill:#FFFFFF;}
.d2-1872684779 .fill-B1{fill:#0D32B2;}
.d2-1872684779 .fill-B2{fill:#0D32B2;}
.d2-1872684779 .fill-B3{fill:#E3E9FD;}
.d2-1872684779 .fill-B4{fill:#E3E9FD;}
.d2-1872684779 .fill-B5{fill:#EDF0FD;}
.d2-1872684779 .fill-B6{fill:#F7F8FE;}
.d2-1872684779 .fill-AA2{fill:#4A6FF3;}
.d2-1872684779 .fill-AA4{fill:#EDF0FD;}
.d2-1872684779 .fill-AA5{fill:#F7F8FE;}
.d2-1872684779 .fill-AB4{fill:#EDF0FD;}
.d2-1872684779 .fill-AB5{fill:#F7F8FE;}
.d2-1872684779 .stroke-N1{stroke:#0A0F25;}
.d2-1872684779 .stroke-N2{stroke:#676C7E;}
.d2-1872684779 .stroke-N3{stroke:#9499AB;}
.d2-1872684779 .stroke-N4{stroke:#CFD2DD;}
.d2-1872684779 .stroke-N5{stroke:#DEE1EB;}
.d2-1872684779 .stroke-N6{stroke:#EEF1F8;}
.d2-1872684779 .stroke-N7{stroke:#FFFFFF;}
.d2-1872684779 .stroke-B1{stroke:#0D32B2;}
.d2-1872684779 .stroke-B2{stroke:#0D32B2;}
.d2-1872684779 .stroke-B3{stroke:#E3E9FD;}
.d2-1872684779 .stroke-B4{stroke:#E3E9FD;}
.d2-1872684779 .stroke-B5{stroke:#EDF0FD;}
.d2-1872684779 .stroke-B6{stroke:#F7F8FE;}
.d2-1872684779 .stroke-AA2{stroke:#4A6FF3;}
.d2-1872684779 .stroke-AA4{stroke:#EDF0FD;}
.d2-1872684779 .stroke-AA5{stroke:#F7F8FE;}
.d2-1872684779 .stroke-AB4{stroke:#EDF0FD;}
.d2-1872684779 .stroke-AB5{stroke:#F7F8FE;}
.d2-1872684779 .background-color-N1{background-color:#0A0F25;}
.d2-1872684779 .background-color-N2{background-color:#676C7E;}
.d2-1872684779 .background-color-N3{background-color:#9499AB;}
.d2-1872684779 .background-color-N4{background-color:#CFD2DD;}
.d2-1872684779 .background-color-N5{background-color:#DEE1EB;}
.d2-1872684779 .background-color-N6{background-color:#EEF1F8;}
.d2-1872684779 .background-color-N7{background-color:#FFFFFF;}
.d2-1872684779 .background-color-B1{background-color:#0D32B2;}
.d2-1872684779 .background-color-B2{background-color:#0D32B2;}
.d2-1872684779 .background-color-B3{background-color:#E3E9FD;}
.d2-1872684779 .background-color-B4{background-color:#E3E9FD;}
.d2-1872684779 .background-color-B5{background-color:#EDF0FD;}
.d2-1872684779 .background-color-B6{background-color:#F7F8FE;}
.d2-1872684779 .background-color-AA2{background-color:#4A6FF3;}
.d2-1872684779 .background-color-AA4{background-color:#EDF0FD;}
.d2-1872684779 .background-color-AA5{background-color:#F7F8FE;}
.d2-1872684779 .background-color-AB4{background-color:#EDF0FD;}
.d2-1872684779 .background-color-AB5{background-color:#F7F8FE;}
.d2-1872684779 .color-N1{color:#0A0F25;}
.d2-1872684779 .color-N2{color:#676C7E;}
.d2-1872684779 .color-N3{color:#9499AB;}
.d2-1872684779 .color-N4{color:#CFD2DD;}
.d2-1872684779 .color-N5{color:#DEE1EB;}
.d2-1872684779 .color-N6{color:#EEF1F8;}
.d2-1872684779 .color-N7{color:#FFFFFF;}
.d2-1872684779 .color-B1{color:#0D32B2;}
.d2-1872684779 .color-B2{color:#0D32B2;}
.d2-1872684779 .color-B3{color:#E3E9FD;}
.d2-1872684779 .color-B4{color:#E3E9FD;}
.d2-1872684779 .color-B5{color:#EDF0FD;}
.d2-1872684779 .color-B6{color:#F7F8FE;}
.d2-1872684779 .color-AA2{color:#4A6FF3;}
.d2-1872684779 .color-AA4{color:#EDF0FD;}
.d2-1872684779 .color-AA5{color:#F7F8FE;}
.d2-1872684779 .color-AB4{color:#EDF0FD;}
.d2-1872684779 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-1872684779);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-1872684779);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-1872684779);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-1872684779);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-1872684779);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-1872684779);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-1872684779);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-1872684779);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><path d="M 0 68 C 0 59 9 53 15 53 H 164 C 173 53 179 62 179 68 V 99 C 179 108 170 114 164 114 H 15 C 6 114 -0 105 -0 99 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 90 -19 C 112 -19 130 -1 130 21 C 130 42 112 60 90 60 C 68 60 50 42 50 21 C 50 -1 68 -19 90 -19" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="90.000000" y="88.600000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c4-person</text></g><mask id="d2-1872684779" maskUnits="userSpaceOnUse" x="-1" y="-21" width="182" height="136">
<rect x="-1" y="-21" width="182" height="136" fill="white"></rect>
<rect x="54.500000" y="72.600000" width="71" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.7 KiB

After

Width:  |  Height:  |  Size: 9.8 KiB

2
e2etests/testdata/txtar/small-c4-person/elk/board.exp.json generated vendored
View file

@ -19,7 +19,7 @@
"y": 12
},
"width": 180,
"height": 126,
"height": 114,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,

156
e2etests/testdata/txtar/small-c4-person/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" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 182 146"><svg class="d2-1179796372 d2-svg" width="182" height="146" viewBox="11 -7 182 146"><rect x="11.000000" y="-7.000000" width="182.000000" height="146.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-1179796372 .text-bold {
font-family: "d2-1179796372-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" data-d2-version="v0.6.9-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 182 136"><svg class="d2-1815602595 d2-svg" width="182" height="136" viewBox="11 -9 182 136"><rect x="11.000000" y="-9.000000" width="182.000000" height="136.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-1815602595 .text-bold {
font-family: "d2-1815602595-font-bold";
}
@font-face {
font-family: d2-1179796372-font-bold;
font-family: d2-1815602595-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-1179796372 .fill-N1{fill:#0A0F25;}
.d2-1179796372 .fill-N2{fill:#676C7E;}
.d2-1179796372 .fill-N3{fill:#9499AB;}
.d2-1179796372 .fill-N4{fill:#CFD2DD;}
.d2-1179796372 .fill-N5{fill:#DEE1EB;}
.d2-1179796372 .fill-N6{fill:#EEF1F8;}
.d2-1179796372 .fill-N7{fill:#FFFFFF;}
.d2-1179796372 .fill-B1{fill:#0D32B2;}
.d2-1179796372 .fill-B2{fill:#0D32B2;}
.d2-1179796372 .fill-B3{fill:#E3E9FD;}
.d2-1179796372 .fill-B4{fill:#E3E9FD;}
.d2-1179796372 .fill-B5{fill:#EDF0FD;}
.d2-1179796372 .fill-B6{fill:#F7F8FE;}
.d2-1179796372 .fill-AA2{fill:#4A6FF3;}
.d2-1179796372 .fill-AA4{fill:#EDF0FD;}
.d2-1179796372 .fill-AA5{fill:#F7F8FE;}
.d2-1179796372 .fill-AB4{fill:#EDF0FD;}
.d2-1179796372 .fill-AB5{fill:#F7F8FE;}
.d2-1179796372 .stroke-N1{stroke:#0A0F25;}
.d2-1179796372 .stroke-N2{stroke:#676C7E;}
.d2-1179796372 .stroke-N3{stroke:#9499AB;}
.d2-1179796372 .stroke-N4{stroke:#CFD2DD;}
.d2-1179796372 .stroke-N5{stroke:#DEE1EB;}
.d2-1179796372 .stroke-N6{stroke:#EEF1F8;}
.d2-1179796372 .stroke-N7{stroke:#FFFFFF;}
.d2-1179796372 .stroke-B1{stroke:#0D32B2;}
.d2-1179796372 .stroke-B2{stroke:#0D32B2;}
.d2-1179796372 .stroke-B3{stroke:#E3E9FD;}
.d2-1179796372 .stroke-B4{stroke:#E3E9FD;}
.d2-1179796372 .stroke-B5{stroke:#EDF0FD;}
.d2-1179796372 .stroke-B6{stroke:#F7F8FE;}
.d2-1179796372 .stroke-AA2{stroke:#4A6FF3;}
.d2-1179796372 .stroke-AA4{stroke:#EDF0FD;}
.d2-1179796372 .stroke-AA5{stroke:#F7F8FE;}
.d2-1179796372 .stroke-AB4{stroke:#EDF0FD;}
.d2-1179796372 .stroke-AB5{stroke:#F7F8FE;}
.d2-1179796372 .background-color-N1{background-color:#0A0F25;}
.d2-1179796372 .background-color-N2{background-color:#676C7E;}
.d2-1179796372 .background-color-N3{background-color:#9499AB;}
.d2-1179796372 .background-color-N4{background-color:#CFD2DD;}
.d2-1179796372 .background-color-N5{background-color:#DEE1EB;}
.d2-1179796372 .background-color-N6{background-color:#EEF1F8;}
.d2-1179796372 .background-color-N7{background-color:#FFFFFF;}
.d2-1179796372 .background-color-B1{background-color:#0D32B2;}
.d2-1179796372 .background-color-B2{background-color:#0D32B2;}
.d2-1179796372 .background-color-B3{background-color:#E3E9FD;}
.d2-1179796372 .background-color-B4{background-color:#E3E9FD;}
.d2-1179796372 .background-color-B5{background-color:#EDF0FD;}
.d2-1179796372 .background-color-B6{background-color:#F7F8FE;}
.d2-1179796372 .background-color-AA2{background-color:#4A6FF3;}
.d2-1179796372 .background-color-AA4{background-color:#EDF0FD;}
.d2-1179796372 .background-color-AA5{background-color:#F7F8FE;}
.d2-1179796372 .background-color-AB4{background-color:#EDF0FD;}
.d2-1179796372 .background-color-AB5{background-color:#F7F8FE;}
.d2-1179796372 .color-N1{color:#0A0F25;}
.d2-1179796372 .color-N2{color:#676C7E;}
.d2-1179796372 .color-N3{color:#9499AB;}
.d2-1179796372 .color-N4{color:#CFD2DD;}
.d2-1179796372 .color-N5{color:#DEE1EB;}
.d2-1179796372 .color-N6{color:#EEF1F8;}
.d2-1179796372 .color-N7{color:#FFFFFF;}
.d2-1179796372 .color-B1{color:#0D32B2;}
.d2-1179796372 .color-B2{color:#0D32B2;}
.d2-1179796372 .color-B3{color:#E3E9FD;}
.d2-1179796372 .color-B4{color:#E3E9FD;}
.d2-1179796372 .color-B5{color:#EDF0FD;}
.d2-1179796372 .color-B6{color:#F7F8FE;}
.d2-1179796372 .color-AA2{color:#4A6FF3;}
.d2-1179796372 .color-AA4{color:#EDF0FD;}
.d2-1179796372 .color-AA5{color:#F7F8FE;}
.d2-1179796372 .color-AB4{color:#EDF0FD;}
.d2-1179796372 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-1179796372);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-1179796372);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-1179796372);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-1179796372);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-1179796372);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-1179796372);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-1179796372);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-1179796372);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><path d="M 12 84 C 12 74 22 66 30 66 H 174 C 184 66 192 76 192 84 V 120 C 192 130 182 138 174 138 H 30 C 20 138 12 128 12 120 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 102 -5 C 124 -5 142 13 142 35 C 142 57 124 74 102 74 C 80 74 62 57 62 35 C 62 13 80 -5 102 -5" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="102.000000" y="107.680000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c4-person</text></g><mask id="d2-1179796372" maskUnits="userSpaceOnUse" x="11" y="-7" width="182" height="146">
<rect x="11" y="-7" width="182" height="146" fill="white"></rect>
<rect x="66.500000" y="91.680000" width="71" height="21" fill="rgba(0,0,0,0.75)"></rect>
.d2-1815602595 .fill-N1{fill:#0A0F25;}
.d2-1815602595 .fill-N2{fill:#676C7E;}
.d2-1815602595 .fill-N3{fill:#9499AB;}
.d2-1815602595 .fill-N4{fill:#CFD2DD;}
.d2-1815602595 .fill-N5{fill:#DEE1EB;}
.d2-1815602595 .fill-N6{fill:#EEF1F8;}
.d2-1815602595 .fill-N7{fill:#FFFFFF;}
.d2-1815602595 .fill-B1{fill:#0D32B2;}
.d2-1815602595 .fill-B2{fill:#0D32B2;}
.d2-1815602595 .fill-B3{fill:#E3E9FD;}
.d2-1815602595 .fill-B4{fill:#E3E9FD;}
.d2-1815602595 .fill-B5{fill:#EDF0FD;}
.d2-1815602595 .fill-B6{fill:#F7F8FE;}
.d2-1815602595 .fill-AA2{fill:#4A6FF3;}
.d2-1815602595 .fill-AA4{fill:#EDF0FD;}
.d2-1815602595 .fill-AA5{fill:#F7F8FE;}
.d2-1815602595 .fill-AB4{fill:#EDF0FD;}
.d2-1815602595 .fill-AB5{fill:#F7F8FE;}
.d2-1815602595 .stroke-N1{stroke:#0A0F25;}
.d2-1815602595 .stroke-N2{stroke:#676C7E;}
.d2-1815602595 .stroke-N3{stroke:#9499AB;}
.d2-1815602595 .stroke-N4{stroke:#CFD2DD;}
.d2-1815602595 .stroke-N5{stroke:#DEE1EB;}
.d2-1815602595 .stroke-N6{stroke:#EEF1F8;}
.d2-1815602595 .stroke-N7{stroke:#FFFFFF;}
.d2-1815602595 .stroke-B1{stroke:#0D32B2;}
.d2-1815602595 .stroke-B2{stroke:#0D32B2;}
.d2-1815602595 .stroke-B3{stroke:#E3E9FD;}
.d2-1815602595 .stroke-B4{stroke:#E3E9FD;}
.d2-1815602595 .stroke-B5{stroke:#EDF0FD;}
.d2-1815602595 .stroke-B6{stroke:#F7F8FE;}
.d2-1815602595 .stroke-AA2{stroke:#4A6FF3;}
.d2-1815602595 .stroke-AA4{stroke:#EDF0FD;}
.d2-1815602595 .stroke-AA5{stroke:#F7F8FE;}
.d2-1815602595 .stroke-AB4{stroke:#EDF0FD;}
.d2-1815602595 .stroke-AB5{stroke:#F7F8FE;}
.d2-1815602595 .background-color-N1{background-color:#0A0F25;}
.d2-1815602595 .background-color-N2{background-color:#676C7E;}
.d2-1815602595 .background-color-N3{background-color:#9499AB;}
.d2-1815602595 .background-color-N4{background-color:#CFD2DD;}
.d2-1815602595 .background-color-N5{background-color:#DEE1EB;}
.d2-1815602595 .background-color-N6{background-color:#EEF1F8;}
.d2-1815602595 .background-color-N7{background-color:#FFFFFF;}
.d2-1815602595 .background-color-B1{background-color:#0D32B2;}
.d2-1815602595 .background-color-B2{background-color:#0D32B2;}
.d2-1815602595 .background-color-B3{background-color:#E3E9FD;}
.d2-1815602595 .background-color-B4{background-color:#E3E9FD;}
.d2-1815602595 .background-color-B5{background-color:#EDF0FD;}
.d2-1815602595 .background-color-B6{background-color:#F7F8FE;}
.d2-1815602595 .background-color-AA2{background-color:#4A6FF3;}
.d2-1815602595 .background-color-AA4{background-color:#EDF0FD;}
.d2-1815602595 .background-color-AA5{background-color:#F7F8FE;}
.d2-1815602595 .background-color-AB4{background-color:#EDF0FD;}
.d2-1815602595 .background-color-AB5{background-color:#F7F8FE;}
.d2-1815602595 .color-N1{color:#0A0F25;}
.d2-1815602595 .color-N2{color:#676C7E;}
.d2-1815602595 .color-N3{color:#9499AB;}
.d2-1815602595 .color-N4{color:#CFD2DD;}
.d2-1815602595 .color-N5{color:#DEE1EB;}
.d2-1815602595 .color-N6{color:#EEF1F8;}
.d2-1815602595 .color-N7{color:#FFFFFF;}
.d2-1815602595 .color-B1{color:#0D32B2;}
.d2-1815602595 .color-B2{color:#0D32B2;}
.d2-1815602595 .color-B3{color:#E3E9FD;}
.d2-1815602595 .color-B4{color:#E3E9FD;}
.d2-1815602595 .color-B5{color:#EDF0FD;}
.d2-1815602595 .color-B6{color:#F7F8FE;}
.d2-1815602595 .color-AA2{color:#4A6FF3;}
.d2-1815602595 .color-AA4{color:#EDF0FD;}
.d2-1815602595 .color-AA5{color:#F7F8FE;}
.d2-1815602595 .color-AB4{color:#EDF0FD;}
.d2-1815602595 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker-d2-1815602595);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker-d2-1815602595);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark-d2-1815602595);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker-d2-1815602595);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark-d2-1815602595);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal-d2-1815602595);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal-d2-1815602595);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright-d2-1815602595);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]></style><g class="YQ=="><g class="shape" ><path d="M 12 80 C 12 71 21 65 27 65 H 176 C 185 65 191 74 191 80 V 111 C 191 120 182 126 176 126 H 27 C 18 126 12 117 12 111 Z" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /><path d="M 102 -7 C 124 -7 142 11 142 33 C 142 54 124 72 102 72 C 80 72 62 54 62 33 C 62 11 80 -7 102 -7" stroke="#0D32B2" fill="#E3E9FD" class=" stroke-B1 fill-B3" style="stroke-width:2;" /></g><text x="102.000000" y="100.600000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">c4-person</text></g><mask id="d2-1815602595" maskUnits="userSpaceOnUse" x="11" y="-9" width="182" height="136">
<rect x="11" y="-9" width="182" height="136" fill="white"></rect>
<rect x="66.500000" y="84.600000" width="71" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.8 KiB

After

Width:  |  Height:  |  Size: 9.8 KiB

34
e2etests/txtar.txt
View file

@ -1187,3 +1187,37 @@ a: |md
a.shape: c4-person
a: c4-person
a.width: 180
-- c4-person-label --
c4mdperson: |md
## Personal Banking Customer
[person]
A customer of the bank, with personal bank accounts
| {
shape: c4-person
label.near: center-center
}
c4mdperson2: |md
## Personal Banking Customer
[person]
A customer of the bank, with personal bank accounts
| {
shape: c4-person
label.near: top-center
}
c4mdperson3: |md
## Personal Banking Customer
[person]
A customer of the bank, with personal bank accounts
| {
shape: c4-person
label.near: bottom-center
}

33
lib/shape/shape_c4_person.go
View file

@ -38,13 +38,20 @@ func (s shapeC4Person) GetInnerBox() *geo.Box {
headCenterY := height * 0.18
bodyTop := headCenterY + headRadius*0.8
tl := s.Box.TopLeft.Copy()
horizontalPadding := width * 0.1
tl.X += horizontalPadding
tl.Y += bodyTop + height*0.05
// Use a small fixed percentage instead of the full corner radius
horizontalPadding := width * 0.05 // 5% padding
tl := s.Box.TopLeft.Copy()
tl.X += horizontalPadding
// Add vertical padding
tl.Y += bodyTop + height*0.03
// Width minus padding on both sides
innerWidth := width - (horizontalPadding * 2)
innerHeight := height - tl.Y + s.Box.TopLeft.Y - (height * 0.05)
// Add bottom padding
innerHeight := height - (tl.Y - s.Box.TopLeft.Y) - (height * 0.03)
return geo.NewBox(tl, innerWidth, innerHeight)
}
@ -140,17 +147,23 @@ func (s shapeC4Person) GetSVGPathData() []string {
func (s shapeC4Person) GetDimensionsToFit(width, height, paddingX, paddingY float64) (float64, float64) {
contentWidth := width + paddingX
contentHeight := height + paddingY
totalWidth := contentWidth / 0.8
// Account for 10% total horizontal padding (5% on each side)
totalWidth := contentWidth / 0.9
headRadius := totalWidth * 0.22
bodyTop := totalWidth*0.18 + headRadius*0.8
verticalPaddingRatio := 0.1 // 5% top + 5% bottom
totalHeight := (contentHeight + bodyTop) / (1 - verticalPaddingRatio)
headCenterY := totalWidth * 0.18
bodyTop := headCenterY + headRadius*0.8
// Include vertical padding from GetInnerBox
verticalPadding := totalWidth * 0.06 // 3% top + 3% bottom
totalHeight := contentHeight + bodyTop + verticalPadding
minHeight := totalWidth * 1.2
if totalHeight < minHeight {
totalHeight = minHeight
}
totalWidth, totalHeight = LimitAR(totalWidth, totalHeight, C4_PERSON_AR_LIMIT)
totalWidth, totalHeight = LimitAR(totalWidth, totalHeight, C4_PERSON_AR_LIMIT)
return math.Ceil(totalWidth), math.Ceil(totalHeight)
}