Invocation server: adapt style

3 files changed, 23 insertions, 8 deletions

diff --git a/doc/invocations-http-server/static/style.css b/doc/invocations-http-server/static/style.css
index 163cd951..91561423 100644
--- a/doc/invocations-http-server/static/style.css
+++ b/doc/invocations-http-server/static/style.css
@@ -3,11 +3,24 @@ body {
   font-family: "Helvetica";
   font-size: large;
 }
-a {
-  color: #11557c;
-}
 h1,
 h2,
 h3 {
   color: #11557c;
 }
+#invocation-list > ul > li {
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
+  border: 1px solid #b2bec3;
+  border-radius: 6px;
+  margin-bottom: 15px;
+  padding: 3px 7px;
+}
+#invocation-verb {
+  font-weight: 700;
+}
+#invocation-target {
+  background-color: #ced6d9;
+}
+#invocation-failure {
+  color: #d63031;
+}
diff --git a/doc/invocations-http-server/templates/invocation.html b/doc/invocations-http-server/templates/invocation.html
index 04549b2e..423b6931 100644
--- a/doc/invocations-http-server/templates/invocation.html
+++ b/doc/invocations-http-server/templates/invocation.html
@@ -95,7 +95,7 @@ Inocations {{invocation | e}}
 <h2>Overview</h2>
 <ul>
   {% if cmd %}
-  <li> Subcommand and positional arguments: <tt>{{ cmd | e }}</tt></li>
+  <li> Subcommand and positional arguments: <span id="invocation-target"><tt>{{ cmd | e }}</tt></span></li>
   {% endif %}
   {% if cmdline %}
   <li> Full command line: <tt>{{ cmdline | e }}</tt></li>
diff --git a/doc/invocations-http-server/templates/invocations.html b/doc/invocations-http-server/templates/invocations.html
index c5680240..dd377659 100644
--- a/doc/invocations-http-server/templates/invocations.html
+++ b/doc/invocations-http-server/templates/invocations.html
@@ -40,17 +40,18 @@ Filter by:
   {% endif %}
 {% endif %}
 {% if invocations %}
+<div id="invocation-list">
 <ul>
   {% for invocation in invocations %}
   <li> <a href="/invocations/{{invocation.name |e}}"><tt>{{ invocation.name | e }}</tt></a>
     {% if invocation.subcommand %}
-    <tt>{{ invocation.subcommand | e }}</tt>
+    <span id="invocation-verb"><tt>{{ invocation.subcommand | e }}</tt></span>
     {% endif %}
     {% if invocation.target %}
-    <tt>{{ invocation.target | e}}</tt>
+    <span id="invocation-target"><tt>{{ invocation.target | e}}</tt></span>
     {% endif %}
     {% if invocation.exit_code != 0 %}
-    <b>
+    <span id="invocation-failure"><b>
       {% if invocation.exit_code == 1 %}
       build failed
       {% elif invocation.exit_code == 2 %}
@@ -64,7 +65,7 @@ Filter by:
       {% else %}
       exit code {{ invocation.exit_code | e }}
       {% endif %}
-    </b>
+    </b></span>
     {% endif %}
     <ul>
       {% if invocation.remote_address %}
@@ -86,6 +87,7 @@ Filter by:
   </li>
   {% endfor %}
 </ul>
+</div>
 {% else %}
 <i>(none)</i>
 {% endif %}