Link icon position fixed

[flamerohr]

it was placed too high, this seems to be a recurring theme for the new icons

@clarkepaul what do think about applying this to all the new icons instead?

[helpfulrobot]

@flamerohr, thanks for your PR! By analyzing the blame information on this pull request, I identified @clarkepaul and @chillu to be potential reviewers

[clarkepaul]

Ideally it shouldn't need the vertical-align applied so there is probably something going on there. Not a biggy though. As you see from the other buttons with icons no vertical-align is needed there.

Perhaps the line-height is being override?
The branch is broken at the moment, I can check it out when fixed.

[clarkepaul]

Because its all custom code you it is fine to add additional styles for it but the class .icon isn't required. When designing it I thought we could use the example here http://v4-alpha.getbootstrap.com/components/forms/#hidden-labels as a guide to building it.

Instead of using the custom classes like .editor__url-icon try to use generic naming so it could be used in other places. There are some classes to resize the icon but it doesn't fix the positioning in this case (.btn--icon-md .btn--icon-xl). FYI I should rename those so they aren't just associated to buttons.

[chillu]

@flamerohr @clarkepaul What's the verdict on this?

[clarkepaul]

I will see if I can clean up the css a bit now

[clarkepaul]

I've removed the styles which adjust the position of the link icon and moved them to Framework so they can reused globally. Im happy for this branch to be merged in, the icon position will be slightly off but fix for that is here silverstripe/silverstripe-framework#6003