filter what you desire (#42)

* filter interaction * filter scope
s9a · Nov 22, 2021 · b54744a · b54744a
1 parent 647f81e
commit b54744a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -138,4 +138,16 @@
 </fieldset>
 ```
 
+#### [filter](https://developer.mozilla.org/CSS/filter) [scope](../../pull/42)
+
+```css
+:focus {
+  --tape-filter: invert(100%);
+}
+
+:link:hover {
+  --tape-filter: hue-rotate(120deg);
+}
+```
+
 [<tt><b>tape online. :D</b></tt>](https://s9a.github.io/tape/)
diff --git a/tape.css b/tape.css
@@ -5,6 +5,7 @@
   --tape-yellow: #eee833;
   --tape-blue: #11dff1;
   --tape-green: #44f477;
+  --tape-filter: none;
 }
 
 @media (prefers-contrast: less) {
@@ -34,6 +35,7 @@
 .tape-green,
 .tape-yellow,
 .tape-white {
+  filter: var(--tape-filter);
   background: var(--tape-hex) !important;
   color: var(--tape-black) !important;
 }