Button stays in focus after click

Question

When using Blazor Webassembly .net 7 with bootstrap theme, when you click a button it does its normal animation of the click and creates a shadow outline around the button. This is all good, however, it does not go away unless you manually click somewhere on the screen.

Is this behaviour expected? should it not return to normal state after the click and it's animation.

This is very evident on bootstrap theme, but with other ones such as Fluent, you can see the button stays in focus after the click, there is a slight colour difference.

I would like to know is there someway to keep the animation but revert the button back to normal state afterwards.

Saranya Dhayalan · Answer

Hi Andrew,Query:
When using Blazor Webassembly .net 7 with bootstrap
theme, when you click a button it does its normal animation of the click and
creates a shadow outline around the button. This is all good, however, it does
not go away unless you manually click somewhere on the screen. Is this behavior expected?Checked your query, In
our behavior, when you click the button, the focus and active
states are added. In the bootstrap theme, we have added a box shadow for the
focus state. Therefore, the box shadow is not removed. Only the focus is
removed when you click somewhere else on the screen.Please check the
below bootstrap5 theme official sitehttps://getbootstrap.com/docs/5.0/components/buttons/Please check and get
back to us, if you need further assistance.Regards,Saranya D