From 7c5a31a162eb6664eff665e0cfadc089188a5e8f Mon Sep 17 00:00:00 2001
From: Joris
Date: Sun, 4 Sep 2022 11:31:07 +0200
Subject: Remove inline styling for category colors

Also stop changing color of select options, because it does not work
reliably accross browsers.
---
 assets/main.js | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

(limited to 'assets')

diff --git a/assets/main.js b/assets/main.js
index bc5d65c..c83e4fc 100644
--- a/assets/main.js
+++ b/assets/main.js
@@ -272,3 +272,23 @@ function prettyPrintMonth(isoDate) {
 function capitalize(str) {
     return str.replace(/^\w/, function (c) { return c.toUpperCase() })
 }
+
+/******************/
+/* Web components */
+/******************/
+
+/* Apply color given from attribute.
+ *
+ * This permits not to use the style attribute in HTML to respect a strict CSP policy.
+ */
+customElements.define(
+  'colored-category',
+  class extends HTMLSpanElement {
+    constructor() {
+      super()
+      const span = this
+      span.style = `color: ${span.getAttribute('data-color')}`
+    }
+  },
+  { extends: 'span' }
+)
-- 
cgit v1.2.3