Merge pull request #17828 from vespa-engine/jonmv/badge-adjustments

Jonmv/badge adjustments

5 files changed, 198 insertions, 194 deletions

diff --git a/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiHandler.java b/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiHandler.java
index 6fef422b811..ff24253128b 100644
--- a/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiHandler.java
+++ b/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiHandler.java
@@ -6,17 +6,19 @@ import com.yahoo.container.jdisc.HttpRequest;
 import com.yahoo.container.jdisc.HttpResponse;
 import com.yahoo.container.jdisc.LoggingRequestHandler;
 import com.yahoo.jdisc.http.HttpRequest.Method;
+import com.yahoo.restapi.ErrorResponse;
 import com.yahoo.restapi.Path;
 import com.yahoo.vespa.hosted.controller.Controller;
 import com.yahoo.vespa.hosted.controller.api.integration.deployment.JobId;
 import com.yahoo.vespa.hosted.controller.api.integration.deployment.JobType;
-import com.yahoo.restapi.ErrorResponse;
 import com.yahoo.vespa.hosted.controller.application.TenantAndApplicationId;
 import com.yahoo.vespa.hosted.controller.deployment.DeploymentStatus;
+import com.yahoo.vespa.hosted.controller.deployment.JobStatus;
 import com.yahoo.yolean.Exceptions;
 
 import java.io.IOException;
 import java.io.OutputStream;
+import java.util.function.Predicate;
 import java.util.logging.Level;
 import java.util.logging.Logger;
 
