From e8bdece4315d885fe2c240472f6cd3e9c87233d5 Mon Sep 17 00:00:00 2001
From: Marty Sluijtman <marty.wanderer@disroot.org>
Date: Fri, 11 Aug 2023 00:10:47 +0200
Subject: [PATCH] OnClick chroma

---
 layouts/partials/chroma.html | 21 +++++++++++++++++++++
 static/style.css             | 10 ++++++++--
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/layouts/partials/chroma.html b/layouts/partials/chroma.html
index 3610293..d521148 100644
--- a/layouts/partials/chroma.html
+++ b/layouts/partials/chroma.html
@@ -1,5 +1,6 @@
 <!-- Chromatic abaration effect -->
 <svg width="0" height="0">
+
 	<filter id="chroma">
 		<feColorMatrix type="matrix"
 			result="red_"
@@ -18,4 +19,24 @@
 		<feOffset in="blue_" dx="-3" dy="0" result="blue"/>
 		<feBlend mode="screen" in="red" in2="blue"/>
 	</filter>
+
+	<filter id="chromaClick">
+		<feColorMatrix type="matrix"
+			result="red_"
+			values="4 0 0 0 0 
+					0 0 0 0 0 
+					0 0 0 0 0 
+					0 0 0 1 0"/>
+		<feOffset in="red_" dx="4" dy="0" result="red"/>
+		<feColorMatrix type="matrix" 
+			in="SourceGraphic"
+			result="blue_"
+			values="0 0 0 0 0
+					0 3 0 0 0 
+					0 0 10 0 0 
+					0 0 0 1 0"/>
+		<feOffset in="blue_" dx="-5" dy="0" result="blue"/>
+		<feBlend mode="screen" in="red" in2="blue"/>
+	</filter>
+
 </svg>
diff --git a/static/style.css b/static/style.css
index 2ed0c28..2d6fc57 100644
--- a/static/style.css
+++ b/static/style.css
@@ -14,16 +14,22 @@ body {
 
 summary{cursor:pointer;}
 summary:hover{
-	-webkit-filter: url(#chroma);
+	filter: url(#chroma);
 	color: black;
 	background-color: #E60073;
 }
 
+summary:hover:active{ filter: url(#chromaClick) }
+
 a{
 	color: #E60073;
 	text-decoration: none;
 }
 
+a:hover:active{
+	filter:url(#chromaClick);
+}
+
 a::after{ content: ']'; }
 
 a::before{ content: '['; }
@@ -32,7 +38,7 @@ a:hover{
 	color: black;
 	background-color: #E60073;
 	position:relative;
-	-webkit-filter: url(#chroma);
+	filter: url(#chroma);
 }
 
 a:hover::selection{