feature: backported @jpetrucciani's yellow run-status indicators (#42)

internal/http/html/static/css/input.css

@@ -6,82 +6,115 @@
   a {
     @apply hover:underline hover:text-blue-500;
   }
+
   [x-cloak] {
     display: none !important;
   }
+
   .btn {
     @apply font-bold py-1 px-3 bg-gray-200 shadow-sm shadow-slate-500;
   }
+
   .btn:hover {
     @apply bg-gray-300;
   }
+
   .btn-danger {
     @apply font-bold py-1 px-3 bg-gray-200 shadow-sm shadow-slate-500 text-red-400;
   }
+
   .btn-danger:hover {
     @apply bg-red-400 text-white;
   }
+
   .text-input {
     @apply border py-1 px-2;
   }
+
   .form-checkbox {
     @apply grid grid-cols-[20px_auto] gap-[1px] items-center justify-items-start;
   }
+
   .form-checkbox label {
     @apply font-semibold;
   }
+
   .form-checkbox .description {
     @apply col-start-2;
   }
+
+  .run-status>a {
+    border-radius: 10px;
+    padding: 4px 10px;
+  }
+
   input.error {
     @apply border-2 border-red-400 shadow-sm shadow-red-200;
   }
+
   select {
     @apply py-2 px-4 bg-gray-200 shadow-sm shadow-slate-500 cursor-pointer;
   }
-  input[type="radio"], input[type="checkbox"] {
+
+  input[type="radio"],
+  input[type="checkbox"] {
     @apply cursor-pointer;
   }
+
   label {
     @apply cursor-pointer;
   }
+
   #content-header-title a {
-    @apply text-blue-600
+    @apply text-blue-600;
   }
+
   .widget {
     @apply flex flex-col gap-3 place-content-between border border-black mt-3 p-2;
   }
-  .widget > div:first-child {
+
+  .widget>div:first-child {
     @apply flex gap-2 items-center pb-2;
   }
-  .widget > div:first-child > :last-child:not(:first-child) {
+
+  .widget>div:first-child> :last-child:not(:first-child) {
     @apply ml-auto;
   }
-  .widget > div:last-child:not(:first-child) {
+
+  .widget>div:last-child:not(:first-child) {
     @apply flex flex-wrap gap-4 items-center justify-between;
   }
+
   .field {
     @apply flex flex-col gap-0.5;
   }
-  .field > label {
+
+  .field>label {
     @apply block font-semibold;
   }
+
   table {
     @apply text-sm;
   }
+
   tr {
     @apply even:bg-gray-100;
   }
-  th, td {
+
+  th,
+  td {
     @apply p-2;
   }
+
   .tag-container {
-    @apply flex flex-wrap gap-1 items-center
+    @apply flex flex-wrap gap-1 items-center;
   }
+
   .tag {
-    @apply text-sm rounded-lg bg-blue-800 text-white font-semibold p-1
+    @apply text-sm rounded-lg bg-blue-800 text-white font-semibold p-1;
   }
+
   .description {
     @apply text-gray-600 text-sm;
   }
-}
+}

internal/http/html/static/templates/partials/run_status.tmpl

@@ -1,5 +1,5 @@
 {{ define "run-status" }}
-  {{ $statusColors := dict "discarded" "bg-gray-200" "planned_and_finished" "bg-red-100" "applied" "bg-green-200" }}
+  {{ $statusColors := dict "discarded" "bg-gray-200" "planned_and_finished" "bg-red-100" "applied" "bg-green-200" "planned" "bg-yellow-200" }}
   <span id="{{ .ID }}-status" class="run-status text-lg {{ get $statusColors .Status.String }}">
     <a href="{{ runPath .ID }}">{{ .Status.String | replace "_" " "}}</a>
   </span>