From af8909233cddc3bd984f13a38f35b01512e7e9c8 Mon Sep 17 00:00:00 2001
From: Sebastian Riedel <s@kraih.com>
Date: Tue, 6 Aug 2024 20:52:57 +0200
Subject: [PATCH] Highlight patterns without matches in red

---
 assets/vue/RecentPatterns.vue | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/assets/vue/RecentPatterns.vue b/assets/vue/RecentPatterns.vue
index eef57e984..cae739a26 100644
--- a/assets/vue/RecentPatterns.vue
+++ b/assets/vue/RecentPatterns.vue
@@ -54,7 +54,7 @@
           <div class="recent-pattern-source">
             <table class="pattern">
               <tbody>
-                <tr v-for="line in pattern.lines" :key="line.num">
+                <tr v-for="line in pattern.lines" :key="line.num" :class="getClassForPattern(pattern)">
                   <td class="linenumber">{{ line.num }}</td>
                   <td class="code">{{ line.text }}</td>
                 </tr>
@@ -119,6 +119,12 @@ export default {
     window.removeEventListener('scroll', this.handleScroll);
   },
   methods: {
+    getClassForPattern(pattern) {
+      return {
+        'pattern-without-matches': pattern.matches === 0,
+        'pattern-with-matches': pattern.matches > 0
+      };
+    },
     async getPatterns() {
       const query = this.params;
       const ua = new UserAgent({baseURL: window.location.href});
@@ -232,4 +238,10 @@ export default {
   color: rgba(27, 31, 35, 0.3);
   user-select: none;
 }
+.pattern-with-matches {
+  background-color: #ffffff;
+}
+.pattern-without-matches {
+  background-color: #ffebe9;
+}
 </style>