@@ -68,8 +70,9 @@ public class BadgeApiHandler extends LoggingRequestHandler {
     private HttpResponse badge(String tenant, String application, String instance) {
         ApplicationId id = ApplicationId.from(tenant, application, instance);
         DeploymentStatus status = controller.jobController().deploymentStatus(controller.applications().requireApplication(TenantAndApplicationId.from(id)));
+        Predicate<JobStatus> isDeclaredJob = job -> status.jobSteps().get(job.id()) != null && status.jobSteps().get(job.id()).isDeclared();
         return svgResponse(Badges.overviewBadge(id,
-                                                status.jobs().instance(id.instance()),
+                                                status.jobs().instance(id.instance()).matching(isDeclaredJob),
                                                 controller.system()));
     }
 
diff --git a/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/Badges.java b/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/Badges.java
index 006da9f4439..f17ec6afb8f 100644
--- a/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/Badges.java
+++ b/controller-server/src/main/java/com/yahoo/vespa/hosted/controller/restapi/deployment/Badges.java
@@ -41,9 +41,14 @@ public class Badges {
         return 32 <= codePoint && codePoint <= 126 ? widths[codePoint - 32] : widths[95];
     }
 
-    /** Computes an approximate pixel width of a 10px size Verdana font rendering of the given string, ignoring kerning. */
+    /** Computes an approximate pixel width of the given size Verdana font rendering of the given string, ignoring kerning. */
+    public static double widthOf(String text, int size) {
+        return text.codePoints().mapToDouble(Badges::widthOf).sum() * (size - 0.5) / 100;
+    }
+
+    /** Computes an approximate pixel width of a 11px size Verdana font rendering of the given string, ignoring kerning. */
     public static double widthOf(String text) {
-        return text.codePoints().mapToDouble(Badges::widthOf).sum() / 10;
+        return widthOf(text, 11);
     }
 
     static String colorOf(Run run, Boolean wasOk) {
@@ -63,16 +68,20 @@ public class Badges {
                              : type.jobName().replace("production-", "");
     }
 
-    static final double xPad = 8;
+    static final double xPad = 6;
     static final double logoSize = 16;
     static final String dark = "#5a5a5a";
-    static final String success = "#00ff48";
+    static final String success = "#00f244";
     static final String running = "#ab83ff";
     static final String failure = "#bf103c";
 
     static void addText(List<String> texts, String text, double x, double width) {
-        texts.add("        <text x='" + (x + 0.5) + "' y='14' fill='#000' fill-opacity='.3' textLength='" + width + "'>" + text + "</text>\n");
-        texts.add("        <text x='" + x + "' y='13' fill='#fff' textLength='" + width + "'>" + text + "</text>\n");
+        addText(texts, text, x, width, 11);
+    }
+
+    static void addText(List<String> texts, String text, double x, double width, int size) {
+        texts.add("        <text font-size='" + size + "' x='" + (x + 0.5) + "' y='" + (15) + "' fill='#000' fill-opacity='.4' textLength='" + width + "'>" + text + "</text>\n");
+        texts.add("        <text font-size='" + size + "' x='" + x + "' y='" + (14) + "' fill='#fff' textLength='" + width + "'>" + text + "</text>\n");
     }
 
     static void addShade(List<String> sections, double x, double width) {
@@ -119,7 +128,7 @@ public class Badges {
         addText(texts, text, x + dx / 2, textWidth);
         x += dx;
 
-        dx = xPad * (128.0 / (32 + runs.size())); // Broader sections with shorter history.
+        dx = xPad * (192.0 / (32 + runs.size())); // Broader sections with shorter history.
         for (Run run : runs) {
             addShade(sections, x, dx);
             sections.add("        <rect x='" + (x - 6) + "' rx='3' width='" + (dx + 6) + "' height='20' fill='" + colorOf(run, null) + "'/>\n");
@@ -135,11 +144,13 @@ public class Badges {
     static String overviewBadge(ApplicationId id, JobList jobs, SystemName system) {
         // Put production tests right after their deployments, for a more compact rendering.
         List<Run> runs = new ArrayList<>(jobs.lastTriggered().asList());
+        boolean anyTest = false;
         for (int i = 0; i < runs.size(); i++) {
             Run run = runs.get(i);
             if (run.id().type().isProduction() && run.id().type().isTest()) {
+                anyTest = true;
                 int j = i;
-                while (!runs.get(j - 1).id().type().zone(system).equals(run.id().type().zone(system)))
+                while ( ! runs.get(j - 1).id().type().zone(system).equals(run.id().type().zone(system)))
                     runs.set(j, runs.get(--j));
                 runs.set(j, run);
             }
@@ -167,17 +178,17 @@ public class Badges {
 
             boolean isTest = run.id().type().isTest() && run.id().type().isProduction();
             text = nameOf(run.id().type());
-            textWidth = widthOf(text);
+            textWidth = widthOf(text, isTest ? 9 : 11);
             dx = xPad + textWidth + (isTest ? 0 : xPad);
             boolean wasOk = jobs.get(run.id().job()).flatMap(JobStatus::lastStatus).map(RunStatus.success::equals).orElse(true);
 
-            addText(texts, text, x + (dx - (isTest ? xPad : 0)) / 2, textWidth);
+            addText(texts, text, x + (dx - (isTest ? xPad : 0)) / 2, textWidth, isTest ? 9 : 11);
 
             // Add "deploy" when appropriate
-            if ( ! run.id().type().isTest()) {
+            if ( ! run.id().type().isTest() && anyTest) {
                 String deploy = "deploy";
-                textWidth = widthOf(deploy);
-                addText(texts, deploy, x + dx + textWidth / 2, textWidth);
+                textWidth = widthOf(deploy, 9);
+                addText(texts, deploy, x + dx + textWidth / 2, textWidth, 9);
                 dx += textWidth + xPad;
             }
 
@@ -190,7 +201,7 @@ public class Badges {
                 sections.add("        <rect x='" + (x - 16) + "' rx='3' width='" + (dx + 16) + "' height='20' fill='" + colorOf(run, wasOk) + "'/>\n");
             // ... with a slant if a test is next.
             else
-                sections.add("        <polygon points='" + (x - 6) + " 0 " + (x - 6) + " 20 " + (x + dx - 8.5) + " 20 " + (x + dx - 0.5) + " 0' fill='" + colorOf(run, wasOk) + "'/>\n");
+                sections.add("        <polygon points='" + (x - 6) + " 0 " + (x - 6) + " 20 " + (x + dx - 7) + " 20 " + (x + dx + 1) + " 0' fill='" + colorOf(run, wasOk) + "'/>\n");
 
             // Cast a shadow onto the next zone ...
             if (test == null)
@@ -262,7 +273,7 @@ public class Badges {
                "        <rect x='" + (width - 2) + "' width='" + 2 + "' height='20' fill='url(#right-shadow)'/>\n" +
                "        <rect width='" + width + "' height='20' fill='url(#light)'/>\n" +
                "    </g>\n" +
-               "    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='10'>\n" +
+               "    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='11'>\n" +
                // The vespa.ai logo (with a slightly coloured shadow)!
                "        <svg x='" + (xPad + 0.5) + "' y='" + ((20 - logoSize) / 2 + 1) + "' width='" + logoSize + "' height='" + logoSize + "' viewBox='0 0 150 150'>\n" +
                "            <polygon fill='#402a14' fill-opacity='0.5' points='84.84 10 34.1 44.46 34.1 103.78 84.84 68.02 135.57 103.78 135.57 44.46 84.84 10'/>\n" +
diff --git a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiTest.java b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiTest.java
index 21d8030dbee..ebde4671859 100644
--- a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiTest.java
+++ b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/BadgeApiTest.java
@@ -28,7 +28,6 @@ public class BadgeApiTest extends ControllerContainerTest {
         ApplicationPackage applicationPackage = new ApplicationPackageBuilder().systemTest()
                                                                                .parallel("us-west-1", "aws-us-east-1a")
                                                                                .test("us-west-1")
-                                                                               .test("aws-us-east-1a")
                                                                                .region("ap-southeast-1")
                                                                                .test("ap-southeast-1")
                                                                                .region("eu-west-1")
@@ -41,7 +40,6 @@ public class BadgeApiTest extends ControllerContainerTest {
                    .runJob(JobType.productionUsWest1)
                    .runJob(JobType.productionAwsUsEast1a)
                    .runJob(JobType.testUsWest1)
-                   .runJob(JobType.testAwsUsEast1a)
                    .runJob(JobType.productionApSoutheast1)
                    .failDeployment(JobType.testApSoutheast1);
         application.submit(applicationPackage)
diff --git a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/history.svg b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/history.svg
index a081b21ec3f..2bd6aac9ac3 100644
--- a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/history.svg
+++ b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/history.svg
@@ -1,4 +1,4 @@
-<svg xmlns='http://www.w3.org/2000/svg' width='616.7390658896196' height='20' role='img' aria-label='Deployment Status'>
+<svg xmlns='http://www.w3.org/2000/svg' width='659.058159125822' height='20' role='img' aria-label='Deployment Status'>
     <title>Deployment Status</title>
     <linearGradient id='light' x2='0' y2='100%'>
         <stop offset='0'  stop-color='#fff' stop-opacity='.5'/>
@@ -34,127 +34,127 @@
     </linearGradient>
     <linearGradient id='run-on-success' x1='40%' x2='80%' y2='0%'>
         <stop offset='0' stop-color='#ab83ff' />
-        <stop offset='1' stop-color='#00ff48' />
+        <stop offset='1' stop-color='#00f244' />
         <animate attributeName='x1' values='-110%;150%;20%;-110%' dur='6s' repeatCount='indefinite' />
         <animate attributeName='x2' values='-10%;250%;120%;-10%' dur='6s' repeatCount='indefinite' />
     </linearGradient>
     <clipPath id='rounded'>
-        <rect width='616.7390658896196' height='20' rx='3' fill='#fff'/>
+        <rect width='659.058159125822' height='20' rx='3' fill='#fff'/>
     </clipPath>
     <g clip-path='url(#rounded)'>
-        <rect x='610.9256720815912' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='604.6322196342305' rx='3' width='12.293452447360632' height='20' fill='#00ff48'/>
-        <rect x='604.6322196342305' rx='3' width='12.293452447360632' height='20' fill='url(#shade)'/>
-        <rect x='604.8245279299437' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='598.3387671868699' rx='3' width='12.485760743073765' height='20' fill='#bf103c'/>
-        <rect x='598.3387671868699' rx='3' width='12.485760743073765' height='20' fill='url(#shade)'/>
-        <rect x='598.5369518248465' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='591.8530064437961' rx='3' width='12.68394538105045' height='20' fill='#bf103c'/>
-        <rect x='591.8530064437961' rx='3' width='12.68394538105045' height='20' fill='url(#shade)'/>
-        <rect x='592.0572469867445' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='585.1690610627456' rx='3' width='12.888185923998947' height='20' fill='#bf103c'/>
-        <rect x='585.1690610627456' rx='3' width='12.888185923998947' height='20' fill='url(#shade)'/>
-        <rect x='585.3795425602511' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='578.2808751387468' rx='3' width='13.098667421504338' height='20' fill='#bf103c'/>
-        <rect x='578.2808751387468' rx='3' width='13.098667421504338' height='20' fill='url(#shade)'/>
-        <rect x='578.4977882949328' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='571.1822077172424' rx='3' width='13.31558057769039' height='20' fill='#bf103c'/>
-        <rect x='571.1822077172424' rx='3' width='13.31558057769039' height='20' fill='url(#shade)'/>
-        <rect x='571.4057490635566' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='563.866627139552' rx='3' width='13.539121924004645' height='20' fill='#bf103c'/>
-        <rect x='563.866627139552' rx='3' width='13.539121924004645' height='20' fill='url(#shade)'/>
-        <rect x='564.0969992128305' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='556.3275052155473' rx='3' width='13.769493997283261' height='20' fill='#bf103c'/>
-        <rect x='556.3275052155473' rx='3' width='13.769493997283261' height='20' fill='url(#shade)'/>
-        <rect x='556.564916741521' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='548.558011218264' rx='3' width='14.006905523256986' height='20' fill='#bf103c'/>
-        <rect x='548.558011218264' rx='3' width='14.006905523256986' height='20' fill='url(#shade)'/>
-        <rect x='548.8026773006716' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='540.5511056950071' rx='3' width='14.251571605664486' height='20' fill='#bf103c'/>
-        <rect x='540.5511056950071' rx='3' width='14.251571605664486' height='20' fill='url(#shade)'/>
-        <rect x='540.803248010487' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='532.2995340893426' rx='3' width='14.503713921144396' height='20' fill='#bf103c'/>
-        <rect x='532.2995340893426' rx='3' width='14.503713921144396' height='20' fill='url(#shade)'/>
-        <rect x='532.5593810882809' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='523.7958201681982' rx='3' width='14.763560920082657' height='20' fill='#bf103c'/>
-        <rect x='523.7958201681982' rx='3' width='14.763560920082657' height='20' fill='url(#shade)'/>
-        <rect x='524.0636072817127' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='515.0322592481156' rx='3' width='15.031348033597132' height='20' fill='#bf103c'/>
-        <rect x='515.0322592481156' rx='3' width='15.031348033597132' height='20' fill='url(#shade)'/>
-        <rect x='515.3082291013654' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='506.0009112145184' rx='3' width='15.307317886847013' height='20' fill='#bf103c'/>
-        <rect x='506.0009112145184' rx='3' width='15.307317886847013' height='20' fill='url(#shade)'/>
-        <rect x='506.2853138465317' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='496.6935933276714' rx='3' width='15.591720518860313' height='20' fill='#bf103c'/>
-        <rect x='496.6935933276714' rx='3' width='15.591720518860313' height='20' fill='url(#shade)'/>
-        <rect x='496.9866864178897' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='487.1018728088111' rx='3' width='15.884813609078591' height='20' fill='#bf103c'/>
-        <rect x='487.1018728088111' rx='3' width='15.884813609078591' height='20' fill='url(#shade)'/>
-        <rect x='487.4039219105567' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='477.2170591997325' rx='3' width='16.186862710824187' height='20' fill='#bf103c'/>
-        <rect x='477.2170591997325' rx='3' width='16.186862710824187' height='20' fill='url(#shade)'/>
-        <rect x='477.5283379808098' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='467.0301964889083' rx='3' width='16.498141491901468' height='20' fill='#bf103c'/>
-        <rect x='467.0301964889083' rx='3' width='16.498141491901468' height='20' fill='url(#shade)'/>
-        <rect x='467.3509869795569' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='456.5320549970068' rx='3' width='16.81893198255014' height='20' fill='#bf103c'/>
-        <rect x='456.5320549970068' rx='3' width='16.81893198255014' height='20' fill='url(#shade)'/>
-        <rect x='456.86264784543187' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='445.7131230144567' rx='3' width='17.14952483097518' height='20' fill='#bf103c'/>
-        <rect x='445.7131230144567' rx='3' width='17.14952483097518' height='20' fill='url(#shade)'/>
-        <rect x='446.05381775016656' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='434.56359818348153' rx='3' width='17.49021956668504' height='20' fill='#bf103c'/>
-        <rect x='434.56359818348153' rx='3' width='17.49021956668504' height='20' fill='url(#shade)'/>
-        <rect x='434.91470348867307' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='423.0733786167965' rx='3' width='17.841324871876566' height='20' fill='#bf103c'/>
-        <rect x='423.0733786167965' rx='3' width='17.841324871876566' height='20' fill='url(#shade)'/>
-        <rect x='423.43521260603256' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='411.23205374491994' rx='3' width='18.20315886111265' height='20' fill='#bf103c'/>
-        <rect x='411.23205374491994' rx='3' width='18.20315886111265' height='20' fill='url(#shade)'/>
-        <rect x='411.60494425335327' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='399.0288948838073' rx='3' width='18.576049369545963' height='20' fill='#bf103c'/>
-        <rect x='399.0288948838073' rx='3' width='18.576049369545963' height='20' fill='url(#shade)'/>
-        <rect x='399.41317976421124' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='386.45284551426136' rx='3' width='18.960334249949863' height='20' fill='#bf103c'/>
-        <rect x='386.45284551426136' rx='3' width='18.960334249949863' height='20' fill='url(#shade)'/>
-        <rect x='386.84887294313717' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='373.4925112643115' rx='3' width='19.35636167882567' height='20' fill='#bf103c'/>
-        <rect x='373.4925112643115' rx='3' width='19.35636167882567' height='20' fill='url(#shade)'/>
-        <rect x='373.90064005734945' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='360.1361495854858' rx='3' width='19.764490471863645' height='20' fill='#bf103c'/>
-        <rect x='360.1361495854858' rx='3' width='19.764490471863645' height='20' fill='url(#shade)'/>
-        <rect x='360.55674952266554' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='346.3716591136221' rx='3' width='20.18509040904341' height='20' fill='#bf103c'/>
-        <rect x='346.3716591136221' rx='3' width='20.18509040904341' height='20' fill='url(#shade)'/>
-        <rect x='346.8051112742472' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='332.1865687045787' rx='3' width='20.61854256966852' height='20' fill='#bf103c'/>
-        <rect x='332.1865687045787' rx='3' width='20.61854256966852' height='20' fill='url(#shade)'/>
-        <rect x='332.6332658125487' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='317.56802613491016' rx='3' width='21.06523967763854' height='20' fill='#bf103c'/>
-        <rect x='317.56802613491016' rx='3' width='21.06523967763854' height='20' fill='url(#shade)'/>
-        <rect x='318.02837291454324' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='302.5027864572716' rx='3' width='21.525586457271643' height='20' fill='#bf103c'/>
-        <rect x='302.5027864572716' rx='3' width='21.525586457271643' height='20' fill='url(#shade)'/>
-        <rect x='302.9772' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='286.9772' rx='3' width='22.0' height='20' fill='#bf103c'/>
-        <rect x='286.9772' rx='3' width='22.0' height='20' fill='url(#shade)'/>
-        <rect x='286.9772' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='162.7498' rx='3' width='130.2274' height='20' fill='url(#run-on-failure)'/>
-        <rect x='162.7498' rx='3' width='130.2274' height='20' fill='url(#shade)'/>
-        <rect width='168.7498' height='20' fill='#5a5a5a'/>
-        <rect x='-6.0' rx='3' width='174.7498' height='20' fill='url(#shade)'/>
+        <rect x='653.26809109179' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='646.1879570885093' rx='3' width='13.080134003280707' height='20' fill='#00f244'/>
+        <rect x='646.1879570885093' rx='3' width='13.080134003280707' height='20' fill='url(#shade)'/>
+        <rect x='646.4043039211865' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='639.1078230852286' rx='3' width='13.296480835957981' height='20' fill='#bf103c'/>
+        <rect x='639.1078230852286' rx='3' width='13.296480835957981' height='20' fill='url(#shade)'/>
+        <rect x='639.3307808029524' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='631.8113422492706' rx='3' width='13.519438553681752' height='20' fill='#bf103c'/>
+        <rect x='631.8113422492706' rx='3' width='13.519438553681752' height='20' fill='url(#shade)'/>
+        <rect x='632.0411128600877' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='624.2919036955889' rx='3' width='13.749209164498811' height='20' fill='#bf103c'/>
+        <rect x='624.2919036955889' rx='3' width='13.749209164498811' height='20' fill='url(#shade)'/>
+        <rect x='624.5286953802824' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='616.5426945310901' rx='3' width='13.986000849192376' height='20' fill='#bf103c'/>
+        <rect x='616.5426945310901' rx='3' width='13.986000849192376' height='20' fill='url(#shade)'/>
+        <rect x='616.7867218317995' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='608.5566936818977' rx='3' width='14.230028149901685' height='20' fill='#bf103c'/>
+        <rect x='608.5566936818977' rx='3' width='14.230028149901685' height='20' fill='url(#shade)'/>
+        <rect x='608.8081776965013' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='600.326665531996' rx='3' width='14.48151216450522' height='20' fill='#bf103c'/>
+        <rect x='600.326665531996' rx='3' width='14.48151216450522' height='20' fill='url(#shade)'/>
+        <rect x='600.5858341144344' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='591.8451533674908' rx='3' width='14.740680746943664' height='20' fill='#bf103c'/>
+        <rect x='591.8451533674908' rx='3' width='14.740680746943664' height='20' fill='url(#shade)'/>
+        <rect x='592.1122413342111' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='583.1044726205471' rx='3' width='15.007768713664104' height='20' fill='#bf103c'/>
+        <rect x='583.1044726205471' rx='3' width='15.007768713664104' height='20' fill='url(#shade)'/>
+        <rect x='583.3797219632555' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='574.096703906883' rx='3' width='15.283018056372542' height='20' fill='#bf103c'/>
+        <rect x='574.096703906883' rx='3' width='15.283018056372542' height='20' fill='url(#shade)'/>
+        <rect x='574.380364011798' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='564.8136858505105' rx='3' width='15.566678161287442' height='20' fill='#bf103c'/>
+        <rect x='564.8136858505105' rx='3' width='15.566678161287442' height='20' fill='url(#shade)'/>
+        <rect x='565.1060137243161' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='555.2470076892231' rx='3' width='15.859006035092985' height='20' fill='#bf103c'/>
+        <rect x='555.2470076892231' rx='3' width='15.859006035092985' height='20' fill='url(#shade)'/>
+        <rect x='555.5482681919269' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='545.3880016541301' rx='3' width='16.16026653779677' height='20' fill='#bf103c'/>
+        <rect x='545.3880016541301' rx='3' width='16.16026653779677' height='20' fill='url(#shade)'/>
+        <rect x='545.6984677390362' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='535.2277351163333' rx='3' width='16.470732622702883' height='20' fill='#bf103c'/>
+        <rect x='535.2277351163333' rx='3' width='16.470732622702883' height='20' fill='url(#shade)'/>
+        <rect x='535.5476880773482' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='524.7570024936304' rx='3' width='16.790685583717845' height='20' fill='#bf103c'/>
+        <rect x='524.7570024936304' rx='3' width='16.790685583717845' height='20' fill='url(#shade)'/>
+        <rect x='525.0867322201259' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='513.9663169099125' rx='3' width='17.12041531021341' height='20' fill='#bf103c'/>
+        <rect x='513.9663169099125' rx='3' width='17.12041531021341' height='20' fill='url(#shade)'/>
+        <rect x='514.3061221493763' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='502.84590159969906' rx='3' width='17.460220549677203' height='20' fill='#bf103c'/>
+        <rect x='502.84590159969906' rx='3' width='17.460220549677203' height='20' fill='url(#shade)'/>
+        <rect x='503.196090228411' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='491.38568105002184' rx='3' width='17.810409178389147' height='20' fill='#bf103c'/>
+        <rect x='491.38568105002184' rx='3' width='17.810409178389147' height='20' fill='url(#shade)'/>
+        <rect x='491.7465703520016' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='479.5752718716327' rx='3' width='18.171298480368904' height='20' fill='#bf103c'/>
+        <rect x='479.5752718716327' rx='3' width='18.171298480368904' height='20' fill='url(#shade)'/>
+        <rect x='479.9471888261109' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='467.40397339126383' rx='3' width='18.543215434847077' height='20' fill='#bf103c'/>
+        <rect x='467.40397339126383' rx='3' width='18.543215434847077' height='20' fill='url(#shade)'/>
+        <rect x='467.7872549689374' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='454.86075795641676' rx='3' width='18.92649701252067' height='20' fill='#bf103c'/>
+        <rect x='454.86075795641676' rx='3' width='18.92649701252067' height='20' fill='url(#shade)'/>
+        <rect x='455.25575142475725' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='441.9342609438961' rx='3' width='19.32149048086113' height='20' fill='#bf103c'/>
+        <rect x='441.9342609438961' rx='3' width='19.32149048086113' height='20' fill='url(#shade)'/>
+        <rect x='442.3413241817867' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='428.61277046303496' rx='3' width='19.728553718751726' height='20' fill='#bf103c'/>
+        <rect x='428.61277046303496' rx='3' width='19.728553718751726' height='20' fill='url(#shade)'/>
+        <rect x='429.03227228502243' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='414.8842167442832' rx='3' width='20.148055540739207' height='20' fill='#bf103c'/>
+        <rect x='414.8842167442832' rx='3' width='20.148055540739207' height='20' fill='url(#shade)'/>
+        <rect x='415.31653723473755' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='400.736161203544' rx='3' width='20.58037603119359' height='20' fill='#bf103c'/>
+        <rect x='400.736161203544' rx='3' width='20.58037603119359' height='20' fill='url(#shade)'/>
+        <rect x='401.1816920610293' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='386.1557851723504' rx='3' width='21.025906888678875' height='20' fill='#bf103c'/>
+        <rect x='386.1557851723504' rx='3' width='21.025906888678875' height='20' fill='url(#shade)'/>
+        <rect x='386.61493006451815' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='371.12987828367153' rx='3' width='21.485051780846597' height='20' fill='#bf103c'/>
+        <rect x='371.12987828367153' rx='3' width='21.485051780846597' height='20' fill='url(#shade)'/>
+        <rect x='371.60305321299876' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='355.6448265028249' rx='3' width='21.958226710173836' height='20' fill='#bf103c'/>
+        <rect x='355.6448265028249' rx='3' width='21.958226710173836' height='20' fill='url(#shade)'/>
+        <rect x='356.13246018352817' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='339.68659979265107' rx='3' width='22.445860390877083' height='20' fill='#bf103c'/>
+        <rect x='339.68659979265107' rx='3' width='22.445860390877083' height='20' fill='url(#shade)'/>
+        <rect x='340.18913403911733' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='323.24073940177396' rx='3' width='22.948394637343355' height='20' fill='#bf103c'/>
+        <rect x='323.24073940177396' rx='3' width='22.948394637343355' height='20' fill='url(#shade)'/>
+        <rect x='323.7586295288612' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='306.2923447644306' rx='3' width='23.466284764430597' height='20' fill='#bf103c'/>
+        <rect x='306.2923447644306' rx='3' width='23.466284764430597' height='20' fill='url(#shade)'/>
+        <rect x='306.82606' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='288.82606' rx='3' width='24.0' height='20' fill='#bf103c'/>
+        <rect x='288.82606' rx='3' width='24.0' height='20' fill='url(#shade)'/>
+        <rect x='288.82606' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='163.18729000000002' rx='3' width='131.63876999999997' height='20' fill='url(#run-on-failure)'/>
+        <rect x='163.18729000000002' rx='3' width='131.63876999999997' height='20' fill='url(#shade)'/>
+        <rect width='169.18729000000002' height='20' fill='#5a5a5a'/>
+        <rect x='-6.0' rx='3' width='175.18729000000002' height='20' fill='url(#shade)'/>
         <rect width='2' height='20' fill='url(#left-light)'/>
-        <rect x='614.7390658896196' width='2' height='20' fill='url(#right-shadow)'/>
-        <rect width='616.7390658896196' height='20' fill='url(#light)'/>
+        <rect x='657.058159125822' width='2' height='20' fill='url(#right-shadow)'/>
+        <rect width='659.058159125822' height='20' fill='url(#light)'/>
     </g>
-    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='10'>
-        <svg x='8.5' y='3.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
+    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='11'>
+        <svg x='6.5' y='3.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
             <polygon fill='#402a14' fill-opacity='0.5' points='84.84 10 34.1 44.46 34.1 103.78 84.84 68.02 135.57 103.78 135.57 44.46 84.84 10'/>
             <polygon fill='#402a14' fill-opacity='0.5' points='84.84 68.02 84.84 10 135.57 44.46 135.57 103.78 84.84 68.02'/>
             <polygon fill='#061a29' fill-opacity='0.5' points='65.07 81.99 14.34 46.22 14.34 105.54 65.07 140 115.81 105.54 115.81 46.22 65.07 81.99'/>
             <polygon fill='#061a29' fill-opacity='0.5' points='65.07 81.99 65.07 140 14.34 105.54 14.34 46.22 65.07 81.99'/>
         </svg>
-        <svg x='8.0' y='2.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
+        <svg x='6.0' y='2.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
             <linearGradient id='yellow-shaded' x1='91.17' y1='44.83' x2='136.24' y2='73.4'  gradientUnits='userSpaceOnUse'>
                 <stop offset='0.01' stop-color='#c6783e'/>
                 <stop offset='0.54' stop-color='#ff9750'/>
@@ -168,9 +168,9 @@
             <polygon fill='#1a7db6' points='65.07 81.99 14.34 46.22 14.34 105.54 65.07 140 115.81 105.54 115.81 46.22 65.07 81.99'/>
             <polygon fill='url(#blue-shaded)' points='65.07 81.99 65.07 140 14.34 105.54 14.34 46.22 65.07 81.99'/>
         </svg>
-        <text x='96.8749' y='14' fill='#000' fill-opacity='.3' textLength='128.7498'>tenant.application.default</text>
-        <text x='96.3749' y='13' fill='#fff' textLength='128.7498'>tenant.application.default</text>
-        <text x='231.3635' y='14' fill='#000' fill-opacity='.3' textLength='108.22739999999999'>production-us-west-1</text>
-        <text x='230.8635' y='13' fill='#fff' textLength='108.22739999999999'>production-us-west-1</text>
+        <text font-size='11' x='96.09364500000001' y='15' fill='#000' fill-opacity='.4' textLength='135.18729000000002'>tenant.application.default</text>
+        <text font-size='11' x='95.59364500000001' y='14' fill='#fff' textLength='135.18729000000002'>tenant.application.default</text>
+        <text font-size='11' x='232.506675' y='15' fill='#000' fill-opacity='.4' textLength='113.63876999999998'>production-us-west-1</text>
+        <text font-size='11' x='232.006675' y='14' fill='#fff' textLength='113.63876999999998'>production-us-west-1</text>
     </g>
 </svg>
diff --git a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/overview.svg b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/overview.svg
index 0ddd91d4008..5bf44782cf2 100644
--- a/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/overview.svg
+++ b/controller-server/src/test/java/com/yahoo/vespa/hosted/controller/restapi/deployment/responses/overview.svg
@@ -1,4 +1,4 @@
-<svg xmlns='http://www.w3.org/2000/svg' width='913.3539000000001' height='20' role='img' aria-label='Deployment Status'>
+<svg xmlns='http://www.w3.org/2000/svg' width='763.7809900000001' height='20' role='img' aria-label='Deployment Status'>
     <title>Deployment Status</title>
     <linearGradient id='light' x2='0' y2='100%'>
         <stop offset='0'  stop-color='#fff' stop-opacity='.5'/>
@@ -34,50 +34,46 @@
     </linearGradient>
     <linearGradient id='run-on-success' x1='40%' x2='80%' y2='0%'>
         <stop offset='0' stop-color='#ab83ff' />
-        <stop offset='1' stop-color='#00ff48' />
+        <stop offset='1' stop-color='#00f244' />
         <animate attributeName='x1' values='-110%;150%;20%;-110%' dur='6s' repeatCount='indefinite' />
         <animate attributeName='x2' values='-10%;250%;120%;-10%' dur='6s' repeatCount='indefinite' />
     </linearGradient>
     <clipPath id='rounded'>
-        <rect width='913.3539000000001' height='20' rx='3' fill='#fff'/>
+        <rect width='763.7809900000001' height='20' rx='3' fill='#fff'/>
     </clipPath>
     <g clip-path='url(#rounded)'>
-        <rect x='907.3539000000001' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='870.3061' rx='3' width='43.0478' height='20' fill='url(#run-on-success)'/>
-        <polygon points='772.1412 0 772.1412 20 877.8061 20 885.8061 0' fill='#00ff48'/>
-        <rect x='772.1412' rx='3' width='141.2127' height='20' fill='url(#shade)'/>
-        <rect x='772.1412' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='735.0934' rx='3' width='43.0478' height='20' fill='#bf103c'/>
-        <polygon points='611.279 0 611.279 20 742.5934 20 750.5934 0' fill='#00ff48'/>
-        <rect x='611.279' rx='3' width='166.86219999999997' height='20' fill='url(#shade)'/>
-        <rect x='611.279' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='574.2312' rx='3' width='43.0478' height='20' fill='#00ff48'/>
-        <polygon points='449.0446 0 449.0446 20 581.7312 20 589.7312 0' fill='url(#run-on-success)'/>
-        <rect x='449.0446' rx='3' width='168.2344' height='20' fill='url(#shade)'/>
-        <rect x='449.0446' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='411.9968' rx='3' width='43.0478' height='20' fill='#00ff48'/>
-        <polygon points='314.5789 0 314.5789 20 419.4968 20 427.4968 0' fill='url(#run-on-failure)'/>
-        <rect x='314.5789' rx='3' width='140.4657' height='20' fill='url(#shade)'/>
-        <rect x='314.5789' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='228.3006' rx='3' width='92.2783' height='20' fill='url(#run-on-success)'/>
-        <rect x='238.3006' rx='3' width='82.2783' height='20' fill='url(#shade)'/>
-        <rect x='238.3006' rx='3' width='9' height='20' fill='url(#shadow)'/>
-        <rect x='152.7498' rx='3' width='91.55080000000001' height='20' fill='#00ff48'/>
-        <rect x='162.7498' rx='3' width='81.55080000000001' height='20' fill='url(#shade)'/>
-        <rect width='168.7498' height='20' fill='#5a5a5a'/>
-        <rect x='-6.0' rx='3' width='174.7498' height='20' fill='url(#shade)'/>
+        <rect x='757.7809900000001' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='725.59036' rx='3' width='38.19063' height='20' fill='url(#run-on-success)'/>
+        <polygon points='635.8470950000001 0 635.8470950000001 20 734.59036 20 742.59036 0' fill='#00f244'/>
+        <rect x='635.8470950000001' rx='3' width='131.74345499999998' height='20' fill='url(#shade)'/>
+        <rect x='635.8470950000001' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='603.656465' rx='3' width='38.19063' height='20' fill='#bf103c'/>
+        <polygon points='486.981225 0 486.981225 20 612.656465 20 620.656465 0' fill='#00f244'/>
+        <rect x='486.981225' rx='3' width='158.67543' height='20' fill='url(#shade)'/>
+        <rect x='486.981225' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='348.865175' rx='3' width='144.11604999999997' height='20' fill='url(#run-on-success)'/>
+        <rect x='358.865175' rx='3' width='134.11604999999997' height='20' fill='url(#shade)'/>
+        <rect x='358.865175' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='326.674545' rx='3' width='38.19063' height='20' fill='#00f244'/>
+        <polygon points='237.71563000000003 0 237.71563000000003 20 335.674545 20 343.674545 0' fill='url(#run-on-failure)'/>
+        <rect x='237.71563000000003' rx='3' width='130.959105' height='20' fill='url(#shade)'/>
+        <rect x='237.71563000000003' rx='3' width='9' height='20' fill='url(#shadow)'/>
+        <rect x='153.18729000000002' rx='3' width='90.52834000000001' height='20' fill='#00f244'/>
+        <rect x='163.18729000000002' rx='3' width='80.52834000000001' height='20' fill='url(#shade)'/>
+        <rect width='169.18729000000002' height='20' fill='#5a5a5a'/>
+        <rect x='-6.0' rx='3' width='175.18729000000002' height='20' fill='url(#shade)'/>
         <rect width='2' height='20' fill='url(#left-light)'/>
-        <rect x='911.3539000000001' width='2' height='20' fill='url(#right-shadow)'/>
-        <rect width='913.3539000000001' height='20' fill='url(#light)'/>
+        <rect x='761.7809900000001' width='2' height='20' fill='url(#right-shadow)'/>
+        <rect width='763.7809900000001' height='20' fill='url(#light)'/>
     </g>
-    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='10'>
-        <svg x='8.5' y='3.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
+    <g fill='#fff' text-anchor='middle' font-family='Verdana,Geneva,DejaVu Sans,sans-serif' text-rendering='geometricPrecision' font-size='11'>
+        <svg x='6.5' y='3.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
             <polygon fill='#402a14' fill-opacity='0.5' points='84.84 10 34.1 44.46 34.1 103.78 84.84 68.02 135.57 103.78 135.57 44.46 84.84 10'/>
             <polygon fill='#402a14' fill-opacity='0.5' points='84.84 68.02 84.84 10 135.57 44.46 135.57 103.78 84.84 68.02'/>
             <polygon fill='#061a29' fill-opacity='0.5' points='65.07 81.99 14.34 46.22 14.34 105.54 65.07 140 115.81 105.54 115.81 46.22 65.07 81.99'/>
             <polygon fill='#061a29' fill-opacity='0.5' points='65.07 81.99 65.07 140 14.34 105.54 14.34 46.22 65.07 81.99'/>
         </svg>
-        <svg x='8.0' y='2.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
+        <svg x='6.0' y='2.0' width='16.0' height='16.0' viewBox='0 0 150 150'>
             <linearGradient id='yellow-shaded' x1='91.17' y1='44.83' x2='136.24' y2='73.4'  gradientUnits='userSpaceOnUse'>
                 <stop offset='0.01' stop-color='#c6783e'/>
                 <stop offset='0.54' stop-color='#ff9750'/>
@@ -91,35 +87,31 @@
             <polygon fill='#1a7db6' points='65.07 81.99 14.34 46.22 14.34 105.54 65.07 140 115.81 105.54 115.81 46.22 65.07 81.99'/>
             <polygon fill='url(#blue-shaded)' points='65.07 81.99 65.07 140 14.34 105.54 14.34 46.22 65.07 81.99'/>
         </svg>
-        <text x='96.8749' y='14' fill='#000' fill-opacity='.3' textLength='128.7498'>tenant.application.default</text>
-        <text x='96.3749' y='13' fill='#fff' textLength='128.7498'>tenant.application.default</text>
-        <text x='207.02519999999998' y='14' fill='#000' fill-opacity='.3' textLength='59.5508'>system-test</text>
-        <text x='206.52519999999998' y='13' fill='#fff' textLength='59.5508'>system-test</text>
-        <text x='282.93975' y='14' fill='#000' fill-opacity='.3' textLength='60.2783'>staging-test</text>
-        <text x='282.43975' y='13' fill='#fff' textLength='60.2783'>staging-test</text>
-        <text x='354.21315' y='14' fill='#000' fill-opacity='.3' textLength='50.2685'>us-west-1</text>
-        <text x='353.71315' y='13' fill='#fff' textLength='50.2685'>us-west-1</text>
-        <text x='403.9221' y='14' fill='#000' fill-opacity='.3' textLength='33.1494'>deploy</text>
-        <text x='403.4221' y='13' fill='#fff' textLength='33.1494'>deploy</text>
-        <text x='438.02070000000003' y='14' fill='#000' fill-opacity='.3' textLength='19.047800000000002'>test</text>
-        <text x='437.52070000000003' y='13' fill='#fff' textLength='19.047800000000002'>test</text>
-        <text x='502.5632' y='14' fill='#000' fill-opacity='.3' textLength='78.0372'>aws-us-east-1a</text>
-        <text x='502.0632' y='13' fill='#fff' textLength='78.0372'>aws-us-east-1a</text>
-        <text x='566.1565' y='14' fill='#000' fill-opacity='.3' textLength='33.1494'>deploy</text>
-        <text x='565.6565' y='13' fill='#fff' textLength='33.1494'>deploy</text>
-        <text x='600.2551' y='14' fill='#000' fill-opacity='.3' textLength='19.047800000000002'>test</text>
-        <text x='599.7551' y='13' fill='#fff' textLength='19.047800000000002'>test</text>
-        <text x='664.1115' y='14' fill='#000' fill-opacity='.3' textLength='76.66499999999999'>ap-southeast-1</text>
-        <text x='663.6115' y='13' fill='#fff' textLength='76.66499999999999'>ap-southeast-1</text>
-        <text x='727.0187' y='14' fill='#000' fill-opacity='.3' textLength='33.1494'>deploy</text>
-        <text x='726.5187' y='13' fill='#fff' textLength='33.1494'>deploy</text>
-        <text x='761.1173' y='14' fill='#000' fill-opacity='.3' textLength='19.047800000000002'>test</text>
-        <text x='760.6173' y='13' fill='#fff' textLength='19.047800000000002'>test</text>
-        <text x='812.14895' y='14' fill='#000' fill-opacity='.3' textLength='51.015499999999996'>eu-west-1</text>
-        <text x='811.64895' y='13' fill='#fff' textLength='51.015499999999996'>eu-west-1</text>
-        <text x='862.2314' y='14' fill='#000' fill-opacity='.3' textLength='33.1494'>deploy</text>
-        <text x='861.7314' y='13' fill='#fff' textLength='33.1494'>deploy</text>
-        <text x='896.33' y='14' fill='#000' fill-opacity='.3' textLength='19.047800000000002'>test</text>
-        <text x='895.83' y='13' fill='#fff' textLength='19.047800000000002'>test</text>
+        <text font-size='11' x='96.09364500000001' y='15' fill='#000' fill-opacity='.4' textLength='135.18729000000002'>tenant.application.default</text>
+        <text font-size='11' x='95.59364500000001' y='14' fill='#fff' textLength='135.18729000000002'>tenant.application.default</text>
+        <text font-size='11' x='206.95146000000003' y='15' fill='#000' fill-opacity='.4' textLength='62.52834000000001'>system-test</text>
+        <text font-size='11' x='206.45146000000003' y='14' fill='#fff' textLength='62.52834000000001'>system-test</text>
+        <text font-size='11' x='276.60659250000003' y='15' fill='#000' fill-opacity='.4' textLength='52.781925'>us-west-1</text>
+        <text font-size='11' x='276.10659250000003' y='14' fill='#fff' textLength='52.781925'>us-west-1</text>
+        <text font-size='9' x='323.08605000000006' y='15' fill='#000' fill-opacity='.4' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='322.58605000000006' y='14' fill='#fff' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='351.26986000000005' y='15' fill='#000' fill-opacity='.4' textLength='16.190630000000002'>test</text>
+        <text font-size='9' x='350.76986000000005' y='14' fill='#fff' textLength='16.190630000000002'>test</text>
+        <text font-size='11' x='412.334705' y='15' fill='#000' fill-opacity='.4' textLength='81.93905999999998'>aws-us-east-1a</text>
+        <text font-size='11' x='411.834705' y='14' fill='#fff' textLength='81.93905999999998'>aws-us-east-1a</text>
+        <text font-size='9' x='473.39273000000003' y='15' fill='#000' fill-opacity='.4' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='472.89273000000003' y='14' fill='#fff' textLength='28.176989999999996'>deploy</text>
+        <text font-size='11' x='539.73035' y='15' fill='#000' fill-opacity='.4' textLength='80.49825'>ap-southeast-1</text>
+        <text font-size='11' x='539.23035' y='14' fill='#fff' textLength='80.49825'>ap-southeast-1</text>
+        <text font-size='9' x='600.06797' y='15' fill='#000' fill-opacity='.4' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='599.56797' y='14' fill='#fff' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='628.25178' y='15' fill='#000' fill-opacity='.4' textLength='16.190630000000002'>test</text>
+        <text font-size='9' x='627.75178' y='14' fill='#fff' textLength='16.190630000000002'>test</text>
+        <text font-size='11' x='675.1302325' y='15' fill='#000' fill-opacity='.4' textLength='53.566275'>eu-west-1</text>
+        <text font-size='11' x='674.6302325' y='14' fill='#fff' textLength='53.566275'>eu-west-1</text>
+        <text font-size='9' x='722.0018650000001' y='15' fill='#000' fill-opacity='.4' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='721.5018650000001' y='14' fill='#fff' textLength='28.176989999999996'>deploy</text>
+        <text font-size='9' x='750.1856750000001' y='15' fill='#000' fill-opacity='.4' textLength='16.190630000000002'>test</text>
+        <text font-size='9' x='749.6856750000001' y='14' fill='#fff' textLength='16.190630000000002'>test</text>
     </g>
 </svg>