Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fixed : #2516 Refactor CSS files in src/screens/OrganizationFunds #2743

Merged
merged 8 commits into from
Dec 24, 2024
Merged

fixed : #2516 Refactor CSS files in src/screens/OrganizationFunds #2743

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
8d0491c
issue-2516-fixed
gurramkarthiknetha Dec 23, 2024
96b9645
Merge branch 'develop-postgres' into issue-2516-fixed
gurramkarthiknetha Dec 23, 2024
5379880
test
gurramkarthiknetha Dec 23, 2024
82970a7
Merge branch 'issue-2516-fixed' of https://github.com/gurramkarthikne…
gurramkarthiknetha Dec 23, 2024
707f6b6
removed commented lines
gurramkarthiknetha Dec 24, 2024
a45e3eb
Merge branch 'develop-postgres' into issue-2516-fixed
gurramkarthiknetha Dec 24, 2024
eef4b0b
deleted file
gurramkarthiknetha Dec 24, 2024
94021a1
Merge branch 'issue-2516-fixed' of https://github.com/gurramkarthikne…
gurramkarthiknetha Dec 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
142 changes: 0 additions & 142 deletions src/screens/OrganizationFunds/OrganizationFunds.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,142 +0,0 @@
.list_box {
height: auto;
overflow-y: auto;
width: 100%;
}

.inputField {
margin-top: 10px;
margin-bottom: 10px;
background-color: white;
box-shadow: 0 1px 1px #31bb6b;
}

.inputField > button {
padding-top: 10px;
padding-bottom: 10px;
}

.dropdown {
background-color: white;
border: 1px solid #31bb6b;
position: relative;
display: inline-block;
color: #31bb6b;
}

.fundName {
font-weight: 600;
cursor: pointer;
}

.modalHeader {
border: none;
padding-bottom: 0;
}

.label {
color: var(--bs-emphasis-color);
}

.fundModal {
max-width: 80vw;
margin-top: 2vh;
margin-left: 13vw;
}

.titlemodal {
color: #707070;
font-weight: 600;
font-size: 32px;
width: 65%;
margin-bottom: 0px;
}

.noOutline input {
outline: none;
}

.modalCloseBtn {
width: 40px;
height: 40px;
padding: 1rem;
display: flex;
justify-content: center;
align-items: center;
}

.greenregbtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
padding: 10px 10px;
border-radius: 5px;
background-color: #31bb6b;
width: 100%;
font-size: 16px;
color: white;
outline: none;
font-weight: 600;
cursor: pointer;
transition:
transform 0.2s,
box-shadow 0.2s;
width: 100%;
}

.manageBtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
padding: 10px 10px;
border-radius: 5px;
font-size: 16px;
color: white;
outline: none;
font-weight: 600;
cursor: pointer;
width: 45%;
transition:
transform 0.2s,
box-shadow 0.2s;
}

.btnsContainer {
display: flex;
margin: 2rem 0 2.5rem 0;
}

.btnsContainer .input {
flex: 1;
min-width: 18rem;
position: relative;
}

.btnsContainer input {
outline: 1px solid var(--bs-gray-400);
}

.btnsContainer .input button {
width: 52px;
}

.mainpageright > hr {
margin-top: 20px;
width: 100%;
margin-left: -15px;
margin-right: -15px;
margin-bottom: 20px;
}

.rowBackground {
background-color: var(--bs-white);
max-height: 120px;
}

.tableHeader {
background-color: var(--bs-primary);
color: var(--bs-white);
font-size: 1rem;
}
20 changes: 10 additions & 10 deletions src/screens/OrganizationFunds/OrganizationFunds.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
align: 'center',
headerAlign: 'center',
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
sortable: false,
renderCell: (params: GridCellParams) => {
return <div>{params.row.id}</div>;
Expand All @@ -174,7 +174,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return (
<div
Expand All @@ -195,7 +195,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return params.row.creator.firstName + ' ' + params.row.creator.lastName;
},
Expand All @@ -207,7 +207,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
flex: 2,
renderCell: (params: GridCellParams) => {
return (
Expand All @@ -225,7 +225,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return params.row.isArchived ? 'Archived' : 'Active';
},
Expand All @@ -238,7 +238,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return (
<>
Expand Down Expand Up @@ -266,7 +266,7 @@ const organizationFunds = (): JSX.Element => {
minWidth: 100,
headerAlign: 'center',
sortable: false,
headerClassName: `${styles.tableHeader}`,
headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return (
<Button
Expand All @@ -292,7 +292,7 @@ const organizationFunds = (): JSX.Element => {
placeholder={tCommon('searchByName')}
autoComplete="off"
required
className={styles.inputField}
className={styles.inputFields}
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
data-testid="searchByName"
Expand All @@ -312,7 +312,7 @@ const organizationFunds = (): JSX.Element => {
<Dropdown.Toggle
variant="success"
id="dropdown-basic"
className={styles.dropdown}
className={styles.dropdowns}
data-testid="filter"
>
<Sort className={'me-1'} />
Expand Down Expand Up @@ -362,7 +362,7 @@ const organizationFunds = (): JSX.Element => {
),
}}
sx={dataGridStyle}
getRowClassName={() => `${styles.rowBackground}`}
getRowClassName={() => `${styles.rowBackgrounds}`}
autoHeight
rowHeight={65}
rows={funds.map((fund, index) => ({
Expand Down
101 changes: 101 additions & 0 deletions src/style/app.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -613,3 +613,104 @@ hr {
transform: rotate(360deg);
}
}

.list_box {
height: auto;
overflow-y: auto;
width: 100%;
}

.inputFields {
box-shadow: 0 1px 1px #31bb6b;
}

.dropdowns {
border: 1px solid #31bb6b;
color: #31bb6b;
}
gurramkarthiknetha marked this conversation as resolved.
Show resolved Hide resolved

.fundName {
font-weight: 600;
cursor: pointer;
}

.modalHeader {
border: none;
padding-bottom: 0;
}

.label {
color: var(--bs-emphasis-color);
}

.fundModal {
max-width: 80vw;
margin-top: 2vh;
margin-left: 13vw;
}

.titlemodal {
color: #707070;
font-weight: 600;
font-size: 32px;
width: 65%;
margin-bottom: 0px;
}

.modalCloseBtn {
width: 40px;
height: 40px;
padding: 1rem;
display: flex;
justify-content: center;
align-items: center;
}

.greenregbtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
padding: 10px 10px;
border-radius: 5px;
background-color: #31bb6b;
width: 100%;
font-size: 16px;
color: white;
outline: none;
font-weight: 600;
cursor: pointer;
transition:
transform 0.2s,
box-shadow 0.2s;
width: 100%;
}

.manageBtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
padding: 10px 10px;
border-radius: 5px;
font-size: 16px;
color: white;
outline: none;
font-weight: 600;
cursor: pointer;
width: 45%;
transition:
transform 0.2s,
box-shadow 0.2s;
}
gurramkarthiknetha marked this conversation as resolved.
Show resolved Hide resolved

.rowBackgrounds {
background-color: var(--bs-white);
max-height: 120px;
}

.tableHeaders {
background-color: var(--bs-primary);
color: var(--bs-white);
font-size: 1rem;
}
Loading