Highlight active icon

lib/liliform/icon.ex

@@ -119,6 +119,7 @@ defmodule Liliform.Icon do
           color -> color
         end
 
+      auto_color =
         case assigns.for do
           "alert" -> [class: "has-text-danger"]
           "info" -> [class: "has-text-info"]
@@ -133,6 +134,17 @@ defmodule Liliform.Icon do
           "account" -> [color: "darkblue"]
           _ -> [color: color]
         end
+
+      case color do
+        "auto" ->
+          auto_color
+
+        "" ->
+          []
+
+        _ ->
+          [color: color]
+      end
     else
       [class: "has-text-dark"]
     end

lib/liliform/page.ex

@@ -50,7 +50,7 @@ defmodule Liliform.Page do
                 phx-click="filter"
                 phx-value-key={filter.key}
               >
-                <.icon for={filter.icon} color="auto" />
+                <.icon for={filter.icon} color={if filter.active, do: "gray", else: "auto"} />
               </a>
             <% end %>
           </.panel_tabs>