added dark mode

packages/hurl/src/report/html/resources/nav.css

@@ -50,11 +50,33 @@
     line-height: 1.2;
 }
 
-
 .success, .success a {
     color: green;
 }
 
 .failure, .failure a {
     color: red;
+}
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    .report-nav a {
+        color: #34a7ff;
+    }
+
+    .report-nav a[aria-selected="true"] {
+        color: #ff0288;
+    }
+
+    .error {
+        border-left: #ff0288 4px solid;
+    }
+
+    .error-desc {
+        background: #27272c;
+    }
 }

packages/hurl/src/report/html/resources/report.css

@@ -40,3 +40,38 @@ thead {
 .failure, .failure a {
     color: red;
 }
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    h2 {
+        color: #ff0288;
+    }
+
+    .summary {
+        color: #c2c2c2;
+    }
+
+    .date {
+        color: #c2c2c2;
+    }
+
+    td {
+        color: #c2c2c2;
+    }
+
+    thead {
+        color: #c2c2c2;
+    }
+
+    .success, .success a {
+        color: lime;
+    }
+
+    .failure, .failure a {
+        color: #ff6e67;
+    }
+}

packages/hurl/src/report/html/resources/run.css

@@ -62,4 +62,43 @@ summary {
     font-size: 1.3rem;
     line-height: 1.4;
     font-weight: bold;
+}
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    h4:target {
+        color: #ff0288;
+    }
+
+    table {
+        border-color: #444;
+    }
+
+    th {
+        background: #19191c;
+    }
+
+    td a {
+        color: #34a7ff;
+    }
+
+    .name {
+        background: #19191c;
+    }
+
+    .value {
+        color: #c2c2c2;
+    }
+
+    details {
+        color: #c2c2c2;
+    }
+
+    summary {
+        color: #c2c2c2;
+    }
 }

packages/hurl/src/report/html/resources/source.css

@@ -46,3 +46,42 @@ body {
     overflow: auto;
     overflow-y: hidden;
 }
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    .line-error {
+        border-bottom: #ff0288 2px dashed;
+    }
+
+    .line-error::after {
+        color: #ff0288;
+    }
+
+    .container {
+        background-color: #19191c;
+    }
+
+    .source-container {
+        border-color: #444;
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    .line-numbers {
+        border-right-color: #444;
+        background: #19191c;
+    }
+
+    .line-numbers a {
+        color: #34a7ff;
+    }
+
+    .source {
+        color: #c2c2c2;
+        background-color: #19191c;
+    }
+}

packages/hurl/src/report/html/resources/timeline.css

@@ -33,3 +33,50 @@ body {
     overflow-y: hidden;
 }
 
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    .container {
+        background-color: #19191c;
+    }
+
+    .timeline-container {
+        border: solid 1px #444;
+        background-color: #19191c;
+    }
+
+    .calls {
+        background-color: #1e1e1e;
+    }
+
+    .waterfall {
+        background-color: #19191c;
+    }
+
+    .call-detail > g text:first-of-type {
+       fill: #fff;
+    }
+
+    .call-detail > g text:nth-of-type(2) {
+       fill: #a7a7a7;
+    }
+    
+    .call-detail rect:nth-of-type(2) {
+        fill: #19191c;
+    }
+
+    .calls svg:first-of-type rect:first-of-type {
+        fill: #19191c;
+    }
+
+    .waterfall svg:first-of-type g:first-of-type g:first-of-type rect {
+        fill: #444;
+    }
+
+    .timeline-container {
+        border-color: #fff;
+    }
+}

packages/hurl_core/src/format/hurl.css

@@ -83,4 +83,39 @@ code {
 
 .cookie-value {
     color: darkgreen;
+}
+
+@media (prefers-color-scheme: dark) {
+    body {
+        background-color: #19191c;
+        color: #c2c2c2;
+    }
+
+    .method, .version {
+        color: #c2c2c2;
+    }
+
+    .url, .filter-type, .not, .predicate-type {
+        color: #34a7ff;
+    }
+
+    .number {
+        color: lime;
+    }
+
+    .section-header {
+        color: #ff0288;
+    }
+
+    .query-type {
+        color: cyan;
+    }
+
+    .string, .multiline, .name, .json, .xml, .base64, .hex, .filename, .cookie-value {
+        color: lime;
+    }
+
+    .comment {
+        color: #444;
+    }
 }