Как вертикально выровнять текст внутри flexbox

Я создаю портфолио и имею ссылки в виде кнопок, выполненных в виде flexbox, чтобы упростить реакцию. Также высота этих флексбоксов делается с помощью JavaScript из-за наличия процентов.

Я уже пробовал другие советы, но ни один из них не был таким точным. я пытался использовать

justify-content:center
align-self:center
vertical-align:center

В настоящее время я использую Ubuntu 19.04, текстовый редактор Atom и PHP 7.2.17.

Код здесь https://codepen.io/fTc_CZ/pen/joGYJr

Я ожидал, что текст будет выровнен по центру квадрата, а не по его верхней части.