graph style

Author: pikinier20

scaladoc/resources/dotty_res/scripts/ux.js

@@ -171,8 +171,8 @@ function showGraph() {
     if (dotNode) {
       var svg = d3.select("#graph");
       var radialGradient = svg.append("defs").append("radialGradient").attr("id", "Gradient");
-      radialGradient.append("stop").attr("stop-color", "var(--aureole)").attr("offset", "20%");
-      radialGradient.append("stop").attr("stop-color", "var(--code-bg)").attr("offset", "100%");
+      radialGradient.append("stop").attr("stop-color", "var(--yellow9)").attr("offset", "30%");
+      radialGradient.append("stop").attr("stop-color", "var(--background-default)").attr("offset", "100%");
 
       var inner = svg.append("g");
 
@@ -190,8 +190,10 @@ function showGraph() {
         g.setNode(v, {
           labelType: "html",
           label: g.node(v).label,
-          style: g.node(v).style,
-          id: g.node(v).id
+          class: g.node(v).class,
+          id: g.node(v).id,
+          rx: "4px",
+          ry: "4px"
         });
       });
       g.setNode("node0Cluster", {
@@ -202,9 +204,30 @@ function showGraph() {
 
       g.edges().forEach(function (v) {
         g.setEdge(v, {
-          arrowhead: "vee"
+          arrowhead: "hollowPoint",
         });
       });
+
+      render.arrows().hollowPoint = function normal(parent, id, edge, type) {
+        var marker = parent.append("marker")
+          .attr("id", id)
+          .attr("viewBox", "0 0 10 10")
+          .attr("refX", 9)
+          .attr("refY", 5)
+          .attr("markerUnits", "strokeWidth")
+          .attr("markerWidth", 12)
+          .attr("markerHeight", 12)
+          .attr("orient", "auto");
+
+        var path = marker.append("path")
+          .attr("d", "M 0 0 L 10 5 L 0 10 z")
+          .style("stroke-width", 1)
+          .style("stroke-dasharray", "1,0")
+          .style("fill", "var(--grey12)")
+          .style("stroke", "var(--grey12)");
+        dagreD3.util.applyStyle(path, edge[type + "Style"]);
+      };
+
       render(inner, g);
 
       // Set the 'fit to content graph' upon landing on the page

scaladoc/resources/dotty_res/styles/theme/components/diagram.css

@@ -35,3 +35,38 @@
   width: 100%;
   height: calc(50 * var(--base-spacing));
 }
+
+#inheritance-diagram .vertex {
+  border-radius: 4px;
+}
+
+/* Colors */
+
+#inheritance-diagram span, #inheritance-diagram a {
+  color: var(--grey1) !important;
+}
+
+#inheritance-diagram .edgePath {
+  stroke: var(--grey12);
+}
+
+#inheritance-diagram .class {
+  fill: var(--mint11);
+}
+
+#inheritance-diagram .trait {
+  fill: var(--sky11);
+}
+
+#inheritance-diagram .object {
+  fill: var(--indigo11);
+}
+
+#inheritance-diagram .enum {
+  fill: var(--orange11);
+}
+
+#inheritance-diagram .enumcase {
+  fill: var(--orange11);
+}
+

scaladoc/src/dotty/tools/scaladoc/renderers/DotDiagramBuilder.scala

@@ -5,18 +5,20 @@ import util.HTML._
 
 object DotDiagramBuilder:
   def build(diagram: HierarchyGraph, renderer: SignatureRenderer)(using DocContext): String =
-    def getStyle(kind: Kind) = kind match
-      case _ : Kind.Class => "fill: #45AD7D;"
-      case Kind.Object => "fill: #285577;"
-      case _ : Kind.Trait => "fill: #1CAACF;"
-      case e if e.isInstanceOf[Kind.Enum] => "fill: #B66722;"
-      case e if e.isInstanceOf[Kind.EnumCase] => "fill: #B66722;"
-      case other => report.error(s"unexpected value: $other")
+    def getClasses(kind: Kind): String =
+      val kindClass = kind match
+        case _ : Kind.Class => "class"
+        case Kind.Object => "object"
+        case _ : Kind.Trait => "trait"
+        case e if e.isInstanceOf[Kind.Enum] => "enum"
+        case e if e.isInstanceOf[Kind.EnumCase] => "enumcase"
+        case other => report.error(s"unexpected value: $other")
+      s"$kindClass vertex"
 
     val vWithId = diagram.verteciesWithId
     val sealedNodes = diagram.sealedNodes
     val vertecies = vWithId.toList.sortBy((_, id) => id).map { (vertex, id) =>
-      s"""node${id} [id=node${id}, label="${getHtmlLabel(vertex, renderer, sealedNodes)}", style="${getStyle(vertex.kind)}"];\n"""
+      s"""node${id} [id=node${id}, label="${getHtmlLabel(vertex, renderer, sealedNodes)}", class="${getClasses(vertex.kind)}"];\n"""
     }.mkString
 
     val edges = diagram.edges.map { (from, to) =>