Skip to content

Commit

Permalink
Refactored css in src/screens/OrganizationPeople/OrganizationPeople.t…
Browse files Browse the repository at this point in the history 
…sx (#2978)
  • Loading branch information
@AceHunterr
AceHunterr authored Dec 27, 2024
1 parent 8719d53 commit 2327a4b
Show file tree
Hide file tree
Showing 2 changed files with 55 additions and 54 deletions.
10 changes: 5 additions & 5 deletions src/screens/OrganizationPeople/OrganizationPeople.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -393,21 +393,21 @@ function organizationPeople(): JSX.Element {
),
}}
sx={{
borderRadius: '20px',
backgroundColor: '#EAEBEF',
borderRadius: 'var(--table-head-radius)',
backgroundColor: 'var(--grey-bg-color)',
'& .MuiDataGrid-row': {
backgroundColor: '#eff1f7',
backgroundColor: 'var(--tablerow-bg-color)',
'&:focus-within': {
outline: '2px solid #000',
outlineOffset: '-2px',
},
},
'& .MuiDataGrid-row:hover': {
backgroundColor: '#EAEBEF',
backgroundColor: 'var(--grey-bg-color)',
boxShadow: '0 0 0 1px rgba(0, 0, 0, 0.1)',
},
'& .MuiDataGrid-row.Mui-hovered': {
backgroundColor: '#EAEBEF',
backgroundColor: 'var(--grey-bg-color)',
boxShadow: '0 0 0 1px rgba(0, 0, 0, 0.1)',
},
'& .MuiDataGrid-cell:focus': {
Expand Down
99 changes: 50 additions & 49 deletions src/style/app.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
--brown-color: #555555;
--dropdown-hover-color: #eff1f7;
--grey-bg-color: #eaebef;
--grey-border-box-color: #e8e5e5;
--subtle-blue-grey: #7c9beb;
--subtle-blue-grey-hover: #5f7e91;
--modal-width: 670px;
Expand All @@ -15,13 +16,13 @@
--table-image-small-size: 25px;
--bs-primary: #0056b3;
--bs-white: #fff;
--table-head-bg: var(--bs-primary, blue);
--table-head-bg: var(
--bs-primary,
blue --loader-size: 10em; --loader-border-width: 1.1em; --loader-color:
#febc59;
blue
); /* Assuming var(--bs-primary) is defined elsewhere */

--loader-size: 10em;
--loader-border-width: 1.1em;
--loader-color: #febc59;
--table-head-color: white;
--table-header-color: var(--bs-greyish-black, black);
--table-head-radius: 20px;
Expand Down Expand Up @@ -165,7 +166,7 @@
.sidebarsticky > input {
text-decoration: none;
margin-bottom: 50px;
border-color: #e8e5e5;
border-color: var(--grey-border-box-color);
width: 80%;
border-radius: 7px;
padding-top: 5px;
Expand All @@ -184,13 +185,13 @@
color: var(--delete-button-color);
margin-right: 5px;
background-color: var(--delete-button-bg);
border: white;
border: var(--bs-white);
}

.closeButton:hover {
color: var(--delete-button-bg) !important;
background-color: var(--delete-button-color) !important;
border: white;
border: var(--bs-white);
}

.modalContent {
Expand All @@ -209,7 +210,7 @@
}

.dropdown {
background-color: white;
background-color: var(--bs-white);
border: 1px solid var(--brown-color);
color: var(--brown-color);
position: relative;
Expand All @@ -229,7 +230,7 @@
}

.dropdownItem {
background-color: white !important;
background-color: var(--bs-white) !important;
color: var(--brown-color) !important;
border: none !important;
}
Expand Down Expand Up @@ -346,13 +347,13 @@
.inputField {
margin-top: 10px;
margin-bottom: 10px;
background-color: white;
background-color: var(--bs-white);
box-shadow: 0 1px 1px var(--input-shadow-color);
}

.inputFieldModal {
margin-bottom: 10px;
background-color: white;
background-color: var(--bs-white);
box-shadow: 0 1px 1px var(--input-shadow-color);
}

Expand Down Expand Up @@ -652,7 +653,7 @@ hr {
.greenregbtnPledge {
margin-top: 15px;
border: 1px solid var(--bs-gray-300);
box-shadow: 0 2px 2px #e8e5e5;
box-shadow: 0 2px 2px var(--grey-border-box-color);
padding: 10px 10px;
border-radius: 5px;
background-color: var(--bs-primary);
Expand Down Expand Up @@ -688,12 +689,12 @@ hr {
}

.inputFieldPledge {
background-color: white;
background-color: var(--bs-white);
box-shadow: 0 1px 1px #31bb6b;
}

.dropdownPledge {
background-color: white;
background-color: var(--bs-white);
border: 1px solid var(--bs-primary);
position: relative;
display: inline-block;
Expand Down Expand Up @@ -827,7 +828,7 @@ hr {
margin-top: 0.5rem;
padding: 0.75rem;
border: 1px solid #e2e8f0;
background-color: white;
background-color: var(--bs-white);
color: #1e293b;
box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 0.15);
display: flex;
Expand Down Expand Up @@ -1007,7 +1008,7 @@ hr {

.customcell {
background-color: #31bb6b !important;
color: white !important;
color: var(--bs-white) !important;
font-size: medium !important;
font-weight: 500 !important;
padding-top: 10px !important;
Expand Down Expand Up @@ -1054,13 +1055,13 @@ hr {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid var(--bs-gray-300);
box-shadow: 0 2px 2px #e8e5e5;
box-shadow: 0 2px 2px var(--grey-border-box-color);
padding: 10px 10px;
border-radius: 5px;
background-color: var(--bs-primary);
width: 100%;
font-size: 16px;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand All @@ -1071,7 +1072,7 @@ hr {
}

.goalButtonOrganizationFundCampaign {
border: 1px solid #e8e5e5 !important;
border: 1px solid var(--grey-border-box-color) !important;
color: #707070 !important;
width: 75%;
padding: 10px;
Expand All @@ -1084,13 +1085,13 @@ hr {
.redregbtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 0 2px 2px var(--grey-border-box-color);
padding: 10px 10px;
border-radius: 5px;
width: 100%;
font-size: 16px;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand All @@ -1111,13 +1112,13 @@ hr {
}

.inputFieldOrganizationFundCampaign {
background-color: white;
background-color: var(--bs-white);
box-shadow: 0 1px 1px var(--search-button-bg);
}

.dropdownOrganizationFundCampaign {
background-color: white;
border: 1px solid #e8e5e5;
background-color: var(--bs-white);
border: 1px solid var(--grey-border-box-color);
position: relative;
display: inline-block;
color: #707070;
Expand Down Expand Up @@ -1510,12 +1511,12 @@ input[type='radio']:checked + label:hover {
.manageBtn {
margin: 1rem 0 0;
margin-top: 15px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 0 2px 2px var(--grey-border-box-color);
padding: 10px 10px;
border-radius: 5px;
font-size: 16px;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand Down Expand Up @@ -1578,7 +1579,7 @@ input[type='radio']:checked + label:hover {
}

.dropdowns {
background-color: white;
background-color: var(--bs-white);
border: 1px solid #31bb6b;
position: relative;
display: inline-block;
Expand Down Expand Up @@ -1676,7 +1677,7 @@ input[type='radio']:checked + label:hover {

.pluginStoreBtn {
width: 100%;
background-color: white;
background-color: var(--bs-white);
color: var(--brown-color);
border: 0.5px solid var(--brown-color);
}
Expand Down Expand Up @@ -1845,7 +1846,7 @@ input[type='radio']:checked + label:hover {
.sidebarstickyMemberDetail > input {
text-decoration: none;
margin-bottom: 50px;
border-color: #e8e5e5;
border-color: var(--grey-border-box-color);
width: 80%;
border-radius: 7px;
padding-top: 5px;
Expand Down Expand Up @@ -1918,12 +1919,12 @@ input[type='radio']:checked + label:hover {
}

.invitebtn {
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 0 2px 2px var(--grey-border-box-color);
border-radius: 5px;
font-size: 16px;
height: 60%;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand Down Expand Up @@ -1952,7 +1953,7 @@ input[type='radio']:checked + label:hover {
width: 30%;
padding: 40px 30px;
background: #ffffff;
border-color: #e8e5e5;
border-color: var(--grey-border-box-color);
border-width: 5px;
border-radius: 10px;
max-height: 86vh;
Expand Down Expand Up @@ -2004,13 +2005,13 @@ input[type='radio']:checked + label:hover {
.greenregbtnMemberDetail {
margin: 1rem 0 0;
margin-top: 10px;
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 0 2px 2px var(--grey-border-box-color);
padding: 10px 10px;
border-radius: 5px;
background-color: #eaebef;
font-size: 16px;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand All @@ -2026,7 +2027,7 @@ input[type='radio']:checked + label:hover {
border: 1px solid #eaebef;
padding: 10px 10px;
border-radius: 5px;
background-color: white;
background-color: var(--bs-white);
font-size: 16px;
color: #707070;
outline: none;
Expand Down Expand Up @@ -2112,9 +2113,9 @@ input[type='radio']:checked + label:hover {

.memberfontcreatedbtn {
border-radius: 7px;
border-color: #e8e5e5;
border-color: var(--grey-border-box-color);
background-color: #eaebef;
color: white;
color: var(--bs-white);
box-shadow: none;
height: 2.5rem;
width: max-content;
Expand Down Expand Up @@ -2266,7 +2267,7 @@ input[type='radio']:checked + label:hover {

.dateboxMemberDetail {
border-radius: 7px;
border-color: #e8e5e5;
border-color: var(--grey-border-box-color);
outline: none;
box-shadow: none;
padding-top: 2px;
Expand Down Expand Up @@ -2301,7 +2302,7 @@ input[type='radio']:checked + label:hover {

input::file-selector-button {
background-color: black;
color: white;
color: var(--bs-white);
}

.Outline {
Expand Down Expand Up @@ -2484,8 +2485,8 @@ form label {
form > input {
display: block;
margin-bottom: 20px;
border: 1px solid #e8e5e5;
box-shadow: 2px 1px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 2px 1px var(--grey-border-box-color);
padding: 10px 20px;
border-radius: 5px;
background: none;
Expand Down Expand Up @@ -2647,7 +2648,7 @@ form > input {
background-color: var(--dropdown-border-color);
border-color: var(--dropdown-border-color);
margin-top: 1rem;
color: white;
color: var(--bs-white);
margin-bottom: 1rem;
width: 100%;
transition: background-color 0.2s ease;
Expand Down Expand Up @@ -3014,13 +3015,13 @@ form > input {
}
}
.addbtnOrgPost {
border: 1px solid #e8e5e5;
box-shadow: 0 2px 2px #e8e5e5;
border: 1px solid var(--grey-border-box-color);
box-shadow: 0 2px 2px var(--grey-border-box-color);
border-radius: 5px;
font-size: 16px;
height: 60%;
width: 60%;
color: white;
color: var(--bs-white);
outline: none;
font-weight: 600;
cursor: pointer;
Expand Down

0 comments on commit 2327a4b

Please sign in to comment.