From f1dad26944f79c75699dffab43f981154e7c050f Mon Sep 17 00:00:00 2001
From: adrien <adrien@malingrey.fr>
Date: Tue, 20 May 2025 11:38:54 +0200
Subject: [PATCH] change hybrid colors

---
 show.php  |  9 ++++++---
 style.css | 12 ++++--------
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/show.php b/show.php
index 37d9cc2..b1ce9be 100644
--- a/show.php
+++ b/show.php
@@ -29,7 +29,7 @@ $otherPattern           = " .*$NL";
 $endPattern             = "(?<!#)";
 preg_match_all("/$startPattern$vlanPvidPattern(?:$vlanNamePattern|$vlanDescriptionPattern|$otherPattern)*$endPattern/", $conf, $vlans, PREG_SET_ORDER);
 $interfaceAddressPattern = "interface [\w-]+(?P<member>\d+)\/0\/(?P<port>\d+)$NL";
-$pvidPattern             = " port (?:access|trunk pvid) vlan (?P<pvid>\d+)$NL";
+$pvidPattern             = " port (?:access|trunk pvid|hybrid pvid) vlan (?P<pvid>\d+)$NL";
 $portHybridPattern       = " port hybrid (?:pvid )?vlan (?:(?P<tagged>\d+)(?: [0-9a-z ]*)? tagged|(?P<untagged>\d+)(?: \d+)* untagged)$NL";
 $voiceVlanPattern        = " voice-vlan (?P<voice_vlan>\d+) enable$NL";
 preg_match_all("/$startPattern$interfaceAddressPattern(?:$pvidPattern|$portHybridPattern|$voiceVlanPattern|$otherPattern)*$endPattern/", $conf, $interfaces, PREG_SET_ORDER);
@@ -137,10 +137,13 @@ foreach ($interfaces as $interface) {
             for (let i = 0; i < customColors.sheet.cssRules.length; i++) {
                 if (customColors.sheet.cssRules[i].selectorText == `[style*="--pvid: ${pvid}"]`) {
                     customColors.sheet.deleteRule(i)
-                    break
+                }
+                if (customColors.sheet.cssRules[i].selectorText == `[style*="--tagged: ${pvid}"]`) {
+                    customColors.sheet.deleteRule(i)
                 }
             }
-            customColors.sheet.insertRule(`[style*="--pvid: ${pvid}"] { background-color: ${color} }`)
+            customColors.sheet.insertRule(`[style*="--pvid: ${pvid}"] { --pvid-color: ${color} }`)
+            customColors.sheet.insertRule(`[style*="--tagged: ${pvid}"] { --tagged-color: ${color} }`)
         }
     </script>
 </body>
diff --git a/style.css b/style.css
index 38c32ca..ea8289f 100644
--- a/style.css
+++ b/style.css
@@ -163,11 +163,10 @@ main {
 
 .vlan {
   --pvid: 0;
+  --pvid-color: hsl(calc(var(--hue) * var(--pvid)) var(--saturation) var(--lightness));
   color: #ecf0f1;
   text-shadow: 1px 2px 2px black;
-  background-color: hsl(
-    calc(var(--hue) * var(--pvid)) var(--saturation) var(--lightness)
-  );
+  background-color: var(--pvid-color);
 }
 
 .vlan:hover {
@@ -190,11 +189,8 @@ main {
 
 .hybrid {
   --tagged: 0;
-  background-image: linear-gradient(
-    145deg,
-    transparent 50%,
-    hsl(calc(var(--hue) * var(--tagged)) var(--saturation) var(--lightness)) 50%
-  );
+  --tagged-color: hsl(calc(var(--hue) * var(--tagged)) var(--saturation) var(--lightness));
+  background-image: linear-gradient(145deg, transparent 50%, var(--tagged-color) 50%);
 }
 
 .shutdown:not([class*="loopback-detection action shutdown"]) {