Drop Rollup in favor of esbuild

ui/css/app.css

@@ -34,10 +34,10 @@
 
   --disabled: #666;
 
-  --status-red: hsl(0, 80%, 80%);
-  --status-green: hsl(125, 80%, 80%);
-  --status-gray: hsl(58, 3%, 80%);
-  --status-yellow: hsl(46, 79%, 80%);
+  --status-red: 0 80% 80%;
+  --status-green: 125 80% 80%;
+  --status-gray: 58 3% 80%;
+  --status-yellow: 46 79% 80%;
 }
 
 body,
@@ -79,7 +79,7 @@ i {
 
 @keyframes pending-blink {
   from {
-    background-color: color-mod(var(--status-green) a(90%));
+    background-color: hsl(var(--status-green) / 0.9);
   }
   to {
     background-color: transparent;
@@ -142,10 +142,10 @@ body {
           }
         }
         & > .stale.active {
-          background-color: color-mod(var(--status-gray) a(90%));
+          background-color: hsl(var(--status-gray) / 0.9);
         }
         & > .fault.active {
-          background-color: color-mod(var(--status-red) a(90%));
+          background-color: hsl(var(--status-red) / 0.9);
         }
         & > .queued.active {
           font-weight: bold;
@@ -187,11 +187,11 @@ body {
           border-radius: 0.4em;
         }
         & > .stale {
-          background-color: color-mod(var(--status-gray) a(90%));
+          background-color: hsl(var(--status-gray) / 0.9);
           border-radius: 0.4em;
         }
         & > .fault {
-          background-color: color-mod(var(--status-red) a(90%));
+          background-color: hsl(var(--status-red) / 0.9);
           border-radius: 0.4em;
         }
         & .parameter {
@@ -231,16 +231,16 @@ body {
         transition: opacity var(--fade), top var(--fade);
 
         &.error {
-          background-color: color-mod(var(--status-red) a(90%));
-          border: 1px solid var(--status-red);
+          background-color: hsl(var(--status-red) / 0.9);
+          border: 1px solid hsl(var(--status-red));
         }
         &.success {
-          background-color: color-mod(var(--status-green) a(90%));
-          border: 1px solid var(--status-green);
+          background-color: hsl(var(--status-green) / 0.9);
+          border: 1px solid hsl(var(--status-green));
         }
         &.warning {
-          background-color: color-mod(var(--status-yellow) a(90%));
-          border: 1px solid var(--status-yellow);
+          background-color: hsl(var(--status-yellow) / 0.9);
+          border: 1px solid hsl(var(--status-yellow));
         }
       }
     }

ui/icons.ts

@@ -19,11 +19,12 @@
 
 import { Children } from "mithril";
 import m from "mithril";
+import { ICONS_SVG } from "../build/assets";
 
 export function getIcon(name: string): Children {
   return m(
     `svg.icon.icon-${name}`,
     { key: `icon-${name}` },
-    m("use", { href: `icons.svg#icon-${name}` })
+    m("use", { href: `${ICONS_SVG}#icon-${name}` })
   );
 }

ui/layout.ts

@@ -25,6 +25,7 @@ import adminMenu from "./admin-menu";
 import * as overlay from "./overlay";
 import { version as VERSION } from "../package.json";
 import datalist from "./datalist";
+import { LOGO_SVG } from "../build/assets";
 
 const adminPages = [
   "presets",
@@ -55,7 +56,7 @@ const component: ClosureComponent = (): Component => {
         m("#header", [
           m(
             "div.logo",
-            m("img", { src: "logo.svg" }),
+            m("img", { src: LOGO_SVG }),
             m("span.version", "v" + VERSION)
           ),
           m(userMenu),