use inline theme

d2renderers/d2svg/appendix/appendix.go

@@ -81,7 +81,7 @@ func Append(diagram *d2target.Diagram, ruler *textmeasure.Ruler, in []byte) []by
 	viewboxHeight, _ := strconv.Atoi(viewboxSlice[3])
 
 	tl, br := diagram.BoundingBox()
-	separatorEl := d2themes.NewThemableElement("line")
+	separatorEl := d2themes.NewThemableElement("line", nil)
 	separatorEl.X1 = float64(tl.X - PAD_SIDES)
 	separatorEl.Y1 = float64(br.Y + PAD_TOP)
 	separatorEl.X2 = float64(go2.IntMax(w, br.X) + PAD_SIDES)

d2renderers/d2svg/d2svg.go

@@ -1882,9 +1882,9 @@ func Render(diagram *d2target.Diagram, opts *RenderOpts) ([]byte, error) {
 
 	var labelMasks []string
 	markers := map[string]struct{}{}
-	// We only want to inline when no dark theme is specified, otherwise the inline style will override the CSS
 	var inlineTheme *d2themes.Theme
-	if darkThemeID != nil {
+	// We only want to inline when no dark theme is specified, otherwise the inline style will override the CSS
+	if darkThemeID == nil {
 		inlineTheme = go2.Pointer(d2themescatalog.Find(themeID))
 		inlineTheme.ApplyOverrides(opts.ThemeOverrides)
 	}

d2themes/element.go

@@ -49,6 +49,8 @@ type ThemableElement struct {
 	ClipPath string
 
 	FillPattern string
+
+	inlineTheme *Theme
 }
 
 func NewThemableElement(tag string, inlineTheme *Theme) *ThemableElement {
@@ -89,6 +91,7 @@ func NewThemableElement(tag string, inlineTheme *Theme) *ThemableElement {
 		"",
 		"",
 		"",
+		inlineTheme,
 	}
 }
 
@@ -177,6 +180,9 @@ func (el *ThemableElement) Render() string {
 	// Add class {property}-{theme color} if the color is from a theme, set the property otherwise
 	if color.IsThemeColor(el.Stroke) {
 		class += fmt.Sprintf(" stroke-%s", el.Stroke)
+		if el.inlineTheme != nil {
+			out += fmt.Sprintf(` stroke="%s"`, ResolveThemeColor(*el.inlineTheme, el.Stroke))
+		}
 	} else if len(el.Stroke) > 0 {
 		if color.IsGradient(el.Stroke) {
 			el.Stroke = fmt.Sprintf("url('#%s')", color.UniqueGradientID(el.Stroke))
@@ -185,6 +191,9 @@ func (el *ThemableElement) Render() string {
 	}
 	if color.IsThemeColor(el.Fill) {
 		class += fmt.Sprintf(" fill-%s", el.Fill)
+		if el.inlineTheme != nil {
+			out += fmt.Sprintf(` fill="%s"`, ResolveThemeColor(*el.inlineTheme, el.Fill))
+		}
 	} else if len(el.Fill) > 0 {
 		if color.IsGradient(el.Fill) {
 			el.Fill = fmt.Sprintf("url('#%s')", color.UniqueGradientID(el.Fill))
@@ -193,11 +202,17 @@ func (el *ThemableElement) Render() string {
 	}
 	if color.IsThemeColor(el.BackgroundColor) {
 		class += fmt.Sprintf(" background-color-%s", el.BackgroundColor)
+		if el.inlineTheme != nil {
+			out += fmt.Sprintf(` background-color="%s"`, ResolveThemeColor(*el.inlineTheme, el.BackgroundColor))
+		}
 	} else if len(el.BackgroundColor) > 0 {
 		out += fmt.Sprintf(` background-color="%s"`, el.BackgroundColor)
 	}
 	if color.IsThemeColor(el.Color) {
 		class += fmt.Sprintf(" color-%s", el.Color)
+		if el.inlineTheme != nil {
+			out += fmt.Sprintf(` color="%s"`, ResolveThemeColor(*el.inlineTheme, el.Color))
+		}
 	} else if len(el.Color) > 0 {
 		out += fmt.Sprintf(` color="%s"`, el.Color)
 	}