Login.scss page bundle

What does this MR do and why?

It converts scss/pages/login.scss into a page bundle. login.scss contains two top class selectors:

1. login-page
2. devise-layout-html

I looked for all the files where these class selectors are used and I included the new page-specific stylesheet.

Screenshots or screen recordings

page	Before	After
admin login
login
sign up
welcome page
SAML login
SAML login with devise_empty.html.haml layout
Two factor authentication

How to set up and validate locally

We need to verify that all pages that use the login stylesheet still look good 😬. I’ll provide instructions to access these pages.

NOTICE: We are modifying layout templates in this Merge Request. If a page that uses one of these layout templates looks correct, the other pages that use the same layout template should also be correct.

Admin login

Go to Admin -> Settings -> General -> Sign-in restrictions -> And check "Enable admin mode"

Sign in / sign up pages

Sign out in your local GDK and open the Sign In and Registration pages

SAML login

• Set up SAML in your local GDK for a single group (I know, it’s a lot of work) https://gitlab.com/gitlab-org/gitlab-development-kit/-/blob/main/doc/howto/saml.md
• Open the following URL in your local environment https://gdk.test:3443/groups/h5bp/-/saml/sso?token=4KxxyrWL

Welcome page

• Go to Admin -> Overview -> Users
• Invite a new user and approve them
• Sign in with the new user’s account.

Two-factor authentication

Set up two-factor authentication for the GDK user in https://gdk.test:3443/-/profile/two_factor_auth

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #239847 (closed)