Removes borders around form sections #1136
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
daniellemaxwell
commented
Jan 5, 2024
| import React from 'react'; | ||
| import AddressList from './AddressList'; | ||
|
|
||
| const Addresses: React.FC = () => { | ||
| return ( | ||
| <FormLayout> |
There was a problem hiding this comment.
The FormLayout component has a styles set to display the border that we wanted to remove from around the form's smaller sections. The FormLayout component is used throughout the UI, so replacing it with the Stack component allows for the content to be grouped together. This change will also make it easier to apply specific styles to a smaller section within a form.
daniellemaxwell
commented
Jan 5, 2024
| @@ -3,7 +3,7 @@ import { chakra, useDisclosure } from '@chakra-ui/react'; | |||
| import CountryOfRegistration from 'components/CountryOfRegistration'; | |||
| import FormLayout from 'layouts/FormLayout'; | |||
| import NameIdentifiers from '../NameIdentifiers'; | |||
| import NationalIdentification from '../NameIdentification'; | |||
| import NationalIdentification from '../NationalIdentification'; | |||
There was a problem hiding this comment.
The file name was changed to make it easier to locate the component.
daniellemaxwell
commented
Jan 5, 2024
| @@ -148,21 +148,27 @@ const ContactsForm: React.FC<ContactsFormProps> = ({ data, shouldResetForm, onRe | |||
| title={t`Legal/ Compliance Contact (required)`} | |||
| description={t`Compliance officer or legal contact for requests about the compliance requirements and legal status of your organization. A business phone number is required to complete physical verification for MainNet registration. Please provide a phone number where the Legal/ Compliance contact can be contacted.`} | |||
| /> | |||
| <ContactForm | |||
| <Box pt={5}> | |||
There was a problem hiding this comment.
Box is Chakra UI's (the component library used for this app) way of adding a <div>.
pdamodaran
approved these changes
Jan 8, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Scope of changes
This removes borders that appeared around smaller sections of the registration form. The borders were removed from the Legal Form, Contacts Form, and TRISA Implementation Form.
Below is an image of the Legal Form which displays the borders that have been removed in this PR:
https://www.awesomescreenshot.com/image/45230137?key=90d86e2a4ffbb0639a2196b56934f4b3
Note: Padding above the buttons will addressed in another story.
Type of change
Acceptance criteria
Note: Some changes were made to allow me to make changes while not being able to log in. This caused the form to take longer to load in the video below, so no stories will be created to address the issues that appear when in the video.
https://www.awesomescreenshot.com/video/23806300?key=464e6853ac043ab69eb732284a0f981f
Author checklist
Reviewer(s) checklist