
This animation of nav links is made possible with the links being a component with hover states. There are two text areas for both states (the first one aligned at the top and second one at the bottom) and we are switching (animating) between them on hover.
Both primary and hover states need to have the height property set to the same fixed value. Easiest way to animate between primary and hover state is through vertical stack layout making the primary variant distribute from Start and the hover variant distribute from End.
You can also adjust the gap depending on your personal preferences.

