Hosted Login v1 CSS legacy classes
Reference information for the CSS classes used in Hosted Login v1.
| Class | Description |
|---|---|
| body | Standard HTML tag that defines the document body. |
| h1, h2, h3, h4, h5, h6, p, a, span | Standard HTML tags for defining heading styles (h1-h6), paragraphs (p), hyperlinks (a), and spans. In Hosted Login, this is primarily used for formatting text. |
| h1, h2, h3 | Standard HTML tags for defining headings (h1-h3). |
| p | Standard HTML tag for defining paragraphs. |
| a | Standard HTML tag for defining hyperlinks. |
| button | Standard HTML tag for defining buttons. |
| #logo class | Used to define the logo that appears at the top of the container. |
| #main-container | Defines the background area that surrounds the main container. |
| #floating-container | Defines the main container, and includes the header, content container, and footer. |
| #header-container | Defines the header for the main container. By default, this where the logo appears. |
| #content-container | Essentially, the container that holds all the content except for the header. |
| .footer-container | Container footer. By default, the footer contains the link to the registration page. |
| .auth-screen, .auth-success-screen | Authentication screen. |
| #social-login-buttons | Buttons for the individual social login identity providers. |
| .form-action-buttons | Defines the background area for a form button. |
| .profile-management-card | Individual cards (sections) on the user profile screens. |
| .profile-management-row | Area where the profile management cards are overlaid. |
| .card-body | Text area for the profile management cards. |
| .card-heading | Header for the individual profile management cards. |
| .profile-header > div class (legacy Hosted Login CSS) | Header for the user profile screen. |
| .screen-heading | Description area on the user profile screen. |
| .manage-screen | Delineates the main screen on the user profile. |
| .auth-success-screen | Message screen displayed after a successful operation. |
| .success-check | Icon background color of operation success screens. |
| .button-danger | Buttons that carry out important (and potentially irreversible) actions. |
| .action-card | Individual cards found on the Privacy Settings screen. |
| .button-secondary | Secondary (non-default) buttons. |
Updated over 2 years ago