Remove the focus on buttons and other components when clicking.

This is a problem considering that the user experience is diminished and the website in whole looks worse when this occurs.

Solution The easiest way to solve this is to style the button component with outline: none;.

button:focus {
   outline: none;
}

I had tried this myself and it seems to work, I did not create a pull request because I thought this was a very small snippet of code.

[rv178]

I have already told but still, how will the user know about the interaction like how will we know if the button is clicked. There are ripples for material design what’s there here?

The user would know about it when the button is clicked, but I just suggested a really easy to implement and small feature in order to remove the border around the button which can easily be done just by styling the button with the attribute outline: none;

[lorstenoplo]

Yeah instead of removing the outline on focus it should altered to something else like changing the colour, changing the size, box shadows, ripples etc. They will help to retain ux ( following the ARIA guidelines ) and improve the ui like a hell lot.