diff --git a/d2renderers/d2svg/d2svg.go b/d2renderers/d2svg/d2svg.go index 1c16261c3..434b97bc2 100644 --- a/d2renderers/d2svg/d2svg.go +++ b/d2renderers/d2svg/d2svg.go @@ -1746,9 +1746,10 @@ func drawShape(writer, appendixWriter io.Writer, diagramHash string, targetShape } if !color.IsThemeColor(targetShape.Color) { styles = append(styles, fmt.Sprintf(`color:%s`, targetShape.Color)) - } else { + } else if inlineTheme != nil { styles = append(styles, fmt.Sprintf(`color:%s`, d2themes.ResolveThemeColor(*inlineTheme, targetShape.Color))) } + // When using dark theme, inlineTheme is nil and we rely on CSS variables mdEl.Style = strings.Join(styles, ";") diff --git a/e2etests/testdata/txtar/dark-theme-shape/dagre/board.exp.json b/e2etests/testdata/txtar/dark-theme-shape/dagre/board.exp.json new file mode 100644 index 000000000..f3333ec26 --- /dev/null +++ b/e2etests/testdata/txtar/dark-theme-shape/dagre/board.exp.json @@ -0,0 +1,99 @@ +{ + "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": 200, + "pad": null, + "center": null, + "layoutEngine": null + }, + "isFolderOnly": false, + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "a", + "type": "rectangle", + "pos": { + "x": 0, + "y": 0 + }, + "width": 96, + "height": 96, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "B6", + "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": "# hey", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "markdown", + "color": "N1", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 51, + "labelHeight": 51, + "labelPosition": "INSIDE_MIDDLE_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 + } +} diff --git a/e2etests/testdata/txtar/dark-theme-shape/dagre/sketch.exp.svg b/e2etests/testdata/txtar/dark-theme-shape/dagre/sketch.exp.svg new file mode 100644 index 000000000..a297d152f --- /dev/null +++ b/e2etests/testdata/txtar/dark-theme-shape/dagre/sketch.exp.svg @@ -0,0 +1,908 @@ +

hey

+
 + + + \ No newline at end of file diff --git a/e2etests/testdata/txtar/dark-theme-shape/elk/board.exp.json b/e2etests/testdata/txtar/dark-theme-shape/elk/board.exp.json new file mode 100644 index 000000000..c467d88ac --- /dev/null +++ b/e2etests/testdata/txtar/dark-theme-shape/elk/board.exp.json @@ -0,0 +1,99 @@ +{ + "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": 200, + "pad": null, + "center": null, + "layoutEngine": null + }, + "isFolderOnly": false, + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "a", + "type": "rectangle", + "pos": { + "x": 12, + "y": 12 + }, + "width": 96, + "height": 96, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "B6", + "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": "# hey", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "markdown", + "color": "N1", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 51, + "labelHeight": 51, + "labelPosition": "INSIDE_MIDDLE_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 + } +} diff --git a/e2etests/testdata/txtar/dark-theme-shape/elk/sketch.exp.svg b/e2etests/testdata/txtar/dark-theme-shape/elk/sketch.exp.svg new file mode 100644 index 000000000..6409b8037 --- /dev/null +++ b/e2etests/testdata/txtar/dark-theme-shape/elk/sketch.exp.svg @@ -0,0 +1,908 @@ +

hey

+
 + + + \ No newline at end of file diff --git a/e2etests/testdata/txtar/small-c4-person/dagre/board.exp.json b/e2etests/testdata/txtar/small-c4-person/dagre/board.exp.json new file mode 100644 index 000000000..be4ffa74e --- /dev/null +++ b/e2etests/testdata/txtar/small-c4-person/dagre/board.exp.json @@ -0,0 +1,99 @@ +{ + "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, + "isFolderOnly": false, + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "a", + "type": "c4-person", + "pos": { + "x": 0, + "y": 0 + }, + "width": 180, + "height": 114, + "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": "c4-person", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "N1", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 71, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_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 + } +} diff --git a/e2etests/testdata/txtar/small-c4-person/dagre/sketch.exp.svg b/e2etests/testdata/txtar/small-c4-person/dagre/sketch.exp.svg new file mode 100644 index 000000000..afeff911b --- /dev/null +++ b/e2etests/testdata/txtar/small-c4-person/dagre/sketch.exp.svg @@ -0,0 +1,95 @@ +c4-person + + + \ No newline at end of file diff --git a/e2etests/testdata/txtar/small-c4-person/elk/board.exp.json b/e2etests/testdata/txtar/small-c4-person/elk/board.exp.json new file mode 100644 index 000000000..899afe63f --- /dev/null +++ b/e2etests/testdata/txtar/small-c4-person/elk/board.exp.json @@ -0,0 +1,99 @@ +{ + "name": "", + "config": { + "sketch": false, + "themeID": 0, + "darkThemeID": null, + "pad": null, + "center": null, + "layoutEngine": null + }, + "isFolderOnly": false, + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "a", + "type": "c4-person", + "pos": { + "x": 12, + "y": 12 + }, + "width": 180, + "height": 114, + "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": "c4-person", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "N1", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 71, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_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 + } +} diff --git a/e2etests/testdata/txtar/small-c4-person/elk/sketch.exp.svg b/e2etests/testdata/txtar/small-c4-person/elk/sketch.exp.svg new file mode 100644 index 000000000..68477ef9d --- /dev/null +++ b/e2etests/testdata/txtar/small-c4-person/elk/sketch.exp.svg @@ -0,0 +1,95 @@ +c4-person + + + \ No newline at end of file diff --git a/e2etests/txtar.txt b/e2etests/txtar.txt index 591372192..d20dbb221 100644 --- a/e2etests/txtar.txt +++ b/e2etests/txtar.txt @@ -1169,3 +1169,21 @@ api-1 <-> api-2: { api-1 -> api-3: { target-arrowhead.shape: circle } + +-- dark-theme-md -- + +vars: { + d2-config: { + dark-theme-id: 200 + } +} +a.shape: rectangle +a: |md + # hey +| + +-- small-c4-person -- + +a.shape: c4-person +a: c4-person +a.width: 180 diff --git a/lib/shape/shape_c4_person.go b/lib/shape/shape_c4_person.go index eb70c2a62..8535c5b79 100644 --- a/lib/shape/shape_c4_person.go +++ b/lib/shape/shape_c4_person.go @@ -61,7 +61,9 @@ func bodyPath(box *geo.Box) *svg.SvgPathContext { bodyWidth := width bodyHeight := height - bodyTop bodyLeft := 0 - cornerRadius := width * 0.175 + // Ensure cornerRadius is constrained to a portion of the shortest dimension + // This prevents distorted corners when width is large compared to height + cornerRadius := math.Min(width*0.175, bodyHeight*0.25) pc.StartAt(pc.Absolute(float64(bodyLeft), bodyTop+cornerRadius))