Documentation Index
Fetch the complete documentation index at: https://docs.brikl.co/llms.txt
Use this file to discover all available pages before exploring further.
Overview
Popup 13 is a login modal component that allows users to authenticate into their account. It includes a branded icon, a welcome title, a subtitle, email and password input fields, a remember me toggle, and a sign in button. It also supports showing/hiding the popup and handles the full login workflow including credential submission.How to use
States
This component includes conditional states that automatically change its appearance.| State | Trigger | Visual effect |
|---|---|---|
| Button Hovered | User hovers over the Sign In button | Button opacity reduces to 90% |
| Button Disabled | Sign In button is not clickable | Button opacity reduces to 50% |
| Input Focused | User clicks into the Email input field | Box shadow appears around the input to indicate focus |
| Input Invalid | Email input fails validation | Border turns red and a red box shadow appears around the input |
| Input Disabled | Email input is not clickable | Input opacity reduces to 50% |
| Remember Me Active | User clicks the remember me checkbox when it is false | Custom state ‘remember_me_’ is set to true |
| Remember Me Inactive | User clicks the remember me checkbox when it is true | Custom state ‘remember_me_’ is set to false |
These states are handled natively by Bubble and require no additional setup.
They will work automatically once the component is pasted into your editor.
Responsive
This component adapts to mobile screens. Font sizes and layout automatically adjust on screens smaller than Bubble’s built-in mobile breakpoint.Workflows
This component includes pre-built workflows.| Trigger | Action |
|---|---|
| Sign In button (bTUaz) - ButtonClicked | Logs the user in using the email input value, password input value, and the remember me custom state |
| Remember Me checkbox (bTUcT) - ButtonClicked (when remember_me_ is false) | Sets the custom state ‘remember_me_’ on the popup to true |
| Remember Me checkbox (bTUcT) - ButtonClicked (when remember_me_ is true) | Sets the custom state ‘remember_me_’ on the popup to false |
| Close button (bTUbj) - ButtonClicked | Hides the popup element (bTUag) |
| Open/Show button (bTUbt) - ButtonClicked | Shows the popup element (bTUag) |
These workflows are included when you use the Copy with Workflows option in the Brikl panel.
Requirements
| License | Starter plan required |
| Plugins | None |
| Custom code | Not required |
Platforms
| Platform | Supported |
|---|---|
| Web | ✅ |
| Mobile | ❌ |
License
This component requires a Starter plan.