Visual adjustments to signup form

[Daniel-Warner-X]

This is part of the Get New Users Into Chat epic. Along with updates to the UI of adjacent components, this contributes to conveying a sense of organization and stability to new users. It also aims to drive more email activations but being clearer about how lightweight that process is.

Updates the button label on email signup, the visual design of the 'your data is your data' message, and the responsive behavior of the form at large sizes.

New View:

Existing View:

[dustinbyrne]

When the "your data is your data" messaging collapses into rows, the shield is no longer aligned with this change

[dustinbyrne]

Looks like there's a @media (max-width: 365px) query responsible for this somewhere.

[dustinbyrne]

I've noticed that rem units tend to be larger once in VS Code. You may want to consider using em here. Here's what it currently looks like in VS Code:

[dustinbyrne]

This looks unrelated to this particular change, but I'm noticing that the height: 100% on .signin-sidebar will cause text to overflow the container if the view is too narrow.

[dustinbyrne]

This test will need to be updated

appmap-js/packages/components/tests/e2e/specs/sidebarSignIn.spec.js

Lines 21 to 23 in d764365

	cy.get('[data-cy="email-activation-button"]')
	.should('contain.text', 'Activate with')
	.should('contain.text', 'Email');

Activate with just needs to change to Get activation code by. Or just remove the calls to should - I don't find it necessary to assert the text.