ed940a6413
### Summary This PR updates the styling of the user full name input field on the onboarding screen to match the styling of the radio button groups, creating a more consistent and polished UI. ### Problem The full name input field in the onboarding form had inconsistent styling compared to the radio button groups, which created a visually disjointed user experience. ### Solution - Created a styled version of `FormTextField` that matches the styling of radio buttons - Added proper spacing with a dedicated `InputSection` component - Removed unnecessary vertical spacing elements - Ensured consistent typography, sizing, and spacing across form elements ### Changes - Added `StyledFormTextField` with custom CSS to match radio button styling: - Same font size and weight for labels - Consistent height, padding, and border-radius - Full width input field - Created `InputSection` for consistent vertical spacing - Replaced original `FormTextField` with the styled version - Removed redundant `Space` components ### Screenshots ![Before]( <img width="1449" alt="Screenshot 2025-05-22 at 6 50 04 AM" src="https://github.com/user-attachments/assets/54384e0d-4874-4550-8415-54b15a8e9b13" /> ) | ![After]( <img width="1452" alt="Screenshot 2025-05-22 at 6 39 38 AM" src="https://github.com/user-attachments/assets/01b8fd1e-0c47-4d8f-abe7-4f47a31366b6" /> ) ## Automation /ok-to-test tags="@tag.Sanity, @tag.Authentication" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/15205128744> > Commit: 6e26d5ad7afef489697362b9202d7fd3be5b63a0 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=15205128744&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Sanity, @tag.Authentication` > Spec: > <hr>Fri, 23 May 2025 08:33:29 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added a required full name field to the non-super user profiling form, displayed when cloud billing is enabled. - **Style** - Improved input field appearance and adjusted vertical spacing for a cleaner form layout. - **Refactor** - Streamlined form styling by introducing new styled components and localizing spacing definitions. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|---|---|---|
| .. | ||
| .husky | ||
| .yarn | ||
| config | ||
| cypress | ||
| docker/templates | ||
| generators | ||
| packages | ||
| public | ||
| scripts | ||
| src | ||
| test | ||
| typings | ||
| .babelrc | ||
| .dockerignore | ||
| .editorconfig | ||
| .eslintrc.base.json | ||
| .eslintrc.js | ||
| .fork-ts-checkerrc | ||
| .gitignore | ||
| .lintstagedrc.json | ||
| .nvmrc | ||
| .prettierignore | ||
| .prettierrc | ||
| .sentryclirc | ||
| .yarnrc.yml | ||
| build.sh | ||
| cypress_ci_custom.config.ts | ||
| cypress_ci_hosted.config.ts | ||
| cypress_ci.config.ts | ||
| cypress-add-tags.js | ||
| cypress.config.ts | ||
| download-assets.js | ||
| jest.config.js | ||
| knip.json | ||
| package.json | ||
| README.md | ||
| README.old.md | ||
| start-caddy.sh | ||
| start-https.sh | ||
| tailwind.config.js | ||
| tsconfig.json | ||
| tsconfig.path.json | ||
| vercel.json | ||
| yarn.lock | ||
Appsmith Client
This project was bootstrapped with Create React App.
For details on setting up your development machine, please refer to the Setup Guide