aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorGravatar Christian Hesse <mail@eworm.de>2023-05-23 11:47:06 +0200
committerGravatar Christian Hesse <mail@eworm.de>2023-05-25 10:38:57 +0200
commit5ae3cb336fa80d8d5fe141d59a85148f8c4823df (patch)
tree7e91e44c6ada6bc2a88ffb71fc22dead5e3f2f27
parentc2e7567c13bba80190ad5c2dd7c6ad7b025619e3 (diff)
add a logo color changer
Generate a colored logo for your notifications!
-rw-r--r--contrib/logo-color.d/script.js5
-rw-r--r--contrib/logo-color.d/style.css5
-rw-r--r--contrib/logo-color.html27
3 files changed, 37 insertions, 0 deletions
diff --git a/contrib/logo-color.d/script.js b/contrib/logo-color.d/script.js
new file mode 100644
index 0000000..ac89905
--- /dev/null
+++ b/contrib/logo-color.d/script.js
@@ -0,0 +1,5 @@
+function color() {
+ var svg = document.querySelector(".logo").getSVGDocument();
+ svg.getElementById("dark-1").setAttribute("stop-color", document.getElementById("color1").value);
+ svg.getElementById("dark-2").setAttribute("stop-color", document.getElementById("color2").value);
+}
diff --git a/contrib/logo-color.d/style.css b/contrib/logo-color.d/style.css
new file mode 100644
index 0000000..f0e3f49
--- /dev/null
+++ b/contrib/logo-color.d/style.css
@@ -0,0 +1,5 @@
+body {
+ font-family: fira-sans, sans;
+ font-size: 10pt;
+ background-color: transparent;
+}
diff --git a/contrib/logo-color.html b/contrib/logo-color.html
new file mode 100644
index 0000000..2864fcb
--- /dev/null
+++ b/contrib/logo-color.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>RouterOS-Scripts Logo Color Changer</title>
+<link rel="stylesheet" type="text/css" href="logo-color.d/style.css">
+<script src="logo-color.d/script.js"></script>
+</head>
+<body>
+
+<h1>RouterOS-Scripts Logo Color Changer</h1>
+
+<p>You want the logo for your own notifications? But you joined the
+<a href="https://t.me/routeros_scripts">Telegram Group</a> and want
+something that differentiates? Color it!</p>
+
+<embed class="logo" src="../logo.svg" width="128" height="128" type="image/svg+xml">
+
+<p>Select the colors here:
+<input id="color1" type="color" value="#222222" onchange="color();">
+<input id="color2" type="color" value="#444444" onchange="color();"></p>
+
+<p>Then right-click, click "<i>Take Screenshot</i>" and finally select the
+logo and download it.</p>
+
+</body>
+</html>