[IMP] filters view

JoanSForgeFlow · May 12, 2023 · 775b5a4 · 775b5a4
1 parent acd4fa2
commit 775b5a4
Showing 1 changed file with 75 additions and 3 deletions.
diff --git a/css/styles.css b/css/styles.css
@@ -83,7 +83,7 @@ display: flex;
 justify-content: center;
 align-items: center;
 gap: 12px;
-padding: 16px;
+padding: 4px;
 background-color: #f7dada;
 border-radius: 8px;
 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
@@ -96,10 +96,10 @@ display: none;
 
 .special-filter-container label {
 cursor: pointer;
-padding: 6px 12px;
+padding: 2px 12px;
 background-color: #ccc;
 border-radius: 4px;
-font-size: 14px;
+font-size: 12px;
 color: #333;
 transition: background-color 0.2s, color 0.2s;
 }
@@ -112,4 +112,76 @@ color: #ffffff;
 .special-filter-container input[type="checkbox"]:focus + label {
 outline: auto 1px Highlight;
 outline: auto 5px -webkit-focus-ring-color;
+}
+.normal {
+background-color: #A8A878;
+color: #fff;
+}
+.fighting {
+background-color: #C03028;
+color: #fff;
+}
+.flying {
+background-color: #A890F0;
+color: #fff;
+}
+.poison {
+background-color: #A040A0;
+color: #fff;
+}
+.ground {
+background-color: #E0C068;
+color: #fff;
+}
+.rock {
+background-color: #B8A038;
+color: #fff;
+}
+.bug {
+background-color: #A8B820;
+color: #fff;
+}
+.ghost {
+background-color: #705898;
+color: #fff;
+}
+.steel {
+background-color: #B8B8D0;
+color: #fff;
+}
+.fire {
+background-color: #F08030;
+color: #fff;
+}
+.water {
+background-color: #6890F0;
+color: #fff;
+}
+.grass {
+background-color: #78C850;
+color: #fff;
+}
+.electric {
+background-color: #F8D030;
+color: #fff;
+}
+.psychic {
+background-color: #F85888;
+color: #fff;
+}
+.ice {
+background-color: #98D8D8;
+color: #fff;
+}
+.dragon {
+background-color: #7038F8;
+color: #fff;
+}
+.dark {
+background-color: #705848;
+color: #fff;
+}
+.fairy {
+background-color: #EE99AC;
+color: #fff;
 }