MathJax can't align \vert

Question

The problem I'm having should be seen above.

\color{red}{x = (1-t)^3x_0 + 3t(1-t)^2x_{1} + 3t^2(1-t)x_{2} + t^3x_{3}}\\
\color{blue}{y = (1-t)^3y_0 + 3t(1-t)^2y_{1} + 3t^2(1-t)y_{2} + t^3y_{3}}
}\Bigg\vert t\in{[0,1]}

I have tried multiple different methods. Can someone recommend how I could get the \vert and conditions to align centered to the two lines of the equations.

P.S. - I know the math looks ugly... it was actually intentional... it's kind of a cross between programming and math... for a "math for programmers" document.

Answer 1

It's not clear exactly what you have in mind, but perhaps this does what you want:

<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>

$$
\left.
\begin{aligned}
\color{red}{x} &\color{red}{{}= (1-t)^3x_0 + 3t(1-t)^2x_{1} + 3t^2(1-t)x_{2} + t^3x_{3}}\ \\
\color{blue}{y} &\color{blue}{{}= (1-t)^3y_0 + 3t(1-t)^2y_{1} + 3t^2(1-t)y_{2} + t^3y_{3}}
\end{aligned}
\right\vert \ t\in{[0,1]}
$$