c4 theme

Author: alixander

d2exporter/export.go

@@ -79,6 +79,46 @@ func applyTheme(shape *d2target.Shape, obj *d2graph.Object, theme *d2themes.Them
 		if theme.SpecialRules.Mono {
 			shape.FontFamily = "mono"
 		}
+		if theme.SpecialRules.C4 && len(obj.ChildrenArray) > 0 {
+			if obj.Style.Fill == nil {
+				shape.Fill = "transparent"
+			}
+			if obj.Style.Stroke == nil {
+				shape.Stroke = color.AA2
+			}
+			if obj.Style.StrokeDash == nil {
+				shape.StrokeDash = 5
+			}
+			if obj.Style.FontColor == nil {
+				shape.Color = color.N1
+			}
+		}
+	}
+	if theme.SpecialRules.C4 && obj.Level() == 1 && len(obj.ChildrenArray) == 0 &&
+		obj.Shape.Value != d2target.ShapePerson && obj.Shape.Value != d2target.ShapeC4Person {
+		if obj.Style.Fill == nil {
+			shape.Fill = color.B6
+		}
+		if obj.Style.Stroke == nil {
+			shape.Stroke = color.B5
+		}
+	}
+	if theme.SpecialRules.C4 && (obj.Shape.Value == d2target.ShapePerson || obj.Shape.Value == d2target.ShapeC4Person) {
+		if obj.Style.Fill == nil {
+			shape.Fill = color.B2
+		}
+		if obj.Style.Stroke == nil {
+			shape.Stroke = color.B1
+		}
+	}
+	if theme.SpecialRules.C4 && obj.Level() > 1 && len(obj.ChildrenArray) == 0 &&
+		obj.Shape.Value != d2target.ShapePerson && obj.Shape.Value != d2target.ShapeC4Person {
+		if obj.Style.Fill == nil {
+			shape.Fill = color.B4
+		}
+		if obj.Style.Stroke == nil {
+			shape.Stroke = color.B3
+		}
 	}
 }
 
@@ -165,6 +205,15 @@ func toShape(obj *d2graph.Object, g *d2graph.Graph) d2target.Shape {
 	applyStyles(shape, obj)
 	applyTheme(shape, obj, g.Theme)
 	shape.Color = text.GetColor(shape.Italic)
+	if g.Theme.SpecialRules.C4 {
+		if obj.Style.FontColor == nil {
+			if len(obj.ChildrenArray) > 0 {
+				shape.Color = color.N1
+			} else {
+				shape.Color = color.N7
+			}
+		}
+	}
 	applyStyles(shape, obj)
 
 	switch strings.ToLower(obj.Shape.Value) {
@@ -393,5 +442,17 @@ func toConnection(edge *d2graph.Edge, theme *d2themes.Theme) d2target.Connection
 	connection.Src = edge.Src.AbsID()
 	connection.Dst = edge.Dst.AbsID()
 
+	if theme != nil && theme.SpecialRules.C4 {
+		if edge.Style.StrokeDash == nil {
+			connection.StrokeDash = 5
+		}
+		if edge.Style.Stroke == nil {
+			connection.Stroke = color.AA4
+		}
+		if edge.Style.FontColor == nil {
+			connection.Color = color.N2
+		}
+	}
+
 	return *connection
 }

d2graph/d2graph.go

@@ -565,7 +565,7 @@ func (obj *Object) GetFill() string {
 		return color.AB5
 	}
 
-	if strings.EqualFold(shape, d2target.ShapePerson) {
+	if strings.EqualFold(shape, d2target.ShapePerson) || strings.EqualFold(shape, d2target.ShapeC4Person) {
 		return color.B3
 	}
 	if strings.EqualFold(shape, d2target.ShapeDiamond) {

d2renderers/d2svg/d2svg.go

@@ -1483,6 +1483,8 @@ func drawShape(writer, appendixWriter io.Writer, diagramHash string, targetShape
 			}
 			if !color.IsThemeColor(targetShape.Color) {
 				styles = append(styles, fmt.Sprintf(`color:%s`, targetShape.Color))
+			} else {
+				styles = append(styles, fmt.Sprintf(`color:%s`, d2themes.ResolveThemeColor(*inlineTheme, targetShape.Color)))
 			}
 
 			mdEl.Style = strings.Join(styles, ";")

d2target/d2target.go

@@ -280,6 +280,13 @@ func (diagram Diagram) BoundingBox() (topLeft, bottomRight Point) {
 		x2 = go2.Max(x2, targetShape.Pos.X+targetShape.Width+int(math.Ceil(float64(targetShape.StrokeWidth)/2.)))
 		y2 = go2.Max(y2, targetShape.Pos.Y+targetShape.Height+int(math.Ceil(float64(targetShape.StrokeWidth)/2.)))
 
+		if targetShape.Type == ShapeC4Person {
+			headRadius := int(float64(targetShape.Width) * 0.22)
+			headCenterY := int(float64(targetShape.Height) * 0.18)
+			headTop := targetShape.Pos.Y + headCenterY - headRadius
+			y1 = go2.Min(y1, headTop-targetShape.StrokeWidth)
+		}
+
 		if targetShape.Tooltip != "" || targetShape.Link != "" {
 			// 16 is the icon radius
 			y1 = go2.Min(y1, targetShape.Pos.Y-targetShape.StrokeWidth-16)

d2themes/d2themes.go

@@ -21,6 +21,7 @@ type SpecialRules struct {
 	OuterContainerDoubleBorder bool `json:"outerContainerDoubleBorder"`
 	ContainerDots              bool `json:"containerDots"`
 	CapsLock                   bool `json:"capsLock"`
+	C4                         bool `json:"c4"`
 
 	AllPaper bool `json:"allPaper"`
 }

d2themes/d2themescatalog/c4.go

@@ -0,0 +1,38 @@
+package d2themescatalog
+
+import "oss.terrastruct.com/d2/d2themes"
+
+var C4 = d2themes.Theme{
+	ID:   303,
+	Name: "C4",
+	Colors: d2themes.ColorPalette{
+		Neutrals: d2themes.Neutral{
+			N1: "#0f5eaa", // Container font color
+			N2: "#707070", // Connection font color
+			N3: "#FFFFFF",
+			N4: "#073b6f", // Person stroke
+			N5: "#999999", // Root level objects
+			N6: "#FFFFFF",
+			N7: "#FFFFFF",
+		},
+
+		// Primary colors
+		B1: "#073b6f", // Person stroke
+		B2: "#08427b", // Person fill
+		B3: "#3c7fc0", // Inner objects stroke
+		B4: "#438dd5", // Inner objects fill
+		B5: "#8a8a8a", // Root level objects stroke
+		B6: "#999999", // Root level objects fill
+
+		// Accent colors
+		AA2: "#0f5eaa", // Container stroke
+		AA4: "#707070", // Connection stroke
+		AA5: "#f5f5f5", // Light background
+
+		AB4: "#e1e1e1",
+		AB5: "#f0f0f0",
+	},
+	SpecialRules: d2themes.SpecialRules{
+		C4: true,
+	},
+}

d2themes/d2themescatalog/catalog.go

@@ -25,6 +25,7 @@ var LightCatalog = []d2themes.Theme{
 	Terminal,
 	TerminalGrayscale,
 	Origami,
+	C4,
 }
 
 var DarkCatalog = []d2themes.Theme{