FloorPlan and Invisible Touch Areas


Im using Floorplan (Floorplan for Home Assistant) for lights and fans. The lights change a color when on/ff and fans have a spinning animation + color change. In mobile interface it is difficult to hit the fan icon so I would like to increase my touch area. I made invisible disk under the fan (to visualize it for you, color changed to red). I have this in my Floorplan:

        action: call-service
        service: floorplan.class_set
          class: >-
            ${(entity.state === "on") ? "spin-" + entity.attributes.percentage :""}

and in css

/* Animation */

.spin-33 {
  animation-name: spin;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  transform-origin: center;
  transform-box: fill-box;
  fill: #aeff00 !important;

Of course this will spin my circle and not the fan. How do I modify this css that it animates my fan icon id:(fan.master_bedroom_fan_icon) and not my action icon id: (fan.master_bedroom_fan)?



did you get this working?