Update Filters code

1 files changed, 24 insertions, 16 deletions

diff --git a/docs/dist/spectre-exp.css b/docs/dist/spectre-exp.css
index a6cadf0..6bc13e5 100644
--- a/docs/dist/spectre-exp.css
+++ b/docs/dist/spectre-exp.css
@@ -452,6 +452,30 @@
   }
 }
 
+.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for="tag-0"],
+.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for="tag-1"],
+.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for="tag-2"],
+.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for="tag-3"],
+.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for="tag-4"],
+.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for="tag-5"],
+.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for="tag-6"],
+.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for="tag-7"],
+.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for="tag-8"] {
+  background: #5755d9;
+  color: #fff;
+}
+
+.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~="tag-1"]),
+.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~="tag-2"]),
+.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~="tag-3"]),
+.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~="tag-4"]),
+.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~="tag-5"]),
+.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~="tag-6"]),
+.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~="tag-7"]),
+.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~="tag-8"]) {
+  display: none;
+}
+
 .filter .filter-nav {
   margin: .4rem 0;
 }
@@ -463,22 +487,6 @@
   flex-wrap: wrap;
 }
 
-.filter .filter-tag#tag-all:checked ~ .filter-nav .chip[for="tag-all"],
-.filter .filter-tag#tag-action:checked ~ .filter-nav .chip[for="tag-action"],
-.filter .filter-tag#tag-roleplaying:checked ~ .filter-nav .chip[for="tag-roleplaying"],
-.filter .filter-tag#tag-shooter:checked ~ .filter-nav .chip[for="tag-shooter"],
-.filter .filter-tag#tag-sports:checked ~ .filter-nav .chip[for="tag-sports"] {
-  background: #5755d9;
-  color: #fff;
-}
-
-.filter .filter-tag#tag-action:checked ~ .filter-body .column:not([data-tag~="tag-action"]),
-.filter .filter-tag#tag-roleplaying:checked ~ .filter-body .column:not([data-tag~="tag-roleplaying"]),
-.filter .filter-tag#tag-shooter:checked ~ .filter-body .column:not([data-tag~="tag-shooter"]),
-.filter .filter-tag#tag-sports:checked ~ .filter-body .column:not([data-tag~="tag-sports"]) {
-  display: none;
-}
-
 .meter {
   -webkit-appearance: none;
   -moz-appearance: none;