Use SVG to implement ribbon tails

[MrOrz]

The ribbon tails are not aligned in narrower screen:

(Actually the ribbon in the profile menu is not aligned either.)

Since it's difficult calculating border-size to place these triangles, I would suggest using svg instead.
It's shape is so simple that we can write the svg by hand:

<svg viewBox="0 0 1 2">
  <path d="M0 0 H1 L0 1 L1 2 H0 Z" />
</svg>

And we get a ribbon tail that we can resize and recolor using CSS.

Originally posted by @MrOrz in #264