adrien/tableau-vlans
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

custom colors

Browse Source
This commit is contained in:
Adrien MALINGREY 2025-05-19 14:52:05 +02:00
parent ea88991a9d
commit a36abb0ddf
2 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
show.php
View File

@ -1,8 +1,8 @@
<?php <?php
$basedir = __DIR__ . "/confs/"; $basedir = __DIR__ . "/confs/";
$path = realpath($basedir . filter_input(INPUT_GET, "switch", FILTER_SANITIZE_STRING)); $path = escapeshellcmd(realpath($basedir . $_GET["switch"]));
if (strpos($path, $basedir) !== 0 || substr($path, -4) != ".cfg") { if (substr($path, -4) != ".cfg") {
header('HTTP/1.1 404 Not Found'); http_response_code(404);
die(); die();
} }
@ -45,6 +45,7 @@ echo ("-->");*/
<head> <head>
<title><?= $sysname[1] ?? "Switch sans nom" ?> - Tableau des VLANs</title> <title><?= $sysname[1] ?? "Switch sans nom" ?> - Tableau des VLANs</title>
<link href="style.css" rel="stylesheet" /> <link href="style.css" rel="stylesheet" />
<style id="customColors"></style>
</head> </head>
<body> <body>
@ -90,7 +91,7 @@ echo ("-->");*/
if (isset($vlan["pvid"]) and $vlan["pvid"] != 1) { if (isset($vlan["pvid"]) and $vlan["pvid"] != 1) {
$name = $vlan["name"] ?? ""; $name = $vlan["name"] ?? "";
$description = $vlan["description"] ?? ""; $description = $vlan["description"] ?? "";
echo "<tr title='{$vlan[0]}'><td class='interface vlan' style='--pvid: {$vlan["pvid"]}'>{$vlan["pvid"]}</td><td>$name</td><td>$description</td></tr>"; echo "<tr title='{$vlan[0]}'><td class='interface vlan {$vlan["pvid"]}' style='--pvid: {$vlan["pvid"]};'>{$vlan["pvid"]}<input type='color' oninput='changeColor({$vlan["pvid"]}, this.value)' /></td><td>$name</td><td>$description</td></tr>";
} }
} }
?> ?>
@ -124,6 +125,17 @@ echo ("-->");*/
<a href="<?= str_replace(__DIR__ . "/", "", $path) ?>" target="_blank" class="link no-print">Télécharger la configuration</a> <a href="<?= str_replace(__DIR__ . "/", "", $path) ?>" target="_blank" class="link no-print">Télécharger la configuration</a>
<a href="index.php" class="link no-print">← Retour à la liste</a> <a href="index.php" class="link no-print">← Retour à la liste</a>
</footer> </footer>
<script>
function changeColor(pvid, color) {
for (let i = 0; i < customColors.sheet.cssRules.length; i++) {
if (customColors.sheet.cssRules[i].selectorText == `[style*="--pvid: ${pvid}"]`) {
customColors.sheet.deleteRule(i)
break
}
}
customColors.sheet.insertRule(`[style*="--pvid: ${pvid}"] { background-color: ${color} }`)
}
</script>
</body> </body>
</html> </html>

10
style.css
View File

@ -235,6 +235,16 @@ footer {
width: 33%; width: 33%;
} }
input[type="color"] {
opacity: 0%;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
}
@media print { @media print {
body { body {
margin: auto; margin: auto;