Let's explore various options for toggling between Lock / Unlock, and Lock filled / Lock unfilled
Considerations:
If lock shackle moves too much (ie to rotate) it will fall outside of the boundary of the icon (ie the 32px X 32px bounding box). We need to explore solutions that keep the lock shackle within the boundaries, and also we can look at solutions that go outside the boundaries but we will need to figure out ways to ensure that having a wider or taller icon will not impact the css layout of the rest of the page
Name of icon to be animated as shown in Carbon Icon Library:
Let's explore various options for toggling between Lock / Unlock, and Lock filled / Lock unfilled
Considerations: If lock shackle moves too much (ie to rotate) it will fall outside of the boundary of the icon (ie the 32px X 32px bounding box). We need to explore solutions that keep the lock shackle within the boundaries, and also we can look at solutions that go outside the boundaries but we will need to figure out ways to ensure that having a wider or taller icon will not impact the css layout of the rest of the page