Closes #76. We can discuss whether or not this is a necessary fix. I can see how the active styling while focused is confusing to some users. If you click the toggle, the dropdown shows, but if you click the toggle again, the dropdown hides but the toggle button still looks actively styled.
When the account menu toggle is focused, it maintains the active styling of the dropdown menu even if the menu is closed. This can be confusing to users, so we adjust the color styling to match the default styling of the button but maintain the focus outline for accessibility. I had to remove the CSS scoping to keep the classnames the same so I could target the button (Vue-Bootstrap adds classes to the component that don't take scoping into account).
Closes #76. We can discuss whether or not this is a necessary fix. I can see how the active styling while focused is confusing to some users. If you click the toggle, the dropdown shows, but if you click the toggle again, the dropdown hides but the toggle button still looks actively styled.
When the account menu toggle is focused, it maintains the active styling of the dropdown menu even if the menu is closed. This can be confusing to users, so we adjust the color styling to match the default styling of the button but maintain the focus outline for accessibility. I had to remove the CSS scoping to keep the classnames the same so I could target the button (Vue-Bootstrap adds classes to the component that don't take scoping into account).