Link with a line after which change places on hover

I recently had a design that included a link with had a line after the text. When hovering on the link the line should end up before the text. The obvious answer to this was to have two elements positioned using flex. Then on hover just add flex-dire...