Apply consistent button styling

[paulmelnikow]

As suggested in #7129, let's adopt a consistent style for the action buttons on the site, in place of the default button styles we've got in place now.

In terms of a design process, let's agree on the visual design in this thread and then once the design is approved, open a PR.

My suggestion as a starting point would be to mimic the styling of the button on the badge customizer (but without the dropdown):

[Andre601]

I feel like that this one is a good idea, but maybe leave away the gradient. A more flat colour palette without gradient (i.e. Material theme-like) seems to be a very popular solution, which makes sense since it's kinda time-less in design while gradients lose their charm quickly.

Also, not the biggest fan of this blue tbh. Maybe use a green colour instead for positive actions (make badge, copy URL, etc.)?

[paulmelnikow]

Happy for us to remove the gradient. In terms of action-button color, I think using the azureish blue is clearer than green, in part because the color is further from the Shields badge color scheme, so it makes a clearer difference between the action buttons and the example badges. I don't think action buttons need to be green.

[Andre601]

Of course. The important part here is to just find a consistent colouring in terms of what action-type should have what colour and such. This should perhaps go after #7176 to avoid bad colour combinations or badly readable buttons.

[itsajay1029]

Hey @paulmelnikow , can you assign me this issue so that I can get started working on it ?

[chris48s]

We have just launched a completely redesigned frontend https://shields.io/

Closing this issue as it relates to the previous frontend