Few UI bug Fixing. (PalisadoesFoundation#1194)

* UI changes in user update page * Fixed some UI bugs. * Fix linting checks
kanhaiya04 · Dec 16, 2023 · 0d50c5d · 0d50c5d
1 parent 253f95d
commit 0d50c5d
Show file tree

Hide file tree

Showing 6 changed files with 49 additions and 45 deletions.
diff --git a/src/screens/EventDashboard/EventDashboard.module.css b/src/screens/EventDashboard/EventDashboard.module.css
@@ -14,7 +14,6 @@
   height: 100%;
 }
 .sidebar:after {
-  content: '';
   background-color: #f7f7f7;
   position: absolute;
   width: 2px;

diff --git a/src/screens/LoginPage/LoginPage.tsx b/src/screens/LoginPage/LoginPage.tsx
@@ -248,7 +248,6 @@ function loginPage(): JSX.Element {
                   <div className="position-relative">
                     <Form.Control
                       type="email"
-                      className="mb-3"
                       placeholder={t('enterEmail')}
                       required
                       value={formState.email}
@@ -268,7 +267,7 @@ function loginPage(): JSX.Element {
                       <EmailOutlinedIcon />
                     </Button>
                   </div>
-                  <Form.Label>{t('password')}</Form.Label>
+                  <Form.Label className="mt-3">{t('password')}</Form.Label>
                   <div className="position-relative">
                     <Form.Control
                       type={showPassword ? 'text' : 'password'}

diff --git a/src/screens/OrgContribution/OrgContribution.module.css b/src/screens/OrgContribution/OrgContribution.module.css
@@ -43,7 +43,6 @@
   height: 100%;
 }
 .sidebar:after {
-  content: '';
   background-color: #f7f7f7;
   position: absolute;
   width: 2px;

diff --git a/src/screens/OrganizationEvents/OrganizationEvents.module.css b/src/screens/OrganizationEvents/OrganizationEvents.module.css
@@ -38,7 +38,6 @@
 }
 
 .sidebar:after {
-  content: '';
   background-color: #f7f7f7;
   position: absolute;
   width: 2px;

diff --git a/src/screens/OrganizationPeople/OrganizationPeople.module.css b/src/screens/OrganizationPeople/OrganizationPeople.module.css
@@ -43,7 +43,6 @@
   height: 100%;
 }
 .sidebar:after {
-  content: '';
   background-color: #f7f7f7;
   position: absolute;
   width: 2px;
@@ -241,6 +240,9 @@
   animation: load8 1.1s infinite linear;
 }
 .radio_buttons {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
   color: #707070;
   font-weight: 600;
   font-size: 14px;

diff --git a/src/screens/OrganizationPeople/OrganizationPeople.tsx b/src/screens/OrganizationPeople/OrganizationPeople.tsx
@@ -185,45 +185,51 @@ function organizationPeople(): JSX.Element {
                   className={styles.radio_buttons}
                   data-testid="usertypelist"
                 >
-                  <Form.Check
-                    type="radio"
-                    inline
-                    id="userslist"
-                    value="userslist"
-                    name="displaylist"
-                    data-testid="users"
-                    defaultChecked={state == 2 ? true : false}
-                    onClick={(): void => {
-                      setState(2);
-                    }}
-                  />
-                  <label htmlFor="userslist">{t('users')}</label>
-                  <Form.Check
-                    type="radio"
-                    inline
-                    id="memberslist"
-                    value="memberslist"
-                    name="displaylist"
-                    data-testid="members"
-                    defaultChecked={state == 0 ? true : false}
-                    onClick={(): void => {
-                      setState(0);
-                    }}
-                  />
-                  <label htmlFor="memberslist">{t('members')}</label>
-                  <Form.Check
-                    type="radio"
-                    inline
-                    id="adminslist"
-                    value="adminslist"
-                    name="displaylist"
-                    data-testid="admins"
-                    defaultChecked={state == 1 ? true : false}
-                    onClick={(): void => {
-                      setState(1);
-                    }}
-                  />
-                  <label htmlFor="adminslist">{t('admins')}</label>
+                  <div>
+                    <Form.Check
+                      type="radio"
+                      inline
+                      id="userslist"
+                      value="userslist"
+                      name="displaylist"
+                      data-testid="users"
+                      defaultChecked={state == 2 ? true : false}
+                      onClick={(): void => {
+                        setState(2);
+                      }}
+                    />
+                    <label htmlFor="userslist">{t('users')}</label>
+                  </div>
+                  <div>
+                    <Form.Check
+                      type="radio"
+                      inline
+                      id="memberslist"
+                      value="memberslist"
+                      name="displaylist"
+                      data-testid="members"
+                      defaultChecked={state == 0 ? true : false}
+                      onClick={(): void => {
+                        setState(0);
+                      }}
+                    />
+                    <label htmlFor="memberslist">{t('members')}</label>
+                  </div>
+                  <div>
+                    <Form.Check
+                      type="radio"
+                      inline
+                      id="adminslist"
+                      value="adminslist"
+                      name="displaylist"
+                      data-testid="admins"
+                      defaultChecked={state == 1 ? true : false}
+                      onClick={(): void => {
+                        setState(1);
+                      }}
+                    />
+                    <label htmlFor="adminslist">{t('admins')}</label>
+                  </div>
                 </div>
               </div>
             </div>