[1:01 pm: I refuse to believe they've run out of rum. Inconceivable.]

Continuing with Designing the Navbar, I created buttons for "Log in" and "Sign up", setting their font and color to match our brand, and creating conditions for them to change color on mouseover.

‍

Next, I grouped the buttons under the "Group Logged Out" group and docked them to the right, then defined a condition that makes them appear only when the user is logged out:

‍

I also need to uncheck "This element is visible on page load", letting the conditional I just defined decide whether it appears:

‍

Strangely, when dragging the header I just created onto the index page, it's missing the buttons!

‍

Actually no.. I just need to click the Preview button to view it in Debug mode, where it shows the buttons and their hover functionality.

‍

‍

Although... the buttons are stretched out. They didn't keep their distance between each other. This didn't happen in the Bubble lesson example, so I must've missed a step:

‍

Aha: I needed to check the "Make this element fixed-width" checkbox in the group's Appearance tab:

‍

Now it's good!

‍

‍

‍

‍